rhetorical question -basic use of sass,gulp, font awesome,f3 and bootstrap4

43 views
Skip to first unread message

Andrew Brookes

unread,
Jan 22, 2018, 3:10:40 PM1/22/18
to Fat-Free Framework
 playing recently with bootstrap4 , sass, gulp, font awesome 

 have not figured out yet BrowserSync & php so this is how i use it

 $php -S localhost:8000 -t f3sass   this fires up project  one one terminal

 cd into project which when unzipped is f3sass
 $gulp watch //second terminal

 
 its a very basic set up so you can edit files & see results in a running web.very basic i'm afraid but its ok for me ; maybe others
 the two files to edit are f3sass/scss/custom.scss and             f3sass/node_modules/bootstrap/scss/_custom.scss

 the gulp puts update in css form to ui/css i just watch gulp complete then i refresh browser; far from perfect but a start 

 only need to reference "style.css"  as rel link  in header since everything imported into that file 
 Only one page in project which shows at /
 its got a single nav bar which collapses  when browser /device shrinks toggle icon uses font awesome hamburger 

 link ref here https://github.com/captain-sensible/f3sassExample

 

bcosca

unread,
Jan 23, 2018, 4:58:53 AM1/23/18
to Fat-Free Framework
Chrome LiveReload extension and gulp's livereload.js work well together so you can forget about manually refreshing the browser every time you change something in your code and/or templates.

Andrew Brookes

unread,
Jan 23, 2018, 1:52:48 PM1/23/18
to Fat-Free Framework


On Tuesday, January 23, 2018 at 9:58:53 AM UTC, bcosca wrote:
Chrome LiveReload extension and gulp's livereload.js work well together so you can forget about manually refreshing the browser every time you change something in your code and/or templates.


 Ok cheers bcosca will have a look,  i was intending to have a go as a further learning curve. Also i didn't add gulp minify, uglify to gulpfile.js but will have a go!
Reply all
Reply to author
Forward
0 new messages