Giter Club home page Giter Club logo

ep-tools's Introduction

EP TOOLS Polymer based app

Use the polymer instructions to get it going.

Getting Started

  1. Get a copy of the code.
  2. Install the dependencies if you don't already have them.
  3. Modify the application to your liking.
  4. Deploy your production code.

Get the code

Install dependencies

Quick-start (for experienced users)

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

Prerequisites (for everyone)

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:

  1. Check your Node.js version.
node --version

The version should be at or above 0.12.x.

  1. 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.

  2. Install gulp and bower globally.

npm install -g gulp bower

This lets you run gulp and bower from the command line.

  1. Install the Wallcology Admin's local npm and bower 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.

Development workflow

Serve / watch

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.

Run tests

gulp test:local

This runs the unit tests defined in the app/test directory through web-component-tester.

Build & Vulcanize

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.

Application Theming

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.

Unit Testing

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.

Dependency Management

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.

Frequently Asked Questions

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-->

ep-tools's People

Contributors

aperritano avatar

Watchers

 avatar Francesco Novellis avatar Aijaz Ansari avatar James Cloos avatar Paulo Guerra avatar Nanocontroller avatar  avatar Gianluca Venturini avatar  avatar Matteo Palvarini avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.