udemy-build-web-apps-with-react-firebase-2022-1-0

& Setup\ 0:00 Welcome to the Course 2:56 React at a Glance 7:00 What You Should Already Know 8:19 Environment Setup 11:26 Using the Course Files Basics\ 13:04 Using React with a CDN 18:12 Making a React Component 22:51 JSX & Templates 26:42 Template Expressions & Variables 31:28 Click Events & Event Handlers Create-React-App\ 37:35 Making a React Site (create-react-app) 41:31 Project Structure Walkthrough 48:54 Running the Application 53:30 Using Images 57:04 Using Stylesheets to State & useState\ 1:00:23 Why We Need State 1:07:37 Using the useState Hook 1:14:28 How State & Rendering Works 1:19:19 Outputting Lists 1:27:37 Using the Previous State 1:37:14 Conditional Templates 1:44:07 useState Limitations & Props\ 1:45:43 Using Mutliple Components 1:47:22 Creating a Title Component 1:52:53 Intro to Props 1:58:44 React Fragments 2:02:31 Children Prop (Making a Modal Component) 2:10:17 Functions as Props 2:15:13 CHALLENGE - Showing the Modal 2:17:41 Portals 2:21:32 CHALLENGE - Reusable Event List Component 2:28:26 Class Components Overview React Applications\ 2:31:12 Using Global Stylesheets 2:34:22 Component Stylesheets 2:40:59 Using Inline Styles 2:44:20 Dynamic Inline Styles 2:46:56 Conditional CSS Classes 2:49:43 CSS Modules Input & Events\ 2:56:05 Forms & Labels in React 3:03:21 The onChange Event 3:09:37 Controlled Inputs 3:15:13 Submitting Forms (onSubmit) 3:21:33 Adding Events to the Event List 3:28:09 Using the useRef Hook 3:34:41 Select Boxes Data & useEffect\ 3:40:03 New Project & JSON Server 3:47:04 Why We Need useEffect 3:55:23 Fetching Data with useEffect 4:03:11 The useEffect Dependency Array 4:12:36 useCallback for Function Dependencies 4:21:05 Creating a Custom Fetch Hook 4:35:08 Adding a Loading_Pending State 4:39:33 Handling Errors 4:48:16 Why We Need a Cleanup Function 4:52:55 Aborting Fetch Requests 4:58:40 useEffect Gotcha - Infinite Loops BUILD - Memory Game\ 5:04:56 Project Preview & Setup 5:10:38 Setting up & Shuffling Cards 5:18:43 Creating a Card Grid 5:23:01 CHALLENGE - Creating a Card Component 5:27:12 Making Card Choices 5:33:08 CHALLENGE - Comparing Choices 5:40:23 Adding a ’matched’ Property to Cards 5:46:20 Flipping Cards 5:55:18 Flipping Animation (CSS) 5:57:38 Making Cards _disabled_ 6:02:41 Finishing Touches React Router\ 6:06:33 Multi-Page React Sites 6:12:13 React Router Setup 6:19:12 Switch & Exact Match 6:25:15 Links & Nav Links 6:32:30 Fetching Data 6:39:54 Route Parameters 6:46:29 The useParams Hook 6:53:20 Programmatic Redirects 6:59:01 Redirect Component 7:01:30 Query Parameters BUILD - Recipe Directory\ 7:06:53 Project Preview & Setup 7:13:32 Router & Pages Setup 7:19:50 Making a Navbar Component 7:24:43 Fetching Data 7:29:24 Recipe List Component 7:39:09 CHALLENGE - Fetching a Single Recipe 7:44:26 Recipe Details Template 7:49:30 Making a _Create Recipe_ Form 7:58:10 Adding Multiple Ingredients 8:10:45 Making a POST Request 8:23:19 CHALLENGE - Redirecting the User 8:27:01 Making a Search Bar Component 8:34:13 Search Results Page 8:42:29 Finishing Touches Context & Reducers\ 8:45:50 Prop Drilling 8:48:26 What is the Context API_ 8:51:20 Creating a Context & Provider 8:58:55 Accessing Context Values 9:02:34 Creating a Custom Context Hook 9:08:23 Reducers & useReducer 9:22:20 Making a Color Theme Selector 9:32:57 Light & Dark Mode Selector 9:45:19 Styling Light & Dark Modes Firestore\ 9:52:00 What is Firebase_ 9:55:31 Firestore Databases 10:00:35 Connecting to Firebase 10:07:46 Fetching a Firestore Collection 10:19:33 Fetching a Firestore Document 10:29:11 Adding Firestore Data 10:35:03 Deleting Firestore Data 10:40:39 Real-Time Collection Data 10:48:27 Updating Documents 10:53:07 Real-Time Document Data BUILD - Finance Tracker (with Firebase Authentication)\ 10:57:38 Project Preview & Setup 11:00:56 CHALLENGE - Creating Pages & Routes 11:06:13 Creating a Navbar 11:10:56 Making the Login Form 11:18:15 CHALLENGE - Making the Signup Form 11:23:10 Firebase Setup 11:26:58 Firebase Authentication Setup 11:31:01 Creating a Signup Hook 11:42:15 Using the Signup Hook 11:51:25 Creating an Auth Context