Build and Deploy a LeetCode Clone with React, Next JS, TypeScript, Tailwind CSS, Firebase

In this project tutorial, you will build a LeetCode clone with React, Tailwind CSS, Next.JS, Typescript, and Firebase. Also deploy it to Vercel at the end. 💻 Source Code: https://github.com/burakorkmez/leetcode-clone-youtube 💻 Github Gist: https://gist.github.com/burakorkmez/5ba4c1a910f396050a2ac2f229418f54 🔗 Demo Project: https://leetclone.vercel.app/problems/two-sum 🔗 Discord Server(to ask questions): https://discord.gg/YFn2WyheZV Course created by @codesistency ❤️ Try interactive Frontend courses we love, right in your browser: https://scrimba.com/freeCodeCamp-Frontend (Made possible by a grant from our friends at Scrimba) ⭐️ Contents ⭐️ 0:00:00 Intro 0:00:29 Demo of The App 0:05:23 Project Setup 0:08:51 Auth Page Setup 0:13:19 Auth Page Navbar 0:18:54 AuthModal Layout UI 0:22:16 Login UI 0:29:41 Signup UI 0:31:59 ResetPassword UI 0:33:13 Integrating Recoil Auth State 0:47:31 Firebase Setup 0:52:41 Signup Functionality 1:01:21 Login Functionality 1:05:14 Auth Page Route Guard 1:08:01 Home Page UI 1:12:50 Problems Table UI 1:21:01 Youtube Video Modal 1:29:51 Topbar Update On Auth 1:32:46 Logout Functionality 1:37:11 Auth Modal Optimizations 1:38:44 Reset Password Functionality 1:42:56 React Toastify 1:47:19 Image optimizations 1:54:33 Creating [pid] page and update topbar 2:02:27 Creating Timer.tsx 2:12:31 Creating Workspace.tsx 2:15:18 Splitting The Page 2:19:47 Creating ProblemDescrition.tsx 2:26:03 Creating PreferenceNav.tsx 2:34:39 Creating Code Editor 2:41:10 Adding Test Cases UI 2:50:15 Creating EditorFooter.tsx 2:56:32 Data Handling Explained 3:01:50 Two Sum Problem 3:12:52 Reverse Linked List 3:18:05 Jump Game Problem 3:20:13 Valid Parentheses Problem 3:21:16 Search 2d Matrix Problem 3:22:01 Using SSG for [pid].tsx 3:46:47 Updating testcases UI 3:51:39 Initializing Firestore 3:55:56 Adding problems to DB 4:12:09 Fetch Problems 4:32:58 Create Users in DB 4:40:33 Fetch problem data 4:51:28 Loading skeletons 4:56:35 Get user data on the problem 5:06:23 Like functionality 5:27:51 Dislike functionality 5:39:03 Star functionality 5:46:03 Next and Previous problem 5:55:23 Solving Hydration Error 5:58:08 Confetti Celebration 6:01:43 Code Submission 6:20:50 Save code to localstorage 6:24:48 Solving bugs 6:31:08 Toggle Full Screen 6:34:13 SettingsModal UI 6:41:33 SettingsModal Functionality 6:54:23 Update Home Page 6:59:11 Sandboxing technique 7:01:58 Deployment 7:05:08 Firebase Rules 🎉 Thanks to our Champion and Sponsor supporters: 👾 davthecoder 👾 jedi-or-sith 👾 南宮千影 👾 Agustín Kussrow 👾 Nattira Maneerat 👾 Heather Wcislo 👾 Serhiy Kalinets 👾 Justin Hual 👾 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