Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/istuffs/starter-kit
:rocket: kit de démarrage
https://github.com/istuffs/starter-kit
boilerplate gulp sass
Last synced: 2 months ago
JSON representation
:rocket: kit de démarrage
- Host: GitHub
- URL: https://github.com/istuffs/starter-kit
- Owner: iStuffs
- Created: 2016-08-26T09:52:53.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T03:43:45.000Z (about 2 years ago)
- Last Synced: 2024-12-05T22:33:24.627Z (2 months ago)
- Topics: boilerplate, gulp, sass
- Language: SCSS
- Homepage:
- Size: 9.03 MB
- Stars: 9
- Watchers: 2
- Forks: 2
- Open Issues: 34
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Front-end **Starter Kit**
A npm / gulp kick start template for fast and modern front-end development.
**Featues**:
- Sass compilation with [gulp-sass](https://www.npmjs.com/package/gulp-sass)
- Es6 transpilation with [babel-loader](https://www.npmjs.com/package/babel-loader)
- JavaScript exports with [webpack](https://webpack.js.org/)
- Auto-refresh browser with [browser sync](https://www.npmjs.com/package/browser-sync)
- [Source maps](https://www.npmjs.com/package/gulp-sourcemaps) in dev mode
- Minification in production ([Clean CSS](https://www.npmjs.com/package/gulp-clean-css) and [Uglify](https://www.npmjs.com/package/gulp-uglify))
- Autoprefix CSS with [Autoprefixer](https://www.npmjs.com/package/gulp-autoprefixer)
- Better errors message in gulp with [Plumber](https://www.npmjs.com/package/gulp-plumber) and [Notify](https://www.npmjs.com/package/gulp-notify)
- Compress images with [Image min](https://www.npmjs.com/package/gulp-imagemin)
**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](https://nodejs.org/en/) installed.
You should use [git](https://git-scm.com/) with your project.
## How to use
1. Clone it
```bash
git clone https://github.com/iStuffs/starter-kit.git my-new-project
```
2. Update your github user in the package.json
```json
...
"gitUser": "Your-GitHubUserName",
...
```
3. kickstart your project
```bash
cd my-new-project
npm run starter
```
4. Develop awesome things
```bash
npm start
```
5. Build assets for production
```bash
npm run build
```
6. Deploy on git hub pages
```bash
npm run deploy
```