Project Hoverboard - GDG DevFest 2016 site template
Project Hoverboard is the next generation conference website template after Project Zeppelin and more optimized version - Project Zeppelin-Grunt.
Template was build using Polymer according to Material Design guidelines and based on Polymer Starter Kit Plus. The site is responsive, fast and supports offline access (if you are using HTTPS protocol).
Template is brought by Oleh Zasadnyy from GDG Lviv.
Do you like it? Show your support - please, star the project.
Live demo
Features
- Material design
- Polymer
- Offline access
- Responsive
- Animations
- Integrated speakers and sessions management
- SVG icons
- SEO friendly
- Optimized and fast
- Editable theme colors
- ES2015 (compiles with Babel)
- Quick deploy
Quick-start guide
- Fork this repo and clone locally or download and extract Project Hoverboard to where you want to work.
- With Node.js installed, run the following one liner from the root of your Hoverboard download:
npm run install:complete # Alias for "sudo npm install -g npm && sudo npm install -g bower gulp && npm install && bower install"
gulp init # Initialize your app - download fonts from Google Fonts and analytics.js
Requirements
Project 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 0.12.x or above.
-
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 projects's local
npm
andbower
dependencies.
cd hoverboard && npm install && bower install
This installs the element sets and tools the hoverboard template requires to build and serve apps.
Modify to suit your needs
- Event info - metadata folder
- Theme colors - variables.css
- Deployment configs
Development workflow
Initialize your app
gulp init
Init task run download:analytics task and download:fonts task
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.
Build and serve the output from the dist build
gulp serve:dist
gulp serve:gae
Run tests
gulp test:local
This runs the unit tests defined in the app/test
directory through web-component-tester.
To run tests Java 7 or higher is required. To update Java go to http://www.oracle.com/technetwork/java/javase/downloads/index.html and download JDK and install it.
Build & Vulcanize
gulp
Build and optimize the current project, ready for deployment. This includes vulcanization, image, script, stylesheet and HTML optimization and minification.
Deploy app
- For GAE or GCS install Google Cloud SDK
- For Firebase install Firebase command line tools
- Setup hosting in config file
Deploy to development environment
gulp deploy:dev
Deploy to staging environment
gulp deploy:stag
Deploy to production environment
gulp deploy:prod
Promote the staging version to the production environment
gulp deploy:promote
Tools
Download newest script analytics.js
You need download newest script analytics.js from Google, because link https://www.google-analytics.com/analytics.js has set only 2 hours cache. Here is analytics.js changelog. Local copy of this script is for better load page performance.
gulp download:analytics
Download Google Fonts
Download Google Fonts for load page performance and offline using. Fonts list for download is in file fonts.list.
gulp download:fonts
PageSpeed Insights
gulp pagespeed
Update versions of dependencies to the latest versions
# Install tool
npm install -g npm-check-updates
# Check latest versions
npm run check:ver # Alias for "ncu && ncu -m bower"
# Update to the latest versions
npm run update:ver # Alias for "ncu -u && ncu -um bower"
Who is using template?
Going to use template? Go on! The only thing we ask - let us know at lviv@gdg.org.ua so we can include you to this list, or make a pull request.
Roadmap
- Deploy to GitHub pages
- Implement Progressive Web App template
- Better ES2015 support
- Contact page
- My schedule
- Push notification
Contributing
Project Hoverboard is still under development and it is open for contributions. Feel free to send PR. If you have any questions, feel free to contact Oleh Zasadnyy.
General workflow
- 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
Contributors
Maintainer: @ozasadnyy.
######The GDG App, GDG[x] are not endorsed and/or supported by Google, the corporation.
License
Project is published under the MIT license Feel free to clone and modify repo as you want, but don't forget to add reference to authors :)