• Monday , 25 March 2019

Bootstrap 4 by Example – Installation & Dev. Environment

Code Canyon
https://i.ytimg.com/vi/UAHfAbc8JkY/hqdefault.jpg



Course page: https://goo.gl/J7fxoN
— This is the first section of my free course. Visit https://coursetro.com for more.

– – – – – – – – – – – – – – – – – – – – – –

Subscribe for NEW VIDEOS weekly!

My site: https://coursetro.com
My personal FB account: http://fb.com/logodesigner
Coursetro FB: http://fb.com/coursetro
Coursetro’s Twitter: http://twitter.com/designcoursecom

Join my Discord! https://discord.gg/a27CKAF
^-Chat with me and others

– – – – – – – – – – – – – – – – – – – – – –

Who is Gary Simon? Well, I’m a full stack developer with 2+ decades experience and I teach people how to design and code. I’ve created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.

Now, I focus all of my time and energy on this channel and my website Coursetro.com.

Come to my discord server or add me on social media and say Hi!

Original source

3d Ocean

Related Posts

29 Comments

  1. gtherat
    January 4, 2019 at 13:25

    Very nice tutorial Gary – very easy to understand – thank you! One question – should the 'scss' directory be outside of the 'src' directory? You usually wouldn't want to deploy the sass files to a live server, or is this not a concern?

  2. Rajan Theengh
    January 4, 2019 at 13:25

    Please help..
    …….
    D:codegamelayout (gamelayout@1.0.0)

    λ gulp

    [00:51:39] Using gulpfile D:codegamelayoutgulpfile.js

    [00:51:39] Starting 'js'…

    [00:51:39] 'js' errored after 12 ms

    [00:51:39] ReferenceError: browserSync is not defined
    …….

  3. Danish ALI
    January 4, 2019 at 13:25

    case gulp didn't work:
    i. make sure gulp cli is installed if not run "npm i gulp-cli"
    ii. replace gulpfile.js code in the video with following code (edited for gulp 4.0.0)

    let {series, src, dest, watch} = require('gulp')
    let browserSync = require('browser-sync').create()
    let sass = require('gulp-sass')

    function _sass(cb){
    return src(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'])
    .pipe(sass())
    .pipe(dest('src/css'))
    .pipe(browserSync.stream())

    cb()
    }

    function js(cb){
    return src([
    'node_modules/bootstrap/dist/js/bootstrap.min.js',
    'node_modules/jquery/dist/jquery.min.js',
    'node_modules/tether/dist/js/tether.min.js'
    ])
    .pipe(dest('src/js'))
    .pipe(browserSync.stream())

    cb()
    }

    function serve(cb){
    browserSync.init({
    server: './src'
    })

    watch(
    [
    'node_modules/bootstrap/scss/bootstrap.scss',
    'src/scss/*.scss'
    ]
    , series(_sass)
    )

    watch('src/*.html').on('change', browserSync.reload)

    cb()
    }

    exports.default = series(js, _sass, serve)

  4. Danish ALI
    January 4, 2019 at 13:25

    gulp syntax used has been outdated by gulp 4 changes need to be made in gulpfile.js

  5. Amit Srikoti
    January 4, 2019 at 13:25

    hi…. i have a problem to setup latest bootstrap version in my gulp project..please reply

  6. OYEBODE YUSUF AYODEJI
    January 4, 2019 at 13:25

    Am having problem at the last stage of setting up bootstrap enviroment. Whenever i enter 'gulp' in the terminal in order to setup the local host, i get an error message at the terminal saying "gulp is not a recognised internal or external comand".

    Am using CMD on WINDOWS 10. Thanks.

  7. Vikas Sharma
    January 4, 2019 at 13:25

    Hello guys, i have a question after created gulp file the use command line type gulp in that case result is gulp command is not found

  8. Uwe F. Herle
    January 4, 2019 at 13:25

    Hy, i love your videos, verey informativ, great work. One question pls. In your github files you talk from a "!global"-Keyword behind some Variables, by customizing Boostrap-Variables.. What that means? I never heard from that.

  9. English Oak
    January 4, 2019 at 13:25

    bad tutorial

  10. Latheon Noft
    January 4, 2019 at 13:25

    question about this tutorial. so i am using C9 as my workspace. how do we go about getting gulp to show the weppage

  11. israel
    January 4, 2019 at 13:25

    npm install -g gulp-cli to make the command gulp work

  12. kefa mutuma
    January 4, 2019 at 13:25

    https://coursetro.com/posts/design/72/Installing-Bootstrap-4-Tutorial

    for those looking for the text version of the tutorial to be able to copy and paste the necessary code.. scroll through the page and you will find the necessary code material

  13. eranda pattapola
    January 4, 2019 at 13:25

    use the same version of bootstrap@4.0.0-alpha.6 otherwise you won't get jquery and tether folders when you install bootstrap and after setting up and run gulp you will see lot of errors(Failed to load resource) in console

  14. Andrea DWS
    January 4, 2019 at 13:25

    the last step dosen't work for me. if i enter gulp it says "Gulp not recongnized "

  15. Ppen Lelis
    January 4, 2019 at 13:25

    does it take long actually in npm init?

  16. Otman Zaib
    January 4, 2019 at 13:25

    Great tutorial, but at 17:36 at line 15, the rest of the line was hidden, so for people who were type from the screen (i'm one of them) has probably got js errors.

  17. Abhimanyu
    January 4, 2019 at 13:25

    thank you for this tutorial, I faced an error, in my directory under node_modules, I could not find jQuery directory and moreover we have popper.min.js (could not find its directory too) too, so how to create task in gulpfile for that

  18. jerico borja
    January 4, 2019 at 13:25

    I do have {} package-lock.json. Why ?

  19. Lightbender Skywalker
    January 4, 2019 at 13:25

    Epic tutorial. But I cant stop myself…

    Word of the week: MOMENTARILY

  20. Anish Chaudhary
    January 4, 2019 at 13:25

    Very helpful, thanks a lot!

  21. s3bastiannaumann1996
    January 4, 2019 at 13:25

    Nice video dude…simple and easy

  22. Pratik Thakur
    January 4, 2019 at 13:25

    D:Boot4>gulp
    'gulp' is not recognized as an internal or external command,
    operable program or batch file.

    gulp doesn't work please help!

  23. Seán Feeney
    January 4, 2019 at 13:25

    You are amazing. I love your style of presenting! Definitely worth subscribing to!

  24. Javier A. Reyes Acevedo
    January 4, 2019 at 13:25

    what teminal are u using in this tut? thanks bro for all the content

  25. Thirupathy KS
    January 4, 2019 at 13:25

    Need to run following command in terminal in order to get gulp running in Mac, do I?: sudo npm install gulp-cli -g

  26. GSFXMentor
    January 4, 2019 at 13:25

    nice

  27. Danton Barnes
    January 4, 2019 at 13:25

    I'm getting an error that says it requires a peer of jquery and popper.js. Also my project is missing the jquery as well as the tether folders. I'm totally new to bootstrap and in all honesty node/npm. Can anyone tell me what I need to do to correct this.

  28. Andreas Donig
    January 4, 2019 at 13:25

    Shouldn't there be some kind of CSS autoprefixing action required?

  29. TechBusker
    January 4, 2019 at 13:25

    will you add a set-up environment in bootstrap beta? jquery and popper js are not included in npm install and dont know how to modify gulpfile

Leave A Comment

You must be logged in to post a comment.