1.2.1

This release addresses regressions introduced in the latest 1.2.1 release due to upstream dependencies and changes in our tooling workflow and recipes. A full list of changes can be found here

Downloads available 📦

Beginners

⬇️ polymer-starter-kit-light-1.2.1 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or with Python 3 python -m http.server 8080), WAMP or another local server setup to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.2.1.zip - the kit with all of our build process & developer tooling and (optional) offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Updating from 1.2.0 to 1.2.1

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.2.0'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.2.1'

Polymer Starter Kit 1.2.0

Polymer Starter Kit 1.2.0 is now out! 🚀 Check out our release highlights, changelog or skip straight to the Downloads below.

Highlights

🆕 Polymer updates

• Updated to support Polymer 1.2.3
• Updated to use Polymer.dom() in app.js (more idiomatic)

🛀 Bug fixes

• Fixed a 300ms click delay for menu items on iOS
• Fixed a regression causing the drawer menu to not work in Firefox 38
• Switched to layout mixins for menu items
• Switch tests to use webcomponents-lite
• Remove extraneous tags
• Trimmed CSS bloat in the app-theme.html

🍮 Recipes

• New GitHub pages deployment recipe
• Updated Babel recipe to support Babel 6 & ES2015 preset

🔩 Build process

• Lint all code with JSCS and JSHint
• gulp-cssmin is deprecated. Switched to gulp-minify-css instead
• Use gulp-minify-inline to minimize the elements.vulcanized.html after generation
• Reverted to using Vulcanize over Polybuild. Users required more direct configuration.
• Switch to using dist() in tasks
• Improve stability of image optimisation by disabling caching

📔 Documentation

A new tutorial for getting setup, adding your own pages to Polymer Starter Kit and deploying to Firebase is also now available.

Downloads available 📦

Beginners

⬇️ polymer-starter-kit-light-1.2.0 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or with Python 3 python -m http.server 8080), WAMP or another local server setup to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.2.0.zip - the kit with all of our build process & developer tooling and (optional) offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Updating from 1.x.y to 1.2.0

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.1.1'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.2.0'

Troubleshooting

TypeError: Cannot convert undefined or null to object in task lint

If you see an error like this while running gulp or gulp serve, you may not have correctly copied over the .jshintrc and .jscsrc files needed for linting when extracting/copying Polymer Starter Kit. On Mac, enable showing hidden files, then try extracting/copying Polymer Starter Kit again. This time the extra linting files needed should be visible so you can copy them over without issues.

Thanks! Try 1.2.0 and file bugs! 🐛

As always, a huge thank you to our many lovely contributors. If you find anything out of place with this release, please file a bug and we'll take a look at it as soon as possible. We try to ensure PSK works great on all our target devices and are always interested in bug reports to improve this further ⭐

Polymer Starter Kit 1.1.1

This is a patch release intended to improve the Polymer Starter Kit build process further 🔧

Highlights ⚡

• Support external CSS/JS out of the box
• Bring more inline with Gulp best practices
• Allow support for dynamic project folders for WCT
• Remove double-page refresh when using JSHint/JS tasks
• Remove del race condition causing build breakage for a few folks

A full changelog of what's been updated since 1.1.0.

Downloads available 📦

Beginners

⬇️ polymer-starter-kit-light-1.1.1 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or for Windows python -m http.server 8080, WAMP or another local server setup) to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.1.1.zip - the kit with all of our build process & developer tooling and (optional) offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Updating from 1.x.y to 1.1.1

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.1.0'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.1.1'

Thanks! Try 1.1.1 and file bugs! 🐛

As always, a huge thank you to our many lovely contributors. If you find anything out of place with this release, please file a bug and we'll take a look at it as soon as possible.

Polymer Starter Kit 1.1.0

Polymer Starter Kit 1.1.0 is out! 🍭 Check out our release notes or skip to Downloads below.

New Recipes 🍰

This release includes the addition of our first PSK recipes - optional walkthroughs for updating the default setup to support things like ECMAScript 2015 in your elements or some of our recent Polymer performance patterns. We're hoping to grow this collection as time goes on:

• ES2015 support using Babel
• Polymer Performance Recipe
• Use PSK with Chrome Dev Editor

Revised Build process 🔧

One of the larger changes to our build pipeline in this release is support for Polybuild. This is an all-in-one build tool for Polymer that combines vulcanize, crisper, and polyclean into one easier to use solution for optimizing Polymer applications for production. The benefit of us switching to this tool is hopefully fewer Polymer-specific tools you need to think about configuring for your workflow.

// Polybuild will take care of inlining HTML imports,
// scripts and CSS for you.
gulp.task('vulcanize', function () {
  return gulp.src('dist/index.html')
    .pipe(polybuild({maximumCrush: true}))
    .pipe(gulp.dest('dist/'));
});

We've also added numerous small fixes to other parts of the build process, including ensuring JSHint is run on changes to element sources, adding missing callbacks, removing unused dependencies and a few other small bits.

Support for Chrome for Android Splashscreen ⌚

When a user starts a webapp from their home screen, the first thing they will see is a white screen. This will stay from a couple of seconds to dozens of seconds depending on the web application, the device and the connection. The white screen is being shown as long as the renderer has nothing to render for the website.

Reusing metadata from the Web App Manifest (manifest.json), we're able to theme this white screen using a webapp's name, icons and a new property called background_color. This informs the user-agent that this background color can be used as a background for the splashscreen. PSK supports this via our manifest.json file. Just customise it to suit your webapp's colors.

Other release highlights

• Multiple fixes to the layout to improve the condensing effect
• Updated to support Polymer 1.1.0 and include updated best practices like including <style> inside of <template>.
• Updates to support Platinum Service Worker Cache 1.2.0
• Addressed issues with relative paths for routing import
• Added support and advice around 1.1.0's Shared Styles
• Scroll to top when switching views/pages as scroll positioning should be reset

A full changelog of what's been updated since 1.0.3.

Downloads available 📦

Beginners

⬇️ polymer-starter-kit-light-1.1.0 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or for Windows python -m http.server 8080, WAMP or another local server setup) to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.1.0.zip - the kit with all of our build process & developer tooling and (optional) offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Updating from 1.0.x to 1.1.0

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.0.3'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.1.0'

Thanks! Try 1.1.0 and file bugs! 🐛

As always, a huge thank you to our many lovely contributors. If you find anything out of place with this release, please file a bug and we'll take a look at it as soon as possible.

Polymer Starter Kit 1.0.3

PSK 1.0.3 is out! It introduces our migration from <paper-header-panel> to <paper-scroll-header-panel>, improving scroll performance in our app layout and easing overall developer ergonomics. Further details about this release can be found lower down 👇

Performance

In previous releases, PSK used <paper-header-panel> and a tall waterfall layout which would shrink on scroll. While this worked well on desktop and in Chrome for Android, the Polymer team received feedback about scroll perf being an issue on other platforms.

This has since been improved in <paper-scroll-header-panel>, which comes with some welcome scroll perf wins. Compare the Timeline frame-rate for scroll in PSK 1.0.2 to 1.0.3:

Downloads available

Beginners

⬇️ polymer-starter-kit-light-1.0.3 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or for Windows python -m http.server 8080, WAMP or another local server setup) to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.0.3.zip - the kit with all of our build process & developer tooling and (optional) offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Release highlights

• Migrated to <paper-scroll-header-panel> bringing improved UX and scroll performance to the layout
• Service Worker support via the Platinum elements are now an opt-in documented in the README
• Added connect-history-api-fallback improving cross-device navigation when using BrowserSync
• Misc fixes: <dom-module> now moved to the bottom of the file, logPrefix for PSK added to BrowserSync config, Gulpfile adjusted as vulcanize --strip no longer exists.

A full changelog of what's been updated since 1.0.2.

Yeoman generator V1.0.5

If you prefer to use a CLI to scaffold out your Polymer projects, our friends over at the Polymer generator for Yeoman have also just pushed out v1.0.5 with full support for Polymer Starter Kit 1.0.5.

Updating from 1.0.x to 1.0.3

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.0.2'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.0.3'

Shout-outs

With special thanks to @chuckh @Alienuser @yufengg @azakus for their awesome contributions to this release ⭐

Polycasts

A number of new Polycasts with Rob Dodson are also now available covering PSK. These include:

• Episode 18 - Polymer Starter Kit
• Episode 19 - Going offline with PSK

Check them out! 👌

1.0.2

Polymer Starter Kit 1.0.2 includes a refactor of our responsive layout to align with the latest recommendations from the Material Design specification. It also includes several bug-fixes and improvements to scroll behaviour and overall cleanliness of the codebase.

Downloads available

Beginners

⬇️ polymer-starter-kit-light-1.0.2 - a simpler start with just Polymer, some elements and layout.

This requires no additional tools from us and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or for Windows python -m http.server 8080, WAMP or another local server setup) to get it running.

Intermediate - Advanced users

⬇️ polymer-starter-kit-1.0.2.zip - the kit with all of our build process & developer tooling and offline support. Use this version if building something you're targeting for production.

You will need to run a one-liner to install the Node and Bower dependencies needed once downloaded. We walk you through this in our README.

Yeoman user?

If you prefer to use a CLI to scaffold out your Polymer projects, our friends over at the Polymer generator for Yeoman have also just pushed out v1.0.4 with full support for Polymer Starter Kit 1.0.2.

Release highlights

• Dropped need to remove unresolved from app.js (Polymer does this itself now)
• Moved app-theme from app/elements to app/styles/
• Fixed gulpfile.js to use ShadyDOM by referencing webcomponents-lite.min.js instead of webcomponents.min.js in that file.
• Dropped inclusion of the .bowerrc file as we're just using the Bower default target
• Improved paper-header-panel scroll behaviour cross-browser

A full changelog of what's been updated since 1.0.1 is available.

Updating from 1.0.x to 1.0.2

If you've previously downloaded a copy of the full Starter Kit and would like to update to the latest version, here's a git workflow for doing so:

git init
git checkout -b master
git add .
git commit -m 'Check-in 1.0.1'
git remote add upstream https://github.com/polymerelements/polymer-starter-kit.git
git fetch upstream
git merge upstream/master
# resolve the merge conflicts in your editor
git add . -u
git commit -m 'Updated to 1.0.2'

Frequently Asked Questions

We've recently added an FAQ section to our README where we'll be adding answers to commonly asked questions about Starter Kit in the issue tracker and Slack. We recommend checking the README or tracker if curious about something.

Easier theming with third-party tools

MaterialPalette.com now includes support for choosing a Material Design palette and generating a Polymer Starter Kit friendly app theme. Generate a palette file that contains CSS properties and update your app/styles/app-theme.html file with your chosen colors.

Shout-outs

With special thanks to @chuckh @arthurvr @moneal @flaiker for their awesome contributions to this release ⭐

v1.0.1

We're happy to announce Polymer Starter Kit 1.0.1 - this is our first maintenance release since launching at Google I/O and includes several improvements, highlighted lower down.

Downloads available

Beginners

• polymer-starter-kit-light-1.0.1 - a simpler start with just Polymer, some elements and layout. This requires no additional tools and already has dependencies checked in. You can download this version, cd app into it and just run python -m SimpleHTTPServer 8080 (or an alternative) to get it running.

Intermediate - Advanced users

• polymer-starter-kit-1.0.1.zip - the kit with all of our build process & developer tooling. You will need to run a one-liner to install the Node and Bower dependencies needed once downloading.

Highlighted changes since 1.0.0

• 0b11565 Close the drawer after menu item is selected if narrow
• 9e9516d Improve hamburger menu button for additional breakpoints
• be3f9b6 Adjusted watch paths to allow back CSS reloading
• 935ae6a Make desktop-x-large media queries more sensible
• eba9413 Update to 1.0 syntax: template-bound > dom-change
• 7d10052 Avoid appTitle scrolling in #mainToolbar - now fixed
• fd4a101 Improve padding for #mainToolbar
• fb042a7 The neon-elements collection (for animation) are now included
• 26073d7 We decided to drop the Apache config
• 2e7aa8e Improved equal left and right padding to paper-material cards

Full changelog

v1.0.0...v1.0.1

Polymer Starter Kit 1.0.0

Welcome to our first major release of Polymer Starter Kit. Below, you'll find a few download options.

Beginners

• polymer-starter-kit-light-1.0.0 - a simpler start with just Polymer, some elements and layout. This requires no additional tools and already has dependencies checked in.

Intermediate - Advanced users

• polymer-starter-kit-1.0.0.zip - the kit with all of our build process & developer tooling. You will need to run a one-liner (npm run deps) to install the Node and Bower dependencies needed once downloading.
• polymer-starter-kit-dependencies-checked-in-1.0.0.zip - same as the above, but with all external dependencies checked in. As long as you have Gulp installed (npm install -g gulp) you can download this package and just run gulp serve to get started.

Windows users

If you are a Windows user using polymer-starter-kit-1.0.0.zip, we recommend running the installation one liner below from the root of your downloaded Polymer Starter Kit, rather than npm run deps as covered in our README. We will be simplifying the installation instructions for all users in 1.0.1.

Install:

$ npm install [email protected] && npm install -g gulp && npm install -g bower && npm install && bower install

If you're using polymer-starter-kit-dependencies-checked-in-1.0.0.zip on Windows, you may need to extract this using a third-party zip manager, like WinRar or 7-zip.