CSS HTML JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
build
data
gulpfile.babel.js
src
static
webpack
.babelrc
.editorconfig
.eslintignore
.eslintrc.js
.gitignore
.htmlhintrc
.prettierignore
.pug-lintrc.js
.stylelintignore
.stylelintrc
LICENSE.md
Procfile
README.md
browserslist
config.js
logo.png
package-lock.json
package.json
postcss.config.js
prettier.config.js
yarn.lock

README.md

Fronter dependencies Status devDependency Status

Front-end starter kit.

Quick-Start Guide

Installation

1. Clone this repo:

git clone git@github.com:lanceguyatt/fronter.git my-app
cd my-app

2. Make it your own

rm -rf .git && git init && npm init

This re-initializes the repo and sets up your NPM project.

3. Install the dependencies:

Install via yarn

yarn

Or via npm

npm install

You're done installing! Now let's get started developing.

Development Workflow

4. Start a browser-sync development server

gulp

Browser sync

5. Generate a production build in ./build:

gulp build

Build

6. Start local production server with serve:

npm start

Serve


Builders

  • gulp The streaming build system
  • webpack A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows to load parts for the application on demand. Through "loaders," modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

Servers

  • gulp-nodemon gulp + nodemon + convenience
  • browser-sync Keep multiple browsers & devices in sync when building websites
  • serve Static file serving and directory listing

Scripts


Styles


Templates

  • pug Pug – robust, elegant, feature rich template engine for Node.js
  • gulp-pug Gulp plugin for compiling Pug templates
  • jstransformer-markdown-it Markdown-It support for JSTransformers.

Images


Linters

  • eslint The pluggable linting utility for JavaScript and JSX

  • eslint-plugin-import ESLint plugin with rules that help validate proper imports

  • https://github.com/prettier/eslint-config-prettier

  • [gulp-htmlhint] htmlhint wrapper for gulp to validate your HTML

  • [gulp-stylelint] Gulp plugin for running Stylelint results through various reporters

  • [stylelint] A mighty, modern CSS linter

  • [stylelint-config-standard] The standard shareable config for stylelint

https://github.com/prettier/eslint-config-prettier [gulp-htmlhint]: https://github.com/bezoerb/gulp-htmlhint [gulp-stylelint]: https://github.com/olegskl/gulp-stylelint [stylelint]: https://github.com/stylelint/stylelint [stylelint-config-standard]: https://github.com/stylelint/stylelint-config-standard


Formatters

  • prettier Prettier is an opinionated code formatter.

Utils


License

MIT © Lance Guyatt