Get started with React in this crash course. We will be building a task tracker app and look at components, props, state, hooks, working with an API and more.
Code:
https://github.com/bradtraversy/react-crash-2021
Timestamps:
- 0:00 - Intro & Slides
- 12:37 - Create a React app
- 14:52 - Files & folders
- 18:54 - App component & JSX
- 22:39 - Expressions in JSX
- 23:49 - Creating a component
- 27:18 - Component Props
- 28:50 - PropTypes
- 30:42 - Styling
- 34:17 - Button Component
- 37:46 - Events
- 40:18 - Tasks Component
- 41:03 - Create a list with .map()
- 43:07 - State & useState Hook
- 44:55 - Global state
- 46:52 - Task Component
- 49:30 - Icons with react-icons
- 51:41 - Delete task & prop drilling
- 55:50 - Optional message if no tasks
- 56:58 - Toggle reminder & conditional styling
- 1:03:13 - Add Task Form
- 1:06:16 - Form input state (controlled components)
- 1:09:18 - Add task submit
- 1:14:36 - showAddTask state
- 1:15:58 - Button toggle
- 1:19:33 - Build for production
- 1:21:51 - JSON Server
- 1:25:53 - useEffect Hook & Fetch tasks from server
- 1:30:13 - Delete task from server
- 1:31:51 - Add task to server
- 1:35:15 - Toggle reminder on server
- 1:39:15 - Routing, footer & about
#react #javascript #web-development #programming #developer