React Formula - Learn Frontend Development

23h 47m 37s
English
Paid
August 15, 2024

Learn to create modern interfaces using React, Tailwind CSS, and other tools. Most React tutorials are not designed for real beginners and do not help achieve true mastery. They assume that you are already familiar with frontend development and offer only a few random projects. But what if you are a complete beginner? React Formula offers you the chance to start with the basics and gradually deepen your understanding so that nothing is overlooked. By the end of the course, you will confidently create your own React applications and possess the skills needed for frontend development work.

Watch Online React Formula - Learn Frontend Development

Join premium to watch
Go to premium
# Title Duration
1 Course Welcome 00:42
2 Why Learn React? 02:45
3 Meet the Instructor 02:04
4 Effective Learning 02:58
5 Workspace Tour 04:46
6 Your First App 05:30
7 Rendering Components 07:55
8 Passing Props 10:00
9 Passing Props II 08:48
10 Passing Props III 08:26
11 Alvin's Favorite Keybindings 06:54
12 Alvin's Favorite Keybindings 2 07:18
13 Intro to Tailwind CSS Lecture 04:37
14 Tailwind CSS Basics 10:16
15 Padding and Margin Lecture 03:26
16 Button Style Exercise 11:10
17 No Dynamic Class Names 05:24
18 Button Component Exercise 09:42
19 Flexbox Lecture 05:06
20 Flex Exercise 04:48
21 Flex Col Lecture 02:52
22 Flex Exercise II 04:05
23 Analyzing Layouts Lecture 05:30
24 Tailwind Documentation 04:14
25 Analyzing Layouts Exercise 1 10:51
26 Analyzing Layouts Exercise 2 09:23
27 Analyzing Layouts Exercise 3 06:02
28 Search Page Design 1 00:55
29 Search Page Design 2 09:33
30 Search Page Design 3 10:54
31 Search Page Design 4 05:36
32 Events and State Lecture 07:16
33 Click Event Exercise 1 00:39
34 Click Event Exercise 2 02:53
35 Click Event Exercise 3 11:27
36 Conditional Rendering Exercise 1 00:53
37 Conditional Rendering Exercise 2 10:46
38 Conditional Rendering Exercise 3 03:42
39 Conditional Rendering Exercise 4 02:05
40 Counter 1 00:37
41 Counter 2 04:45
42 Counter 3 04:39
43 Light Switch 1 00:44
44 Light Switch 2 05:35
45 Light Switch 3 12:39
46 Image Carousel 1 00:55
47 Image Carousel 2 09:52
48 Image Carousel 3 08:36
49 Cat Carousel 1 00:49
50 Cat Carousel 2 14:24
51 Cat Carousel 3 04:34
52 Cat Carousel 4 04:32
53 More State Welcome 00:48
54 Stacker 1 00:33
55 Stacker 2 04:08
56 Stacker 3 08:25
57 Checkered Grid 1 00:36
58 Checkered Grid 2 11:18
59 Checkered Grid 3 04:14
60 Centered Responsive Lecture 05:39
61 Simple Dark Mode 1 00:59
62 Simple Dark Mode 2 09:27
63 Simple Dark Mode 3 09:08
64 Modal 1 00:38
65 Modal 2 06:11
66 Modal 3 11:21
67 Playing Card 1 00:39
68 Playing Card 2 14:10
69 Playing Card 3 06:09
70 Map Lecture 06:54
71 Map Exercise 1 00:43
72 Map Exercise 2 08:47
73 Song List 1 00:37
74 Song List 2 14:00
75 Property Listings 1 00:57
76 Property Listings 2 10:43
77 Testimonial Carousel 1 00:47
78 Testimonial Carousel 2 13:03
79 Testimonial Carousel 3 05:57
80 Testimonial Carousel 4 05:14
81 Testimonial Carousel 5 06:50
82 Pagination 1 01:00
83 Pagination 2 10:28
84 Pagination 3 11:58
85 Munch Central 1 00:29
86 Munch Central 2 10:54
87 Furniture Pagination 1 00:46
88 Furniture Pagination 2 11:04
89 Inputs and Forms Lecture 04:00
90 Text Input Exercise 1 00:28
91 Text Input Exercise 2 08:51
92 Sign In Form 1 00:35
93 Sign In Form 2 11:19
94 Sign In Form 3 05:17
95 Word Filter 1 00:49
96 Word Filter 2 14:01
97 Message Project 1 00:40
98 Message Project 2 04:30
99 Message Project 3 13:34
100 Checkbox Input Exercise 1 00:31
101 Checkbox Input Exercise 2 10:25
102 Number Input Exercise 1 00:58
103 Number Input Exercise 2 10:07
104 Select Exercise 1 00:48
105 Select Exercise 2 09:05
106 Cat Directory 1 01:07
107 Cat Directory 2 11:26
108 Cat Directory 3 06:07
109 Cat Directory 4 02:38
110 Integrating with Backends 04:43
111 Using Fetch 1 00:52
112 Using Fetch 2 02:53
113 Using Fetch 3 11:44
114 Random Joke 1 00:50
115 Random Joke 2 08:35
116 Random Joke 3 07:44
117 Use Effect Lecture 04:30
118 Use Effect Exercise 1 00:50
119 Use Effect Exercise 2 03:02
120 Teammates Project 1 00:59
121 Teammates Project 2 14:35
122 Loading Spinner Exercise 1 00:47
123 Loading Spinner Exercise 2 05:06
124 Stocks Project 1 00:52
125 Stocks Project 2 06:53
126 Stocks Project 3 12:54
127 Async Await Exercise 1 00:25
128 Async Await Exercise 2 04:19
129 Weather Forecast 1 00:51
130 Weather Forecast 2 08:27
131 Weather Forecast 3 03:47
132 Error Handling 1 00:40
133 Error Handling 2 11:48
134 States Project 1 00:43
135 States Project 2 10:12
136 States Project 3 03:25
137 CRUD Welcome 03:03
138 Message Board 1 00:48
139 Message Board 2 05:30
140 Message Board 3 08:27
141 Deleting Furni 1 00:41
142 Deleting Furni 2 03:01
143 Deleting Furni 3 05:56
144 Deleting Furni 4 04:45
145 Updating Furni 1 00:58
146 Updating Furni 2 06:53
147 Updating Furni 3 05:46
148 Todo List Part 1 1 00:39
149 Todo List Part 1 2 12:24
150 Todo List Part 1 3 09:14
151 Todo List Part 2 1 00:46
152 Todo List Part 2 2 05:23
153 Todo List Part 2 3 15:08
154 React Router Welcome 01:17
155 Frontend Routing 1 01:25
156 Frontend Routing 2 04:28
157 Frontend Routing 3 08:56
158 Frontend Routing II 1 01:04
159 Frontend Routing II 2 10:18
160 Frontend Routing II 3 13:41
161 Refs Project 1 01:12
162 Refs Project 2 06:42
163 Refs Project 3 02:28
164 Refs Project 4 02:25
165 Intro to React Context 1 00:39
166 Intro to React Context 2 14:05
167 Theme Context 1 01:11
168 Theme Context 2 10:58
169 Use Callback 1 00:33
170 Use Callback 2 04:48
171 Use Callback 3 03:17
172 Applying Use Callback 1 00:15
173 Applying Use Callback 2 05:40
174 Use State Function Default Lecture 06:17
175 Use State Functional Setter Lecture 03:43
176 Use Effect Clean Up 1 00:19
177 Use Effect Clean Up 2 06:08
178 Responsive Design Welcome 01:03
179 Local Environment Setup 04:25
180 Screen Size Breakpoints 1 01:12
181 Screen Size Breakpoints 2 09:40
182 Screen Size Breakpoints 3 10:48
183 Mobile Responsive Design 1 01:28
184 Mobile Responsive Design 2 08:55
185 Mobile Responsive Design 3 15:00
186 Mobile Responsive Design 4 09:28
187 Mobile Responsive Design 5 10:51
188 Mobile Responsive Design 6 11:49
189 Capstone Project Welcome 03:12
190 Getting Started 1 00:56
191 Getting Started 2 11:50
192 Creating the AuthForm 1 01:05
193 Creating the AuthForm 2 19:48
194 Designing the Sign In 1 01:20
195 Designing the Sign In 2 13:31
196 API Integration 13:28
197 Sign Up Feature 1 01:30
198 Sign Up Feature 2 22:20
199 Improving Imports 06:19
200 Sign In Feature 1 01:31
201 Sign In Feature 2 18:18
202 Managing the Session Token 21:06
203 Basic Navbar 1 00:54
204 Basic Navbar 2 16:59
205 Sign Out Button 1 00:58
206 Sign Out Button 2 10:34
207 Sign Out Button 3 10:34
208 Fetching Plants 1 00:48
209 Fetching Plants 2 07:25
210 Plant List Page Design 1 00:51
211 Plant List Page Design 2 06:01
212 Plant List Page Design 3 11:26
213 Plant List Page Design 4 14:14
214 Plant Show Page Design 1 00:55
215 Plant Show Page Design 2 21:54
216 Pot Color Purchase Option 1 00:34
217 Pot Color Purchase Option 2 21:21
218 Adding to the Cart 1 00:34
219 Adding to the Cart 2 15:28
220 Cart Modal 1 00:46
221 Cart Modal 2 27:13
222 Cart Item Removal 1 01:00
223 Cart Item Removal 2 22:03
224 Mobile Menu 1 01:04
225 Mobile Menu 2 23:08
226 Finishing Touches 1 00:34
227 Finishing Touches 2 17:24
228 Congratulations 00:43

Similar courses to React Formula - Learn Frontend Development

React Query (OLD)

React Query (OLD)ui.dev (ex. Tyler McGinnis)

Duration 7 hours 1 minute 30 seconds
Classic React

Classic ReactBuild UI

Duration 4 hours 10 minutes 15 seconds
React and NodeJS: A Practical Guide with Typescript

React and NodeJS: A Practical Guide with Typescriptudemy

Duration 6 hours 54 minutes 59 seconds
Redux Saga

Redux Sagapluralsight

Duration 2 hours 54 minutes 54 seconds
React Front To Back 2022

React Front To Back 2022udemyBrad Traversy

Duration 19 hours 57 minutes 45 seconds