Bootstrap 4 by Example – Installation & Dev. Environment



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


29 responses to “Bootstrap 4 by Example – Installation & Dev. Environment”

  1. 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. 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)

  3. 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.

  4. 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.

  5. 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

  6. 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

  7. 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.

Leave a Reply