Skip to content

Latest commit

 

History

History
115 lines (82 loc) · 3.55 KB

set-up.md

File metadata and controls

115 lines (82 loc) · 3.55 KB

Set up

Follow the instructions below to install, build, and run the Project Hoverboard locally in less than 15 minutes.

Install the Hoverboard and dependencies

  1. Install Node.js (node) version 4 or above. Node.js includes Node Package Manager (npm) by default. The Hoverboard uses npm for Polymer CLI.

  2. Verify that you're running node version 4 or above and npm version 2.15 or above.

    node -v
    v4.4.7
    
    npm -v
    2.15.8
    
  3. Install Bower.

    npm install -g bower
    

    Note: the -g flag installs Gulp and Bower globally, so you may need to execute the script with sudo privileges. The reason they are installed globally is because some scripts in the Hoverboard expect bower to be available from the command line.

  4. Install polymer-cli:

    npm i -g polymer-cli
    
  5. Fork this repository

  6. Clone it locally.

  7. cd into the base directory of your Hoverboard project.

  8. Install the application dependencies.

    bower install
    

Directory structure

The diagram below is a brief summary of the directories within the PSK.

/
|---bower_components/
|---build/
|   |---bundled/
|   |---unbundled/
|---data/
|---docs/
|---images/
|---scripts/
|---src/
|   |---behaviors/
|   |---effects/
|   |---elements/
|   |---js-wrappers/
|   |---pages/
|   |---styles/
|
  • bower_components/ is the place for project dependencies.
  • build/ is the directory to deploy to production.
  • bundled/ - here all fragments are bundled together to reduce the number of file requests. Optimal for sending to clients or serving from servers that are not HTTP/2 compatible.
  • unbundled/ - an app where fragments are unbundled. Optimal for HTTP/2-compatible servers and clients.
  • data/ folder with all data for the template including config, blog, partners, schedule, sessions, speakers, team and videos.
  • docs/ contains optional "recipes" (how-to guides) for adding features to your application or for using optional tools or editors.
  • images/ is for static images.
  • scripts/ is the place for JS scripts.
  • src/ is where you store all of your source code and do all of your development.
  • behaviors/ folder for custom behaviors.
  • effects/ is where you keep your effects for instance scroll-effects.
  • elements/ is where you keep your custom elements.
  • js-wrappers/ is where you keep your custom elements.
  • pages/ is where you keep your pages' description.
  • styles/ houses your app's shared styles and CSS rules.

Build and serve

The Hoverboard is ready to be built and ran locally.

  1. cd into the base directory of your PSK project.

  2. Serve the app locally.

    polymer serve
    
  3. Build the app.

    polymer build
    

    More options you can find on polymer-cli repository.

Next steps

Now that your Hoverboard is up and running, learn how to configure app for your needs, or how to deploy the app to the web.