Build a Twitter Clone with the Next.js App Router and Supabase

Next.js App router is ushering in the next era of web development. The App router leverages React Server components for the first time.

React Server components are run only on the server and introduce a completely new set of decisions for React developers.

When you work with server components, you can access your backend directly. Combine that with Next.js Server Actions and you have some powerful patterns at your disposal to access and mutate data just like you need it.

With these powers come new concepts and mental models you’ll need to navigate. One of the immediate challenges you’ll run into is declaring “use client” or “use server” in your components.

In this course, you will be introduced to these new patterns through building a twitter clone application using the Next.js App Router and Supabase.

As you build out twitter-like features, you’ll learn to navigate these new concepts implementing a full stack app.

On the Next.js side of things, you’ll learn about:

• Client Components
• Server Components
• Route Handlers
• Server Actions
• Middleware
• Implementing Optimistic UI

And on the backend (via Supabase) you’ll learn about:

• Configuring Supabase Auth to use cookies
• Using Row Level Security (RLS) policies to implement Authorization
• Querying data across multiple tables
• Introspecting PostgreSQL schema to generate TypeScript definitions with the Supabase CLI
• Subscribing to realtime database changes

This course is a deep dive into modern web development and I'm very excited to see what you're going to build on the other side! 🚀