Course Content
01 – Welcome, Welcome, Welcome!
0/3
Download Attachment
Lesson 001 Welcome to the Most Advanced CSS Course Ever!
03:54
Lesson 003 Setting up Our Tools
02:52
02 – Natours Project — Setup and First Steps (Part 1)
0/8
Download Attachment
Lesson 001 Section Intro
00:45
Lesson 002 Project Overview
05:42
Lesson 003 Building the Header – Part 1
24:23
Lesson 004 Building the Header – Part 2
17:06
Lesson 005 Creating Cool CSS Animations
19:19
Lesson 006 Building a Complex Animated Button – Part 1
15:57
Lesson 007 Building a Complex Animated Button – Part 2
12:51
03 – How CSS Works A Look Behind the Scenes
0/12
Download Attachment
Lesson 001 Section Intro
01:38
Lesson 002 Three Pillars of Writing Good HTML and CSS (Never Forget Them!)
04:21
Lesson 003 How CSS Works Behind the Scenes An Overview
04:32
Lesson 004 How CSS is Parsed, Part 1 The Cascade and Specificity
12:33
Lesson 005 Specificity in Practice
05:55
Lesson 006 How CSS is Parsed, Part 2 Value Processing
15:44
Lesson 007 How CSS is Parsed, Part 3 Inheritance
04:05
Lesson 008 Converting px to rem An Effective Workflow
14:01
Lesson 009 How CSS Renders a Website The Visual Formatting Model
12:45
Lesson 010 CSS Architecture, Components and BEM
09:17
Lesson 011 Implementing BEM in the Natours Project
05:15
04 – Introduction to Sass and NPM
0/8
Lesson 001 Section Intro
01:02
Lesson 002 What is Sass
04:59
Lesson 003 First Steps with Sass Variables and Nesting
25:22
Lesson 004 First Steps with Sass Mixins, Extends and Functions
17:05
Lesson 005 A Brief Introduction to the Command Line
11:21
Lesson 006 NPM Packages Let’s Install Sass Locally
13:48
Lesson 007 NPM Scripts Let’s Write and Compile Sass Locally
13:10
Lesson 008 The Easiest Way of Automatically Reloading a Page on File Changes
06:23
05 – Natours Project — Using Advanced CSS and Sass (Part 2)
0/24
Lesson 001 Section Intro
00:55
Lesson 002 Converting Our CSS Code to Sass Variables and Nesting
11:17
Lesson 003 Implementing the 7-1 CSS Architecture with Sass
17:34
Lesson 004 Review Responsive Design Principles and Layout Types
07:48
Lesson 005 Building a Custom Grid with Floats
37:03
Lesson 006 Building the About Section – Part 1
23:25
Lesson 007 Building the About Section – Part 2
21:52
Lesson 008 Building the About Section – Part 3
17:30
Lesson 009 Building the Features Section
30:20
Lesson 010 Building the Tours Section – Part 1
25:28
Lesson 011 Building the Tours Section – Part 2
31:00
Lesson 012 Building the Tours Section – Part 3
16:36
Lesson 013 Building the Stories Section – Part 1
19:40
Lesson 014 Building the Stories Section – Part 2
14:14
Lesson 015 Building the Stories Section – Part 3
13:49
Lesson 016 Building the Booking Section – Part 1
18:19
Lesson 017 Building the Booking Section – Part 2
18:37
Lesson 018 Building the Booking Section – Part 3
23:10
Lesson 019 Building the Footer
15:57
Lesson 020 Building the Navigation – Part 1
29:38
Lesson 021 Building the Navigation – Part 2
13:13
Lesson 022 Building the Navigation – Part 3
15:36
Lesson 023 Building a Pure CSS Popup – Part 1
25:14
Lesson 024 Building a Pure CSS Popup – Part 2
16:55
06 – Natours Project — Advanced Responsive Design (Part 3)
0/13
Lesson 001 Section Intro
01:00
Lesson 002 Mobile-First vs Desktop-First and Breakpoints
17:35
Lesson 003 Let’s Use the Power of Sass Mixins to Write Media Queries
28:08
Lesson 004 Writing Media Queries – Base, Typography and Layout
26:39
Lesson 005 Writing Media Queries – Layout, About and Features Sections
12:33
Lesson 006 Writing Media Queries – Tours, Stories and Booking Sections
20:26
Lesson 007 An Overview of Responsive Images
05:41
Lesson 008 Responsive Images in HTML – Art Direction and Density Switching
10:15
Lesson 009 Responsive Images in HTML – Density and Resolution Switching
17:21
Lesson 010 Responsive Images in CSS
11:43
Lesson 011 Testing for Browser Support with @supports
21:43
Lesson 012 Setting up a Simple Build Process with NPM Scripts
20:55
Lesson 013 Wrapping up the Natours Project Final Considerations
13:58
07 – Trillo Project — Master Flexbox!
0/23
Download Attachment
Lesson 001 Section Intro
01:03
Lesson 002 Why Flexbox An Overview of the Philosophy Behind Flexbox
06:31
Lesson 003 A Basic Intro to Flexbox The Flex Container
15:08
Lesson 004 A Basic Intro to Flexbox Flex Items
10:34
Lesson 005 A Basic Intro to Flexbox Adding More Flex Items
06:14
Lesson 006 Project Overview
07:14
Lesson 007 Defining Project Settings and Custom Properties
13:40
Lesson 008 Building the Overall Layout
12:00
Lesson 009 Building the Header – Part 1
17:59
Lesson 010 Building the Header – Part 2
14:48
Lesson 011 Building the Header – Part 3
12:26
Lesson 012 Building the Navigation – Part 1
11:36
Lesson 013 Building the Navigation – Part 2
16:50
Lesson 014 Building the Hotel Overview – Part 1
15:19
Lesson 015 Building the Hotel Overview – Part 2
15:26
Lesson 016 Building the Description Section – Part 1
12:53
Lesson 017 Building the Description Section – Part 2
19:38
Lesson 018 Building the User Reviews Section
22:52
Lesson 019 Building the CTA Section
16:54
Lesson 020 Writing Media Queries – Part 1
19:27
Lesson 021 Writing Media Queries – Part 2
16:27
Lesson 022 Wrapping up the Trillo Project Final Considerations
14:45
08 – A Quick Introduction to CSS Grid Layouts
0/16
Lesson 001 Section Intro
00:59
Lesson 002 Why CSS Grid A Whole New Mindset
05:15
Lesson 003 Quick Setup for This Section
02:11
Lesson 004 Creating Our First Grid
12:15
Lesson 005 Getting Familiar with the fr Unit
10:00
Lesson 006 Positioning Grid Items
07:26
Lesson 007 Spanning Grid Items
09:49
Lesson 008 Grid Challenge
02:48
Lesson 009 Grid Challenge A Basic Solution
11:08
Lesson 010 Naming Grid Lines
09:40
Lesson 011 Naming Grid Areas
11:03
Lesson 012 Implicit Grids vs. Explicit Grids
10:39
Lesson 013 Aligning Grid Items
09:57
Lesson 014 Aligning Tracks
12:59
Lesson 015 Using min-content, max-content and the minmax() function
16:19
Lesson 016 Responsive Layouts with auto-fit and auto-fill
10:57
09 – Nexter Project — Master CSS Grid Layouts!
0/21
Download Attachment
Lesson 001 Project Overview and Setup
11:31
Lesson 002 Building the Overall Layout – Part 1
15:34
Lesson 003 Building the Overall Layout – Part 2
24:32
Lesson 004 Building the Features Section – Part 1
13:01
Lesson 005 Building the Features Section – Part 2
20:27
Lesson 006 Building the Story Section – Part 1
18:00
Lesson 007 Building the Story Section – Part 2
11:38
Lesson 008 Building the Homes Section – Part 1
15:46
Lesson 009 Building the Homes Section – Part 2
18:51
Lesson 010 Building the Gallery – Part 1
15:24
Lesson 011 Building the Gallery – Part 2
12:27
Lesson 012 Building the Footer
12:33
Lesson 013 Building the Sidebar
05:08
Lesson 014 Building the Header – Part 1
16:16
Lesson 015 Building the Header – Part 2
09:51
Lesson 016 Building the Realtors Section
11:22
Lesson 017 Writing Media Queries – Part 1
17:12
Lesson 018 Writing Media Queries – Part 2
18:38
Lesson 019 Browser Support for CSS Grid
08:35
Lesson 020 Wrapping up the Nexter Project Final Considerations
06:44
10 – That’s It, Everyone!
0/2
Download Attachment
Lesson 001 See You Next Time, CSS Master!
02:28
Advanced CSS and Sass: Flexbox, Grid, Animations and More!

Download Vietnamese subtitle: Click here

Download English subtitle: Click here

Previous
Next

Please contact me via telegram

DMCA.com Protection Status