D4mations.com

Build a responsive animated website [Part 1] | Bootstrap 4 Tutorial

[ad_1]
https://i.ytimg.com/vi/M9BODcrzp4o/hqdefault.jpg



In this video we will be covering many of the topics I covered in my Bootstrap 4 crash course. We will be building a bakery themed responsive website from start to finish in. We will also be applying some simple animations to certain elements. This video will give you the necessary tools to start building responsive websites using Bootstrap’s powerful grid system as well as other components on your own. Responsive web design is a very important subject when it comes to web development. I hope you enjoy the video!

Don’t forget to leave a thumbs up if you found the video useful. Also, click on the bell icon to turn on notifications. This way you’ll be notified the moment new videos are uploaded.

Subscribe ► https://bit.ly/2Q3pCiB

[ PROJECT FILES ]

GitHub ► https://bit.ly/30xvLE9

[ SUPPORT ME ]

Get exclusive Patreon perks.
Patreon ► https://www.patreon.com/juliocodes

[ SOCIAL MEDIA ]

Instagram ► https://www.instagram.com/juliocodesyt

[ GET IN TOUCH ]

Email ► codingwithjulio@outlook.com

[ HOSTGATOR ]

Get affordable domain and web hosting with HostGator. Save up to 60% off of your entire purchase with the coupon code below.

HostGator ► https://bit.ly/2ZfR0u3
Coupon code ► JULIOCODES60
Video tutorial ► https://youtu.be/5B_LQqR0zsE

[ MY GEAR ]

Programming & Video editing laptop Specs

Laptop: Dell XPS 15 7590
Processor: 9th Generation Intel Core i7-9750h
RAM: 32GB (Upgraded)
Graphics Card: Nvidia GeForce GTX 1650 4GB GDDR5
Storage: 500GB M. 2 PCIe NVMe SSD (Upgraded)

Dell XPS 15 7590

United States ► https://amzn.to/2Gd7U4M
United Kingdom ► https://amzn.to/2NMJzqm
Canada ► https://amzn.to/2ReU08x
France ► https://amzn.to/2vcPU8n

CORSAIR Vengeance Performance RAM

United States ► https://amzn.to/38rWdmD
United Kingdom ► https://amzn.to/30FXNyA
Canada ► https://amzn.to/3awleix
France ► https://amzn.to/30JMkxX

Samsung 970 EVO Plus SSD

United States ► https://amzn.to/2NMIaAu
United Kingdom ► https://amzn.to/37hrJnc
Canada ► https://amzn.to/38tk9Gg
France ► https://amzn.to/2RfUdbC

Blue Yeti Microphone

United States ► https://amzn.to/2NNPSLr
United Kingdom ► https://amzn.to/2RiLKVb
Canada ► https://amzn.to/2RB6vdq
France ► https://amzn.to/30EJpqy

Microphone Shock Mount ► https://amzn.to/2MU1nBr
Microphone Boom Arm ► https://amzn.to/2ZQzbRR

[ DISCLAIMER No. 1 ]

In order to speed up the development process CSS prefix are not used. In order to ensure cross browser compatibility please use prefixes where necessary.

[ DISCLAIMER No. 2 ]

This video description contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. This helps support the channel and allows me to continue to make videos like this. Thank you for the support!

Original source

d4mer

,
, , , , , , , ,

41 responses to “Build a responsive animated website [Part 1] | Bootstrap 4 Tutorial”

  14. Love your tuts, tey are the best!
    I have a problem with the script.js and I already check it to be a script properly on the html, and I don´t know what is happening, can you put the js file for download please?

  15. Uno problemo, I can't get the bars on the hamburger to display or the cross, though it is working! I have changed it to white so I can at least see the placement, any suggestions? I've been through the code twice and it's all good >.<

  16. Awesome tutorials. I am having trouble with my hamburger menu not working on click. Can you see anything wrong?
    $(function () {

    $('.hamburger-menu').on('click', function () {

    $('.toggle').toggleClass('open');

    });

    });

  18. Great tutorial, you have some crazy CSS skills. Everything works perfectly so far on my machine. Only thing I had to do different was change the font-awesome kit to my own key because the hamburger menu was broken for me otherwise. On to the next video 🙂

  20. Love from Pakistan
    Excellent simply love it…..Awesome art of work..
    But I want to say that please make a separate video on the all the files thats you link in the project and please tell which class belong to which file

  23. Awesome Tutorial!

    I love seeing you post these videos then I'll have a play myself and see how it goes; of course done with a slight twist whereby a custom logo has been added and the overall theme is based a local cafe rather than a bakery.

    Can view the project here: https://github.com/mylesluke/Cafe

    – So far created a Adobe XD design
    – Created Logo in CS6
    – Using SaSS as a basis for my styling and color configuration
    – Using the AOS library for some of those animations but had to download the files for it as source wouldn't work

    A fun project; keep them coming!

  32. Hey thanks for this tutorial
    I have a small problem on the js file it says on the line 2 ($('.hamburger-menu').on('click', function(){
    )
    i have this error Missing "use strict" statement
    so if u can help me and thanks for this

Leave a Reply