bluerabbit

Project Setup

Installation

You need to have NodeJS

Type below commands in terminal

npm install -g yo

npm install -g gulp

npm install -g bower

Install smacss generator

Type below commands in terminal

npm install -g generator-smacss

Clone the repo & cd into it

sudo npm install

bower install

Finally

Type below command in terminal

gulp

Application Directory Structure

├── app
│   ├── bower_components
│   ├── images
│   ├── js
│   │   └── lib
│   │   │   └── third-party-files.js
│   │   └── controllers
│   │   └── directives
│   │   └── services
│   │   └── filters
│   │   └── application.js
│   ├── css
│   │   └── master.css
│   ├── partials
│   │   └── header.html
│   │   └── footer.html
│   ├── scss
│   │   └── modules
│   │   │   └── module-name.scss
│   │   └── pages
│   │   │   └── page-landing.scss
│   │   └── base.scss
│   │   └── layout.css
│   │   └── mixins.css
│   │   └── reset.css
│   │   └── variables.css
│   └── index.html
├── build
│   └── build-files
├── zip
│   └── compressed-files
├── node_modules
├── package.json
├── gulpfile.js
├── bower.json
├── .bowerrc
├── .gitattributes
└── .gitignore

Quick Commands

• Clean Remove all files from your build folder

  gulp clean
  

• Zip Compress you app & save in zip folder with timestamp for quick sharing

  gulp zip
  

• Controller Creates a controller in app/js/controllers

  yo smacss:controller <name>
  

• Service Creates a service in app/js/services

  yo smacss:service <name>
  

• Directive Creates a directive in app/js/directives

  yo smacss:directive <name>
  

• Filter Creates a filter in app/js/filters

  yo smacss:filter <name>
  

Environment

Generator Smacss comes with development and producution modes. In default it runs in development mode.

You can switch to production mode using the following command

gulp prod