Composing Layouts in React
4h 38m 12s
English
Paid
Course description
In this course we show you how to build complex layouts in React by composing just a few foundational layout primitives. Along the way you will learn modern CSS Layout tools like Normal Flow, Flexbox, and Grid.
Watch Online
Join premium to watch
Go to premium
# | Title | Duration |
---|---|---|
1 | Welcome to Composing Layouts in React | 02:31 |
2 | CSS In The Age of Components | 02:15 |
3 | Composing Layouts | 05:34 |
4 | Encapsulated CSS | 08:54 |
5 | Normal Flow as Composable Layouts | 08:43 |
6 | CSS Flexbox and CSS Grid as Composable Layouts | 06:28 |
7 | A CSS Reset For Composable Layouts | 05:41 |
8 | Introduction to layout spacers | 02:03 |
9 | The Stack Component | 17:08 |
10 | The Split Component | 14:22 |
11 | Columns and Column Component | 18:26 |
12 | The Grid Component | 11:05 |
13 | InlineCluster Component | 12:28 |
14 | Inline Component | 23:23 |
15 | Introduction to Layout Wrapper Primitives | 02:40 |
16 | The PadBox Component | 13:45 |
17 | The Center Component | 14:28 |
18 | The Frame Component | 20:00 |
19 | The Cover Component | 17:15 |
20 | The Hero Section Revisited | 08:55 |
21 | Introduction to The Settings Pages | 01:33 |
22 | The Menu and Header | 24:11 |
23 | The Main and SideBar | 16:18 |
24 | The Profile Pane | 20:06 |
Similar courses

Full Stack Spring Boot & React
Sources: Amigoscode (Nelson Djalo)
Netflix recently switched their entire backend to Spring Boot 2. It was a no brainer really. Spring Boot 2 is the best framework to build applications. Weather you build a small...
10 hours 1 minute 23 seconds

MERN Stack Front To Back: Full Stack React, Redux & Node.js.
Sources: udemy, Brad Traversy
Welcome to "MERN Stack Front To Back". In this course we will build an in depth full stack social network application using Node.js, Express, React, Redux and MongoDB along with...
11 hours 52 minutes 29 seconds

Ultimate PHP, Laravel, CSS & Sass! Learn PHP, Laravel & Sass
Sources: udemy
Have you have been taking courses that are not up to date or courses that after finishing them you will immediately know that is not what they promised to be in
95 hours 30 minutes

The Complete Guide to Advanced React Patterns (2020)
Sources: udemy
Build reusable React components without relying on if statements or more props! Use hooks & trusted advanced patterns!
6 hours 1 minute 51 seconds

Build a Jira clone
Sources: Code With Antonio
In this 16-hour course, consisting of two parts (by the way, this is my longest course!), you will learn how to create a fully functional Jira clone with a...
16 hours 26 minutes 4 seconds