Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
lib
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Polymer Boilerplate

Polymer Boilerplate provides everything, you need, to start a new website project in a minute.

Table of contents:

Features

  • Web Components ready. You can create custom reusable HTML elements with Polymer Library.
  • Ready for writing code in ES6+ and ECMAScript modules.
  • Provides tools to build scripts, styles and Web Components.
  • Tools to tests provided by Polymer.
  • You can runs a local web server.

What's included by default

Component Description
Polymer Library Unlock the Power of Web Components.
app-drawer app-drawer is a navigation drawer that can slide in from the left or right.
paper-progress A Material Design progress.
paper-icon-button A Material Design icon button.
Library Description
Babel helpers Collection of helper functions used by Babel transforms.
WC es5-adapter According to the spec, Custom Elements must be ES6 classes.
Model Persistence Library intended for data persistence using HTTP or Storage API.
Element View It's view layer to HTMLElement, that responsible for Event Handling.
ObjectModel Object models validate nested object properties against a definition tree. You may consider them as definitions of classes with advanced validation options.
axios Promise based HTTP client for the browser and node.js
Feature Description
Material Design Color The colour palette, based on Google's Material Design, for use in your project.
Normalize and reset styles Normalized stylesheets, which you can adjust with Sass variables and mixins.
Bootstrap 4 Grid Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.

How to create a new project

Clone this repository.

git clone https://github.com/mikoweb/polymer-boilerplate.git /path/to/your/project
git remote remove origin

Install dependencies.

npm install

How to build my project

Inside gulpfile.js placed all necessary tasks.

To build full project run command:

gulp dist

Below is a list with all available tasks.

gulp tasks

Run and tests

All information is available in the Polymer Docs.

https://polymer-library.polymer-project.org/3.0/docs/tools/polymer-cli-commands

https://polymer-library.polymer-project.org/3.0/docs/tools/tests

Directory structure

Path Description
build Folder used by Polymer Bundler, here you will find built file for HTML import. Always use it on production.
bundle Bundled scripts and stylesheets.
fragments Components bundles.
gulp Gulp tasks source code.
lib Good place to insert external libraries.
node_modules Npm packages.
pages Here put HTML files.
src/elements Here put your Web Components, reserved for Custom Elements.
src/blocks Similar to src/elements but it's for large/layout/nested elements like <app-layout>.
src/style-modules Directory for components shared styles.
src/app/index.js Main file of your JavaScript application.
src/app Put scripts and use ECMAScript imports.
static Reserved for static files like images, fonts.
style Reserved for Sass/CSS source code.
test Reserved for test source code.
globals.default.json Contains a list of global variables included by bundle/core.min.js. Required by rollup.js bundler.

License

Copyright (c) 2019, Rafał Mikołajun All rights reserved.

This project is under the BSD 3-clause license. See the complete license in the file:

LICENSE

About

Polymer Boilerplate provides everything, you need, to start a new website project in a minute.

Topics

Resources

License

Packages

No packages published