React – Head To Head
Learn how to build in interactive games tracker using Firebase and React.js.
Module 1 | Project Setup |
Unit 1 | RW - HTH - #1 - What is TypeScript? - 6:03 |
Unit 2 | RW - HTH - #2 - TypeScript Installation - 11:15 |
Unit 3 | RW - HTH - #3 - ESlint Installation - 9:14 |
Unit 4 | RW - HTH - #4 - What is Mobx? - 5:48 |
Unit 5 | RW - HTH - #5 - Mobx Installation - 11:45 |
Unit 6 | RW - HTH - #6 - ESlint CLI configuration - 2:52 |
Module 2 | Routes and Login |
Unit 1 | RW - HTH - #7 - Introduction and setup - 8:55 |
Unit 2 | RW - HTH - #8 - React Router and Routes - 8:03 |
Unit 3 | RW - HTH - #9 - Create Mobx ViewStore and pass it down - 10:10 |
Unit 4 | RW - HTH - #10 - Loader and login form - 12:13 |
Unit 5 | RW - HTH - #11 - Firebase project setup - 04:37 |
Unit 6 | RW - HTH - #12 - Log existing user to Firebase - 11:42 |
Unit 7 | RW - HTH - #13 - Updating ViewStore, Mobx DevTools - 12:17 |
Unit 8 | RW - HTH - #14 - Logout user from Firebase - 08:41 |
Unit 9 | RW - HTH - #15 - Simplifying all import statements - 09:27 |
Module 3 | CRUD Players |
Unit 1 | RW - HTH - #16 - Data structure overview - 04:32 |
Unit 2 | RW - HTH - #17 - Make App.tsx an observer - 07:39 |
Unit 3 | RW - HTH - #18 - AddPlayerForm and @inject - 13:21 |
Unit 4 | RW - HTH - #19 - Add players to Firebase (Create) - 06:49 |
Unit 5 | RW - HTH - #20 - Read players from Firebase (Read) - 12:52 |
Unit 6 | RW - HTH - #21 - Update players in Firebase (Update) - 09:37 |
Unit 7 | RW - HTH - #22 - Remove players from Firebase (Delete) - 05:45 |
Unit 8 | RW - HTH - #23 - Firebase CRUD Challenge - 02:40 |
Module 4 | CRUD Head To Heads |
Unit 1 | RW - HTH - #24 - Add head to head to Firebase (Create) - 08:49 |
Unit 2 | RW - HTH - #25 - Read head to heads from Firebase (Read) - 11:17 |
Unit 3 | RW - HTH - #26 - Update and Remove HTH from Firebase (Update, Delete) - 13:27 |
Module 5 | CRUD Games |
Unit 1 | RW - HTH - #27 - Selected Head To Head - 07:50 |
Unit 2 | RW - HTH - #28 - Update AddGameForm - 11:15 |
Unit 3 | RW - HTH - #29 - Create dynamic dropdown for HTH - 07:53 |
Unit 4 | RW - HTH - #30 - Add game to a related HTH and FB - 07:29 |
Unit 5 | RW - HTH - #31 - Get winner and send it to FB - 09:48 |
Unit 6 | RW - HTH - #32 - Read, update, delete games from FB - 13:54 |
Module 6 | Advanced Functionality |
Unit 1 | RW - HTH - #33 - Protecting some of the Routes - 08:52 |
Unit 2 | RW - HTH - #34 - All Component - 09:49 |
Unit 3 | RW - HTH - #35 - Head To Head details view and route - 13:53 |
Unit 4 | RW - HTH - #36 - Dynamic Head To Head content - 08:41 |
Unit 5 | RW - HTH - #37 - Games with classNames - 09:42 |
Unit 6 | RW - HTH - #38 - Show all games - 08:18 |
Unit 7 | RW - HTH - #39 - Fetch single head to head - 08:04 |
Module 7 | Final Tweaks |
Unit 1 | RW - HTH - #40 - Fine-tune Head To Head Details - 11:04 |
Unit 2 | RW - HTH - #41 - Update total score when adding or removing a game - 14:06 |
Unit 3 | RW - HTH - #42 - Prevent deleting all used players - 06:29 |
Unit 4 | RW - HTH - #43 - Remove all games associated with a deleted HTH - 04:44 |
Unit 5 | RW - HTH - #44 - Update Firebase security rules - 10:47 |
Unit 6 | RW - HTH - #45 - What's next? - 02:09 |