A npm / gulp kick start template for fast and modern front-end development.
Featues:
- Sass compilation with gulp-sass
- Es6 transpilation with babel-loader
- JavaScript exports with webpack
- Auto-refresh browser with browser sync
- Source maps in dev mode
- Minification in production (Clean CSS and Uglify)
- Autoprefix CSS with Autoprefixer
- Better errors message in gulp with Plumber and Notify
- Compress images with Image min
The SASS folder structure:
sass/
├── helpers/
│ ├── _variables.scss
│ ├── _bourbon.scss
│ ├── _functions.scss
│ └── _mixins.scss
├── base/
│ ├── _reset.scss
│ └── _typography.scss
├── components/
│ └── ...
├── layout/
│ ├── _footer.scss
│ ├── _global.scss
│ └── _header.scss
└── style.sass
Sass Documentation : https://istuffs.github.io/starter-kit/
You first need to have node.js installed. You should use git with your project.
- Clone it
git clone https://github.com/iStuffs/starter-kit.git my-new-project- Update your github user in the package.json
...
"gitUser": "Your-GitHubUserName",
...- kickstart your project
cd my-new-project
npm run starter- Develop awesome things
npm start- Build assets for production
npm run build- Deploy on git hub pages
npm run deploy