Deprecated: Function create_function() is deprecated in /var/www/vhosts/eduardoarellano.com/d4mations.com/wp-content/plugins/wp-automatic/wp-automatic.php on line 70
Code A Complete Responsive Website with HTML5, CSS3, Bootstrap 4 & VS Code – Complete Website Course | D4mations.com
  • Friday , 4 December 2020

Code A Complete Responsive Website with HTML5, CSS3, Bootstrap 4 & VS Code – Complete Website Course

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



➢Tutorial Starter Files: https://m.w3newbie.com/d/tutorial-36.zip
➢Bootstrap Website Templates (Coupon “FLASHSALE”):
https://w3newbie.com/template-bundle

In this video we’ll build a new responsive website layout with HTML5, CSS3 & Bootstrap 4! First we’ll get a quick introduction to Bootstrap which is the responsive website framework we’ll be using, then we’ll get a brief introduction to the Visual Studio Code text editor that we’ll be using in the course. In this design we’ll build a sticky navigation menu using the Bootstrap framework as well as add our own custom styling to the framework. We’ll also add a responsive carousel image slider with content on top of it and learn how to adjust the transition speed & duration of the slides. Then, after the custom slider, we’ll build a sticky social media menu bar where you can link to all of your social media pages and layout various width and columned sections as we work our way through the website design.

00:00-00:14 Intro
00:15-10:52 Project Overview & Text Editor
10:53-19:39 Website Starter Files Intro:
➢Tutorial Starter Files: https://m.w3newbie.com/d/tutorial-36.zip
19:40-27:59 Navigation Menu HTML
28:00-32:22 Navigation Menu CSS
32:23-40:24 Carousel Image Slider HTML & CSS Part 1
40:25-52:05 Carousel Image Slider HTML & CSS Part 2
52:06-56:03 Carousel Image Slider HTML & CSS Part 3
56:04-1:05:01 Social Media Menu Bar Icons
1:05:02-1:13:24 Heading & Three Column Section
1:13:25-1:17:59 Two Column Section HTML & CSS
1:18:00-1:18:51 Fixed Image Background & Jumbotron
1:18:52-1:24:08 Second Two & Three Column Sections
1:24:09-1:30:37 Website Footer & Socket Section HTML
1:30:38-1:34:21 Footer & Socket CSS
1:34:22-1:42:12 Responsive CSS Media Queries
1:42:13 How To Put Your Website Online with Website Hosting:
➢Website Hosting: http://w3n.link/36-bluehost

Please remember to subscribe here on YouTube and follow:
Facebook: http://www.facebook.com/w3newbie
Twitter: http://twitter.com/drewoncue

➢3 Website Bundle Bonus: https://w3newbie.com/product/3-website-bundle-bonus/

Original source

3d Ocean

Related Posts

30 Comments

  1. Drew Ryan
    November 13, 2020 at 21:59

    Hi guys! I'm excited to release a new video after a long hiatus of doing a complete rebuild of my website, w3newbie.com, and developing a number of new designs that I'll be basing new courses and YouTube tutorials on. So let me know which design from 'The 12 Website Bundle Pack' on my website you'd most like to see a new course or tutorial based on! Thanks for being subscribed and supporting my channel :). Here are the time stamps:
    0:15 – Project Overview & Text Editor
    10:53 – Website Starter Files Intro:
    ➢Tutorial Starter Files: https://m.w3newbie.com/d/tutorial-36.zip
    19:40 – Navigation Menu HTML
    28:00 – Navigation Menu CSS
    32:23 – Carousel Image Slider HTML & CSS Part 1
    40:25 – Carousel Image Slider HTML & CSS Part 2
    52:06 – Carousel Image Slider HTML & CSS Part 3
    56:04 – Social Media Menu Bar Icons
    1:05:02 – Heading & Three Column Section
    1:13:25 – Two Column Section HTML & CSS
    1:18:00 – Fixed Image Background & Jumbotron
    1:18:52 – Second Two & Three Column Sections
    1:24:09 – Website Footer & Socket Section HTML
    1:30:38 – Footer & Socket CSS
    1:34:22 – Responsive CSS Media Queries
    1:42:13 – How To Put Your Website Online with Website Hosting:
    ➢Website Hosting: https://w3newbie.com/hosting/

  2. QUILLE 2
    November 13, 2020 at 21:59

    excellent explanation.

    Thank you very much for sharing your knowledge.

  3. fateme alhoseini
    November 13, 2020 at 21:59

    I should say thank you Thousands times… wish u the best

  4. Warren Prezydent
    November 13, 2020 at 21:59

    Hello, could you tell me how does fixed background work? To be honest I don't understand where did the background from the picture comes from.

  5. Thelonious Jaha
    November 13, 2020 at 21:59

    Today i spent almost 10 hours on boootstrap and css doing one fu***ng button with dropdown menu left from my search form. Button doesn't wanted to stay i just one position at navbar, and I haven't found the solution. I know how to make it arrive when I need (col-md-1) but he's crazy, he can be only after my header or order-last. I thought about create additional navbar under the main and hidding it when increasing dev width, but that's not perfect. I decidet to finush my carrer with writing css. I'am looking for intuitive visual css editor, where I would easly configure my website without spending hours on writing it manualy, if you now some software like that, I'd appreciate to get link 🙂

  6. Sai Krishna
    November 13, 2020 at 21:59

    Great design and great work you have done there!

  7. mantel
    November 13, 2020 at 21:59

    finally done it in 3 days

  8. sam sivpheng
    November 13, 2020 at 21:59

    Great video but I have a question why you use bootstrap without class row and class col-lg or col-md ,etc? could you explain me please?

  9. luminate 22
    November 13, 2020 at 21:59

    This was a good tutorial.

  10. HITESH MALHOTRA
    November 13, 2020 at 21:59

    This tutorial was really good. Hope you come up with more content like this.

  11. James Chadsworth
    November 13, 2020 at 21:59

    Drew,
    Do you offer professional web design services? If not, do you have anyone that you can recommend for Bootstrap 4 Web Design?
    I have a web design project of about 10-12 custom templates, that I will use to make our web pages, and are looking for a web designer to help with this project.
    I use to do web design for about 10 years, but I am now legally blind, and are now unable to do the work as efficiently as before.
    Thanks for all your great videos on web design!

  12. Shufkat Ali
    November 13, 2020 at 21:59

    please make a video of submitting or registering website on google search engine. If you have already made a video then please give me the link?

  13. Julon Sen
    November 13, 2020 at 21:59

    please tell me about boostatrap.css file, how i get it. Thanks for this tutorial… 😍😍

  14. Branden
    November 13, 2020 at 21:59

    What plugin are you using for the code shorthand? Thanks for an awesome tutorial

  15. Alan Williams
    November 13, 2020 at 21:59

    Thanks very much Drew. If you get the time, the Dharma Yoga design would be a good tutorial.

  16. Scagy
    November 13, 2020 at 21:59

    so happy you're back! I wish bootstrap was used by more website designers

  17. Bonolo Senau
    November 13, 2020 at 21:59

    just started watching .. hopefully il be a master after this 1 tutorial

  18. archie M
    November 13, 2020 at 21:59

    Definitely the best # 1. learning courses for web developers. I have learned a lot. Highly recommended. Thanks for your tutorials.
    Lilly 🤗

  19. عبد الملك اسحاق AbdulMalik
    November 13, 2020 at 21:59

    One of the best Tutors with clear and detailed explanation. You deserve more than a Million subscribers (:
    Great job Drew

  20. Zee Lim
    November 13, 2020 at 21:59

    Hey Drew, Just wanted to say a big thank you for this very detailed course.

  21. Imran Kabir
    November 13, 2020 at 21:59

    This is the best tutorial I've ever come across on web development.

  22. AbG Game on
    November 13, 2020 at 21:59

    Awesome!

  23. Gregory Fortune
    November 13, 2020 at 21:59

    Really great Tuto, Thanks you so much Drew

  24. Luciana Gonçalves
    November 13, 2020 at 21:59

    Thank u!

  25. Mounir Ps
    November 13, 2020 at 21:59

    Whatever, we just need web programming videos to learn more. Thanks so much.

  26. Kanishka Bandara
    November 13, 2020 at 21:59

    Thanjk You Sir 🙂

  27. Ralf
    November 13, 2020 at 21:59

    Welcome back Drew, btw do you do any UI/UX Design as well?

  28. Inkalimeva TV
    November 13, 2020 at 21:59

    Welcome back buddy. It's been long

  29. Shubham Gadgil
    November 13, 2020 at 21:59

    Want to learn complete css and bootstrap 4

  30. ajay kumar
    November 13, 2020 at 21:59

    You makes nice video i am a beginner web designer, learning but facing isssue with css and html. Need some guidance

Leave A Comment

You must be logged in to post a comment.