This repository contains an easy to use, lightweight, front-end oriented framework for your new project using NPM and Gulp.
Bundled as a SASS friendly environment, complete with BrowserSync for ease of development.
- JavaScript ready
- SASS support
- NPM support
- Live browser preview
- Code build for production
- Automatic build file .zip compression
- Command Prompt Feedback & Error Reporting
Using your command line of choice, navigate to the cloned framework folder.
You will need to install all Node dependencies, which is an automated process. Simply run the following command,
$ npm install
If you do not have Gulp installed globally, install it using the following.
$ npm install -g gulp
This framework uses Gulp to both watch and compile the project. Run the following command to get started,
$ gulp
Running gulp will compile the contents of the src folder, and copy them to the dist folder.
It will also launch BrowserSync, which will open a build of your project (localhost:3000) and watch for any changes. If a change is made, the project will automatically recompile and your browser page will refresh. You can also open (localhost:3001) in your browser at this stage to view the Browsersync user interface.
$ gulp build
Running gulp build will compile the contents of the src folder, minifying any found stylesheets and JavaScript, then output it as a bundled production-ready build folder. It will also compress the build folder as a .zip file.
- BrowserSync - Synchronised browser testing.
- Gulp - Automation toolkit.
- NPM - Package manager.
- SASS - CSS extension language.
- Gulp build seperation for production
- Compress as .zip functionality added
- Command line feedback & error reporting progression
- Detailed gulpfile commenting added
- Work space environment updated
- Default folders and stylesheets added
- Basic gulp & npm environment build
- Browsersync implemented
- SASS and JavaScript support added