Live preview of the project: here
Gulp is used as task runner for this project, you need nodeJS installed on your machine in order to install Gulp and its plugins.
- Clone the project to your maching
- To install all the developement and production dependencies, from within the project directory run the command:
All the dependencies can be found on package.json file.
. ├── builds ├── developement ├── production ├── components ├── sass ├── scripts
- To watch your modifications in The developement environment run the command:
If you are on windows, You may face probelms running the gulp command, you need to install gulp globally by running the command:
npm install -g gulp
- You can now preview your changes on the localhost server, the browser will auto-reload whenever you make modifications:
HTML: Make your modifications on the file:
builds/developement/index.html, this file will get minified when you run the gulp command in the production environment
components/scriptsthen add them to the jsSources array in the
gulpfile.js, gulp will concatenate all the JS files found in this array.
The project uses browserify to install and bundle libraries and frameworks.
When your project is ready for deployment you can run the gulp command in the production environment:
This will generate an optimized version of the project on the production folder:
- Minified HTML code
- One Compressed CSS file
- Optimized and compressed images