Start your software dev career - https://calcur.tech/dev-fundamentals Timestamps:
00:00 - Introduction
12:38 - Intro to React
23:14 - Create React App Files Explained
34:07 - Our First Component
45:57 - Understand Props in Components
53:07 - Intro to useState Hook
01:01:19 - Install Tailwind CSS for React
01:08:29 - Styling React with Tailwind CSS Classes
01:17:58 - Map through State Array (Loop)
01:28:38 - Create a Popup Modal with React Bootstrap
01:35:20 - Create and Style HTML Form
01:45:03 - Profile Form Data in Modal
01:52:32 - Update Parent Component State in Child Component
02:05:25 - How to Push to State Array
02:18:52 - Pass a Component to Props
02:25:27 - Create a Navbar with Tailwind CSS
02:34:13 - Pages and props.children
02:41:04 - Routing with React Router
02:46:40 - Create an Active Page Link in Navbar
02:53:41 - Finishing up Our Header
03:04:51 - Intro to useEffect Hook
03:16:55 - useEffect Dependency Array Explained
03:25:13 - Fetch an API to Display on Page
03:41:20 - URL Parameters in Router
03:45:44 - Redirect with useNavigate Hook
03:52:58 - Create 404 (Not Found) Page
04:03:08 - Fetch Response Status Codes and Errors
04:11:38 - Build and Style a Search Component
04:23:07 - Setup a Django Backend (Full Stack App)
04:34:06 - Create a REST API Backend
04:53:43 - Consume Backend API
05:06:22 - Create a Details by ID API
05:13:22 - Create a Details Page
05:21:36 - Return 404 From Backend API (Django)
05:29:56 - Code a Full CRUD API (Crate, Read, Update, Delete
05:45:09 - DELETE Request with Fetch
05:53:12 - Popup Modal to Add Data (POST)
06:03:53 - Close modal on POST Success (and Add Results to State)
06:12:37 - Dynamic Edit Form to Update API Data
06:29:18 - Comparing State Objects
06:38:48 - Display Form Errors on Page
06:48:53 - Tailwind CSS Form and Button Styling
07:04:09 - Intro to JWTs and Authentication (JSON Web Tokens)
07:14:41 - Create a Login Page
07:30:11 - localStorage and Bearer Auth Tokens
07:37:32 - useLocation and useNavigate State (Redirect to Previous Page on Login)
07:49:15 - useContexct Hook Introduction
08:03:19 - Create a Logout Button
08:15:38 - Auth Refresh Tokens
08:31:05 - User Register Form and API
08:43:35 - Create a Custom Hook (useFetch)
08:53:58 - Destructuring Explained (Custom Hook Parameters and Return Data)
09:09:11 - Default Values and Nested Data with Restructuring
09:16:40 - Custom Hook on Button Click (onClick POST with useFetch)
09:35:04 - TypeScript and Axios Intro
09:53:11 - TypeScript Components
10:02:36 - Generate Drop Down List from API
10:11:36 - Crypto Price Chart with Chart.js
10:26:37 - Dynamic Chart with Multiple Drop Downs (Chart.js)
10:42:18 - Calculate Crypto Values
10:55:36 - Aggregate Data with map and reduce
11:17:18 - Pie Chart with Chart.js (react-charts-2)
11:27:50 - GraphQL API and Apollo Intro
11:43:02 - GraphQL in Django Backend (Graphene)
~~~~~~~~~~~~~~~ CONNECT ~~~~~~~~~~~~~~~
️ Newsletter - https://calcur.tech/newsletter
Instagram - https://www.instagram.com/CalebCurry
Twitter - https://twitter.com/calebCurry
LinkedIn - https://www.linkedin.com/in/calebcurry
▶️ Subscribe - http://calcur.tech/subscribe
Courses - https://www.codebreakthrough.com
~~~~~~~~~~~~~~ SUPPORT ME ~~~~~~~~~~~~~~
↪ My Amazon Store - https://www.amazon.com/shop/calebcurry
🅿 Patreon - http://calcur.tech/patreon-calebcurry
🅖 GitHub Sponsors - https://github.com/sponsors/CalebCurry
Ⓟ Paypal - http://paypal.me/calcur