Bootstrap CLI Webtools - Summary

   
   
 css  js  bootstrap  
 frontend  
Article Series

This is a four-parts article. There are few sections here.

Summary
  • Preface
  • Prepare
  • What's Next
Part One: NodeJS
  • Node Module
  • Bower
  • Grunt
  • Gulp
  • eyeglass
  • sw.js (webpack)
  • What's Next
Part Two: Ruby
  • Gemfile
  • SASS
  • Jekyll (Static Site Generator)
  • Sache (SASS extensions and Tools)
  • What's Next
Part Three: PHP
  • Composer
  • Conclusion
Where to Discuss?

Local Group

Table of Content

Preface

Time to embrace the CLI webtools

What I know, only the ready to use bootstrap CSS. But there more sophisticated stuff beneath this. I started with v3 because I want all the fun, and later with v4. While examining bootstrap v3 source code I realize, that there are many stuff other than CSS itself, in these directory

  • v3.3 root (all): bower.json, composer.json, Gemfile, Gruntfile.js

  • v3.3 docs (less): a working jekyll site, that you can run locally

  • v3.3 deep nest (sass): some ruby

  • v4 root: webpack (sw.js), sache

CLI Webtools

I never know such webtools exist well in command line interface.

Grunt: docs

feeling stupid in the corner

It is also the moment, that I realize, that I know nothing. But don’t worry, they are all can be learnt over a night. Most of the official documentation is easy to follow. In fact, I have done it all, from dusk until dawn. Not more that one day.

Table of Content

By the language platform, let me reorganize this article as this below:

  • Summary

  • Part One (NodeJS): bower, grunt, less, eyeglass

  • Part Two (Ruby): Gemfile, SASS/SCSS, Jekyll, sache

  • Part Three (PHP): Composer

Looks complete right ? There is also other popular technology, not being used by bootstrap, such as as gulp, and ParcelJS.

Prepare

Download bootstrap from official site:

Consider put it on ~/sites/bootstrap directory, and extract.

What’s Next

Since we are going to use NodeJS a lot, such as Bower, and Grunt. we should begin with Node Module using NPM. At least for me as beginner in NodeJS land. Consider finish reading [ Part One ].

Thank you for reading.