Front-end Starter Kit

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/

What you need ?

You first need to have node.js installed. You should use git with your project.

How to use

1. Clone it

git clone https://github.com/iStuffs/starter-kit.git my-new-project

2. Update your github user in the package.json

...
"gitUser": "Your-GitHubUserName",
...

3. kickstart your project

cd my-new-project
npm run starter

4. Develop awesome things

npm start

5. Build assets for production

npm run build

6. Deploy on git hub pages

npm run deploy