Use the polymer instructions to get it going.
- Get a copy of the code.
- Install the dependencies if you don't already have them.
- Modify the application to your liking.
- Deploy your production code.
With Node.js installed, run the following one liner from the root of your Polymer Starter Kit download:
npm install -g gulp bower && npm install && bower install
The full Wallcology Admin requires the following major dependencies:
- Node.js, used to run JavaScript tools from the command line.
- npm, the node package manager, installed with Node.js and used to install Node.js packages.
- gulp, a Node.js-based build tool.
- bower, a Node.js-based package manager used to install front-end packages (like Polymer).
To install dependencies:
- Check your Node.js version.
node --version
The version should be at or above 0.12.x.
-
If you don't have Node.js installed, or you have a lower version, go to nodejs.org and click on the big green Install button.
-
Install
gulp
andbower
globally.
npm install -g gulp bower
This lets you run gulp
and bower
from the command line.
- Install the Wallcology Admin's local
npm
andbower
dependencies.
cd polymer-starter-kit && npm install && bower install
This installs the element sets (Paper, Iron, Platinum) and tools the Wallcology Admin requires to build and serve apps.
gulp serve
This outputs an IP address you can use to locally test and another that can be used on devices connected to your network.
gulp test:local
This runs the unit tests defined in the app/test
directory through web-component-tester.
gulp
Build and optimize the current project, ready for deployment. This includes linting as well as vulcanization, image, script, stylesheet and HTML optimization and minification.
Polymer 1.0 introduces a shim for CSS custom properties. We take advantage of this in app/styles/app-theme.html
to provide theming for your application. You can also find our presets for Material Design breakpoints in this file.
Read more about CSS custom properties.
Web apps built with Polymer Wallcology Admin come configured with support for Web Component Tester - Polymer's preferred tool for authoring and running unit tests. This makes testing your element based applications a pleasant experience.
Read more about using Web Component tester.
Polymer uses Bower for package management. This makes it easy to keep your elements up to date and versioned. For tooling, we use npm to manage Node.js-based dependencies.
How do I add new JavaScript files to Wallcology Admin so they're picked up by the build process?
At the bottom of app/index.html
, you will find a build block that can be used to include additional
scripts for your app. Build blocks are just normal script tags that are wrapped in a HTML
comment that indicates where to concatenate and minify their final contents to.
Below, we've added in script2.js
and script3.js
to this block. The line
<!-- build:js scripts/app.js -->
specifies that these scripts will be squashed into scripts/app.js
during a build.
<!-- build:js scripts/app.js -->
<script src="scripts/app.js"></script>
<script src="scripts/script2.js"></script>
<script src="scripts/script3.js"></script>
<!-- endbuild-->