Learn how to use React version 18 and Redux Toolkit in this full course for beginners. React is a free and open-source front-end JavaScript library for building user interfaces based on components.
✏️ Course created by @CodingAddict
Source Code
React Tutorial: https://github.com/john-smilga/react-course-v3
Redux Toolkit: https://github.com/john-smilga/redux-toolkit-tutorial
❤️ Try interactive React courses we love, right in your browser: https://scrimba.com/freeCodeCamp-React (Made possible by a grant from our friends at Scrimba)
Contents
⌨️ (
00:00:00) Setup
⌨️ (
0:30:33) Folder Structure
⌨️ (
0:42:58) First Component
⌨️ (
0:53:25) Extensions and settings.json
⌨️ (
1:06:09) JSX
⌨️ (
1:20:21) Nest Components
⌨️ (
1:26:35) Booklist
⌨️ (
1:36:57) CSS
⌨️ (
1:47:31) Images
⌨️ (
1:55:31) JSX - CSS
⌨️ (
2:02:17) JSX - Javascript
⌨️ (
2:08:44) Props
⌨️ (
2:18:33) Props - Somewhat Dynamic Setup
⌨️ (
2:23:00) Access Props - Multiple Approaches
⌨️ (
2:27:44) Children Prop
⌨️ (
2:35:12) Simple List
⌨️ (
2:43:48) Proper List
⌨️ (
2:51:12) Key Prop
⌨️ (
2:57:20) Props - Options
⌨️ (
3:02:56) Events
⌨️ (
3:21:51) Form Submission
⌨️ (
3:25:35) Mind Grenade
⌨️ (
3:28:55) Component Feature
⌨️ (
3:34:00) React Data Flow
⌨️ (
3:39:42) Challenge
⌨️ (
3:48:51) ES6 Modules
⌨️ (
3:58:40) Local Images (src folder)
⌨️ (
4:04:25) More Challenges
⌨️ (
4:13:20) Deployment
⌨️ (
4:18:43) useState Hook
⌨️ (
5:48:19) useEffect Hook
⌨️ (
6:19:29) Multiple Returns
⌨️ (
7:28:02) Folder Structure
⌨️ (
8:27:07) Forms
⌨️ (
9:27:53) useRef Hook
⌨️ (
9:50:10) Custom Hooks
⌨️ (
10:06:20) Context API
⌨️ (
10:43:01) useReducer Hook
⌨️ (
11:26:39) Performance
⌨️ (
12:11:45) Redux Toolkit
🎉 Thanks to our Champion and Sponsor supporters:
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Erdeniz Unvan
👾 Justin Hual
👾 Agustín Kussrow
👾 Otis Morgan
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news