Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Starter kit for front end development.

Features

Automation

  • Gulp
  • Webpack
  • Browsersync(html/ssi/php)

HTML

  • Pug
    • pug-linter

CSS

  • normalize.css
  • Sass(node-sass)
    • sass-bulk-import
    • node-sass-package-importer
    • sourcemaps
    • csso
    • postcss
      • autoprefixer
      • css-mqpacker
  • Sprite(png/svg)

JavaScript

  • BabelJS
  • ESLint(eslint-config-airbnb)

Images

  • imagemin
    • pngquant
    • mozjpeg
    • svgo
    • optipng
    • gifsicle

Component Guide

  • fractal

Requirements

  • node >= 9.3.0
  • gulp >= 3.9.1
  • sass >= 3.4.24

Getting Started

# clone
$ git clone git@github.com:raym-design/frontend-starter-kit.git
$ cd frontend-starter-kit

# Install Dependencies
$ yarn install

# Run the Application
$ yarn run start

# Deploy for production
$ yarn run dist

Directory Structure

.
├── .babelrc
├── .browserslist
├── .eslintrc
├── .gitignore
├── .sprite-png-template
├── .sprite-svg-template
├── fractal.config.js
├── gulpfile.js
├── package.json
├── README.md
├── dist -> client-side public
├── docs -> fractal components guide
├── src
│   ├── docs
│   │   ├── components
│   │   │   ├── _preview.hbs.html
│   │   │   └── headings.hbs
│   │   └── index.md
│   ├── img
│   │   └── sprite
│   │       ├── png
│   │       └── svg
│   ├── js
│   │   └── app.js
│   ├── pug
│   │   ├── inc
│   │   │   ├── core
│   │   │   │   ├── _base.pug
│   │   │   │   ├── _config.pug
│   │   │   │   └── _mixin.pug
│   │   │   ├── layout
│   │   │   │   ├── _footer.pug
│   │   │   │   └── _header.pug
│   │   │   └── module
│   │   ├── index.pug
│   │   └── setting.json
│   └── scss
│       ├── app.scss
│       ├── components
│       ├── foundation
│       │   ├── base
│       │   │   └── _default.scss
│       │   ├── functions
│       │   │   ├── _rem.scss
│       │   │   ├── _sprite.scss
│       │   │   └── _z-index.scss
│       │   ├── mixins
│       │   │   ├── _clearfix.scss
│       │   │   ├── _media-queries-only.scss
│       │   │   ├── _media-queries.scss
│       │   │   ├── _placeholder.scss
│       │   │   ├── _responsive-iframe.scss
│       │   │   └── _sprite-image-replace.scss
│       │   └── variables
│       │       └── _variables.scss
│       ├── layout
│       │   ├── _container.scss
│       │   ├── _footer.scss
│       │   ├── _header.scss
│       │   └── _sidebar.scss
│       ├── utility
│       └── venders
├── webpack.common.js
├── webpack.dev.js
├── webpack.prod.js
└── yarn.lock

About

starter kit for frontend development.

Resources

Releases

No releases published

Packages

No packages published