Build a Responsive Web Site from Scratch

Lesson 1, Step 1: Introduction

Courses Outline

Lesson 1: Introduction
Free
Introduction
3:58
Lesson 2: Planning and Slicing
The Design
4:39
Exporting Assets
2:54
Lesson 3: Setting Up a Front-End Workflow
What is a Front-end Workflow?
3:45
Installing Node.js, npm and Gulp
6:23
Installing Gulp Plugins
4:52
Creating Gulp Tasks
8:31
Quiz
Lesson 4: Working with HTML
The BEM Methodology
5:03
Building the HTML Page Structure
3:12
HTML for the Page Content
6:46
Lesson 5: Working with Sass
Sass Partial Structure
5:54
Responsive Mixins and Functions
7:02
CSS Reset, Google Fonts and Font Awesome
4:36
Lesson 6: Building a Grid System
The Grid System Concept
4:20
Prototyping the Grid in CSS
3:02
Creating a Responsive Grid Mixin
5:40
Quiz
Lesson 7: Styling the Website
Styling the Header and Navigation
5:00
Styling the Footer
5:28
Styling the Page Sections
3:29
Styling the Portfolio Section
3:22
Styling the Blog Section
3:35
Styling the Contact Form
3:34
Creating a Responsive Hamburger Menu
5:57
Refining the Responsiveness
8:57
Lesson 8: Conclusion
Conclusion and Next Steps
2:46