Skip to content

Bijoolabs/bijoo-start

Repository files navigation

Bijoo Start

Bijoo Start is a Starter Kit providing basic set up for building Fresh and Cool websites made with Grunt, PostCSS, RequireJS, BEM and our best practices.

Features

  • A Gruntfile with all needed tasks (concat, ulgify, imagemin, etc.) for development and production.
  • A RequireJS set up to load JS modules and libraries asynchronously.
  • Modular structure for CSS and JS files.
  • PostCSS to extend CSS possibilities (import, autoprefix, vars, etc.).
  • Last jQuery 2 version.
  • Eric Meyer's CSS reset.
  • Basic print CSS.
  • Source maps for CSS and JS files.

Getting started

npm install -g grunt-cli
  • (Optional) Install PhantomJS Run installer.exe
  • Install the npm dependencies
cd path/to/project
npm install
  • Launch default Grunt task
grunt

Grunt Tasks

  • GRUNT : default task to clean, postCSS, concat, copy, imagemin with source maps.
grunt
  • GRUNT LINT : to lint CSS and JS files.
grunt lint
  • GRUNT PROD : to clean, postCSS, uglify, concat, critical CSS, copy and images optimization.
grunt prod

BEM

Bijoostrap is based on BEM (Block, Element, Modifier) but it adds a specific child block declaration.

To specify a child block, add an underscore caracter "_" followed by one of the next uppercase letter :

  • H for Header
  • C for Content
  • M for Main
  • I for inner
  • F for Footer

Here is the naming convention :

BLOCK(parent)_BLOCK(enfant)__ELEMENT--MODIFIER

Example :

<footer class="mainFooter">
    <div class="mainFooter_H">
        <h1 class="mainFooter_H__title "></h1>
        <h1 class="mainFooter_H__subtitle"></h1>
    </div>

    <div class="mainFooter_C">
        <h1 class="mainFooter_C__title "></h1>
        <h1 class="mainFooter_C__subtitle"></h1>
        <h1 class="mainFooter_C__content"></h1>
    </div>

    <div class="mainFooter_F">
        <h1 class="mainFooter_F__title "></h1>
        <h1 class="mainFooter_F__subtitle"></h1>
    </div>
</footer>

Creators

Balix and ethyde

Contributors

Balix and ethyde

Copyright and license

Code and documentation by Balix and Ethyde. Code released under the MIT license. Docs released under Creative Commons.

ENJOY !

-alt text

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published