A simple demo project

• Requirements
• Installation
• Usage
  • NPM Scripts
    • TL;DR: start and watch
• Documentation
  • Scripts
    • Configuration
    • ES Linter
  • Styles
    • Configuration
    • SCSS Linter
  • Views
• Git naming convention

• node-js >= 6.4.0

To automate the installation process, we recommend that you use the wasa-cli, a CLI tool that can initialize ready-to-go new projects based on this boilerplate in no time.

Otherwise, follow these instructions:

• npm install to install the dependencies.
• npm install -g commitizen to globally install Commitizen.

The boilerplate is powered by Gulp, as we are also using services like Babel, Node-Sass, Pug (etc.). You can run each script individually. All main scripts all listed below, but you can also find them in the "scripts" section of the ./package.json file and gulpfile.babel.js configuration.

• start: clean the build, build, watch and start server
• build: build the assets and the views

npm run start

We are not using nodejs requires as it is not compatible with modern browsers. As a result, import/requires/exports are not allowed. Every JS code must be written inside of a single file, located in ./app/scripts/index.js

We are using the Airbnb JavaScript Style Guide. You can find the configuration file in ./.eslintrc. The linter is not passing through our code. Instead, we recommend that you use a package within your text editor:

• Sublime Text: SublimeLinter, SublimeLinter-contrib-eslint, and eslint (globally installed, npm install -g eslint).
• Atom: linter and linter-eslint.

Every import is located in ./app/styles/index. They are separated into five categories:

• abstracts: configuration and helpers.
• base: basic files (reboot, grid etc.).
• components: speaks for itself (e.g. Button).
• layout: layout-related sections (e.g. Header).
• pages: page-specific styles (e.g. homepage).

We are using the Airbnb CSS / Sass Styleguide. You can find the configuration file in ./.scss-lint.yml. The linter is not passing through our code. Instead, we recommend that you use a package within your text editor:

• Sublime Text: SublimeLinter, SublimeLinter-contrib-scss-lint, ruby and scss_lint.
• Atom: linter and linter-scss-lint

We are using PugJS to handle HTML content, a simple framework to quickly produce content.

We are using Commitizen to automate our git messages. Simply add files to your commit and then run the command git cz. A prompt will appear and automate your process. By default, we are using the conventionnal-changelog convention (e.g. 'feat(boilerplate): init boilerplate'). It can be paired with standard-version to automate your changelogs and publishing process.