1
Published 7/2023
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz
Language: English | Size: 7.21 GB | Duration: 12h 0m[/center]

Frontend web development using Bootstrap and SASS.

What you'll learn
Learn how to convert a static design to HTML and CSS.
Learn how to use SASS to make writing CSS easier.
Learn how to leverage Bootstrap when converting a static design to HTML and CSS.
Learn helpful workflow tips that allow you to get your designs looking close to the original design.
Learn how to take a desktop design and convert it into a mobile responsive design.

Requirements
You should have a basic understanding of CSS, HTML, and Git.

Description
Hello and welcome to my web development course: Frontend Development Basics 1.My name is Brad Bertsche and I'm a professional full stack web developer with more than 13 years of experience.In this course I am going to show you my workflow for breaking down a website design and converting it to HTML and CSS. I will also be using SASS and Bootstrap to make it all come together.We will first focus on the desktop design and then I will show you how to convert it to a mobile responsive version.The course is designed to make it easy to get started writing code and following along. You will be provided with all the assets you need to complete the course.From a professional perspective this is a novice level course, but it is not for absolute beginners. You should have some basic knowledge of CSS and HTML before taking this course.This course is just shy of 12 hours in length, and all footage is in real time, 4k resolution (original footage is in 4k but may playback at different resolutions depending the platform you watch it on), with some minor edits.For a code editor I will be using IntelliJ Idea, but you should be able to follow along in any code editor if you know the basics of it.Other software we will be using includes Affinity Designer, Affinity Photo, and Firefox.This tutorial is made for Windows, but there is no reason why you couldn't do this on any other operating system. However, you might have to look up how to install a couple of things.Thank you for checking out my course and let's get started!

Overview
Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Course Files

Section 2: 1. Getting Started

Lecture 3 1.1 Install Node.js

Lecture 4 1.2 Installing Git

Lecture 5 1.3 Cloning Frontend Repo

Lecture 6 1.4 Cloning Our New Repo Locally

Lecture 7 1.5 Project Overview

Lecture 8 1.6 How To Run Commands

Section 3: 2. Section 1

Lecture 9 2.1 Section 1

Lecture 10 2.2 Section 1

Lecture 11 2.3 Section 1

Lecture 12 2.4 Section 1

Lecture 13 2.5 Section 1

Lecture 14 2.6 Section 1

Lecture 15 2.7 Section 1

Lecture 16 2.8 Section 1

Lecture 17 2.9 Section 1

Lecture 18 2.10 Section 1

Lecture 19 2.11 Section 1

Section 4: 3. Section 2

Lecture 20 3.1 Section 2

Section 5: 4. Section 3

Lecture 21 4.1 Section 3

Lecture 22 4.2 Section 3

Lecture 23 4.3 Section 3

Lecture 24 4.4 Section 3

Section 6: 5. Section 4

Lecture 25 5.1 Section 4

Section 7: 6. Section 5

Lecture 26 6.1 Section 5

Lecture 27 6.2 Section 5

Section 8: 7. Section 6

Lecture 28 7.1 Section 6

Lecture 29 7.2 Section 6

Section 9: 8. Section 7

Lecture 30 8.1 Section 7

Lecture 31 8.2 Section 7

Section 10: 9. Section 8

Lecture 32 9.1 Section 8

Lecture 33 9.2 Section 8

Section 11: 10. Section 9

Lecture 34 10.1 Section 9

Lecture 35 10.2 Section 9

Section 12: 11. Footer

Lecture 36 11.1 Footer

Lecture 37 11.2 Footer

Section 13: 12. Responsive Updates

Lecture 38 12.1 Responsive Updates

Lecture 39 12.2 Responsive Updates

Lecture 40 12.3 Responsive Updates

Lecture 41 12.4 Responsive Updates

Lecture 42 12.5 Responsive Updates

Lecture 43 12.6 Responsive Updates

Lecture 44 12.7 Responsive Updates

Beginner web developers looking to level up their skills with battle tested frontend workflow methods.