Bootstrap 3 samples rendered using Jade, NodeJS, Express and Grunt
-
Do you want to accelerate the bootstrapping of your web applications?
-
Test it now https://bootstrap3-jade-node-express-grunt.azurewebsites.net/
kudos to onlinemad, he wrote a script downloading the code and generating a package.json file
The following script will
- create a directory named "bootstrap3-jade-node-express-grunt"
- create a file named “init.js" containing this script https://gist.github.com/onlinemad/6373852
- install the depedencies: adm-zip, request, prompt and js-beautify
- run the following commands
mkdir bootstrap3-jade-node-express-grunt
cd bootstrap3-jade-node-express-grunt
curl https://gist.github.com/onlinemad/6373852/raw/8439cc03c69cd171dc95a72874130b7f6a2e7c34/init.js > init.js
npm install adm-zip
npm install request
npm install prompt
npm install js-beautify
node init.js
-
hit Enter on your keyboard :-)
-
Fill the project information: Project name, description, version number (N.N.N), Author, Reposition (url),
- the project name will be the directory used to store the [bootstrap3-jade-node-express-grunt] source code
-
wait a few seconds, the download occurs in background and you don't have any visual feedback
-
go to "How to run the app" chapter (hereafter)
- git clone https://github.com/ALT-F1/bootstrap3-jade-node-express-grunt.git
cd bootstrap3-jade-node-express-grunt
- Install the module using
npm install
command (locally, a node_modules directory will be created) - Start the server using the
grunt
command - open http://localhost:3001/ home page
-
start the server using
grunt
-
click on the links leading you to the Bootstrap templates translated into Jade
-
Use the *.jade files into your projects !
-
how did we convert the html into jade
- We use html2jade to translate automatically the html into a jade file
- Remove the characters as Jade complains as it believes it has to interpret the code
=================================================
- replace inside the jade file the path to the JS and CSS files from [Bootstrap Twitter]:
../..
with the parameter#{pathToAssets}
- change the link to the custom made CSS made for each template stored under the
bootstrap-3.0.0/examples/
directory :#{pathToSelectedTemplateWithinBootstrap}
- open http://localhost:3001/
- open the Starter template
- blog
- carousel
- cover
- dashboard
- grid
- jumbotron-narrow
- jumbotron
- justified-nav
- navbar-fixed-top
- navbar-static-top
- navbar
- non-responsive
- offcanvas
- signin
- starter-template
- sticky-footer-navbar
- sticky-footer
- theme
v2014-11-13
- [Kobi Eisenberg] has migrated the code from Bootstrap 3.2.0 to 3.3.1
v2014-10-20
- Matan Eine has migrated the code from Bootstrap 3.0.0 to Bootstrap 3.2.0
- Add Cover template
- Add Blog template
- Add Dashboard template
- Simon has found that the html code was broken in the Bootstrap 3.0.0
v2014-01-08
- Correct the chapter "Download the code without Git"
v2014-01-07
- Add script written by onlinemad - a simple script to init a project based on bootstrap3-jade-node-express-grunt: https://gist.github.com/onlinemad/6373852
- Petr Volny has made two changes:
- Jade npm module update
- Fix deprecated jade doctype 5
v2013-08-25
- Convert offcanvas.html template into offcanvas.jade
- Convert signin.html template into signin.jade
- Convert starter-template.html template into starter-template.jade
- Convert sticky-footer.html template into sticky-footer.jade
- Convert sticky-footer-navbar.html template into sticky-footer-navbar.jade
- Convert theme.html template into theme.jade
v2013-08-24
- Convert grid.html template into grid.jade
- Convert jumbotron.html template into jumbotron.jade
- Convert jumbotron-narrow.html template into jumbotron-narrow.jade
- Convert justified-nav.html template into justified-nav.jade
- Convert justified-nav.html template into justified-nav.jade
- Convert navbar.html template into navbar.jade
- Convert navbar-fixed-top.html template into navbar-fixed-top.jade
- Convert navbar-static-top.html template into navbar-static-top.jade
- Convert non-responsive.html template into non-responsive.jade
- add an issue on the html2jade project as "escaped characters are wrongly translated into html. e.g. < becomes > while it shouldn't be"
v2013-08-22
- Convert carousel.html template into carousel.jade
v2013-08-21
- Bootstrap 3 is just released, it is time to convert HTML into Jade templates
- Convert starter-template.html template into starter-template.jade
Copyright (c) 2013 ALT-F1, We believe in the projects we work on™
Licensed under the MIT license.