Polymer Starter Kit is a boilerplate for web development using Web Components and modern tools.
Keeping up to date with Web Starter Kit, HTML5 Boilerplate, Polymer generator and Gulp generator.
Following The 10 Commandments of Modern Web Application
✨ DEMO ✨
- Clean index.html
- Gulp tasks per file
- Using Polymer Demo element with Polymer Theme based on BEM Methodology
- Sass CSS Preprocessor with Ruby
- PSK need CSS Preprocessor for Variables, Loops, Mixins and other features
- LibSass is a C/C++ port of the Sass engine
- SCSS have CSS like syntax
- Check out the styles dir
- Ready to use any template engine
- How to add any template engine for any developers
- Autoprefixer for CSS
- Asset revisioning for CSS, HTML and JS by appending content hash to their filenames
- Compress text files with Pako for avoiding the overhead of on-the-fly compression on server
- PageSpeed Insights for performance tuning
- Built-in preview server with BrowserSync
- Automagically wire-up dependencies installed with Bower
- Vulcanize with Content Security Policy
- web-component-tester support
- Quick deploy to CDN Hosting
- GitHub Pages - more info
# Add Ruby repository
sudo add-apt-repository -y ppa:brightbox/ruby-ng
# Script to install NodeSource repository
curl -sL https://deb.nodesource.com/setup | sudo bash -
# Install Git, Node.js and Ruby
sudo apt-get install -y git nodejs ruby2.2
# Install Bower, Gulp and NPM
sudo npm install -g bower gulp npm
# Install Sass
sudo gem install sass
- Atom is great editor for web development, you can use Atom on Ubuntu script.
- For other OS, you can use Ubuntu VM Image or Google Search 😉
Fork this repository
or
git clone https://github.com/StartPolymer/polymer-starter-kit.git <my-repo-name>
cd <my-repo-name>
git branch -m psk
git checkout -b master
git remote rename origin psk
git remote add origin https://github.com/<user>/<my-repo-name>.git
git push -u origin master
bower install && npm install
- Gulp variables are in the file gulp/psk-config.js
http://localhost:9000
and http://<Your IP>:9000
gulp serve
gulp serve:dist
gulp
Check out the file structure of Polymer Demo element
gulp build:el
psk-
prefix in file names is for git merging with psk
branch without conflicts
First you need to be sure you have a gh-pages branch. If you don't have one, you can do the following:
git checkout --orphan gh-pages
git rm -rf .
touch README.md
git add README.md
git commit -m "Init gh-pages"
git push --set-upstream origin gh-pages
git checkout master
gulp deploy:gh
gulp pagespeed
Use a recipes for integrating other popular technologies like CoffeeScript. Or this a recipes.
bower install web-component-tester --save-dev
npm install web-component-tester --save-dev
- Fork it
- Create your feature branch (
git checkout -b my-new-feature
) - Make your changes
- Run the tests, adding new ones for your own code if necessary
- Commit your changes (
git commit -am 'Added some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request
Copyright (c) 2015 Start Polymer (http://startpolymer.org)