Full Stack Next.js & Supabase Twitter Clone – Full Course

Channel:

freeCodeCamp.org

Subscribers:

10,700,000

Published on July 20, 2023 2:55:49 PM ● Video Link: https://www.youtube.com/watch?v=QdxUZhLHZiA

Duration: 6:15:09

80,434 views

2,656

Learn Full Stack development with Next.js 13, Tailwind CSS, TypeScript, and Supabase. In this course, you will build a Twitter clone.

💻 Course Github Link: https://github.com/sonipranjal/ultimate-twitter-clone

✏️ Course developed by @ClubOfCoders
Pranjal’s Twitter: https://twitter.com/pranjalsoni_
ClubOfCoders Website: https://www.clubofcoders.com/

⭐️ Contents ⭐️
(0:00:00) Twitter Intro
(0:02:32) Build the Ultimate Twitter Clone using Next.js 13 (with Tailwind CSS, TypeScript and Supabase)
(0:14:10) Building the left sidebar of Twitter using Tailwind CSS
(0:34:09) Building Twitter Timeline using Next.js & Tailwind CSS
(0:56:25) Building the Trending Section Layout and Who to follow using Tailwind CSS
(1:18:26) Designing Twitter Clone PostgreSQL Database using ChatGPT and dbdiagram
(1:35:39) Authentication with Supabase in Next.js 13 app directory
(2:15:06) Saving Tweet in DB using NextJs Server Actions and Supabase
(2:41:07) Handling errors in NextJs Server Action
(2:57:11) Fetching all the Tweets in React Server Component
(3:14:34) Implementing the Like Tweet Feature
(3:32:29) Like-Unlike Feature Part-2
(3:59:47) Optimising the Web App
(4:19:09) Fixing a bug
(4:22:21) Using ChatGPT to build Drizzle ORM schema from SQL
(4:53:16) How to join tables and build a complex query using Drizzle ORM
(5:30:53) Reply Tweet Feature
(5:54:55) Reply Feature Part-2

🎉 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