Build a Social Media App With React, Nextjs, Tailwind, TypeScript, Redux, Firebase (Premium Course)
Build a Social Media App With React, Nextjs, Tailwind, TypeScript, Redux, Firebase (Premium Course)
Learn how to work with me to get into your first coding job: https://asapfrontend.com
CHAPTERS:
00:00 Introduction to the Project
01:22 Features Overview
03:54 Tech Stack and Tailwind CSS Introduction
09:02 Setting Up the Project
10:59 Building the Sidebar
44:47 Creating the Post Feed
59:31 Setting Up Profile Picture
59:47 Creating Post Header
01:00:24 Styling Post Header
01:00:50 Adding Post Content
01:03:55 Implementing Responsiveness
01:08:19 Adding Post Icons
01:13:58 Building Widgets Tab
01:14:23 Creating Search Bar
01:16:58 Styling Trending Topics
01:22:13 Who to Follow Section
01:28:20 Finalizing Widgets Tab
01:32:30 Adding Signup Prompt
01:43:36 Building Modals with Material UI
01:52:09 Setting Up Redux Store
01:58:13 Creating the Modal Slice
01:58:41 Defining Modal States
01:59:26 Implementing Reducers for Modal Actions
02:00:28 Integrating Modal Slice with Redux Store
02:01:44 Using Redux State in Signup Modal Component
02:06:06 Styling the Signup Modal
02:20:19 Creating the Login Modal
02:23:39 Setting Up Firebase Authentication
02:24:45 Using Environment Variables for Firebase
02:30:58 Handling User Sign Up with Firebase
02:36:16 Syncing User State with Redux
02:51:23 Displaying User Info in Sidebar
02:58:25 Implementing User Sign Out
02:59:32 Resetting User Slice in Redux
03:00:07 Handling Client and Server Components
03:01:15 Implementing Sign Out Functionality
03:04:04 Updating User Profile with Firebase
03:11:45 Login Functionality
03:15:12 Guest Login Implementation
03:18:32 Styling User Info Component
03:20:51 Setting Up Firestore Database
03:22:24 Creating and Posting Data
03:29:28 Fetching and Displaying Posts
03:42:04 Building Comment Modal
04:03:32 Setting Up Comment Details
04:05:25 Displaying Comment Details in Modal
04:06:59 Sending a Reply
04:11:44 Creating Dynamic Routes
04:13:49 Styling the Dynamic Route Page
04:26:54 Fetching Post Data from Firebase
04:38:05 Implementing Like and Comment Functionality
04:46:53 Adding a Loading Screen
05:00:15 Deploying the App to Vercel
05:02:05 Final Touches and Conclusion
05:02:42 Outro Ends
Want to build a real-world full-stack social media app in 2025? In this free 5-hour coding project, you’ll learn how to create a complete Twitter-style app using React, Tailwind CSS, Firebase, Redux, and Material UI — all from scratch. Perfect for anyone serious about becoming a frontend developer or landing a six-figure web development job.
Follow along step-by-step as we build modern UI components, implement authentication, manage global state with Redux, use Firebase Firestore for real-time data, and deploy the project to Vercel. By the end of this video, you'll have a job-ready project to showcase in your portfolio.
OTHER SOCIALS
Instagram: / imanwmusa
TikTok: / imanwmusa
Watch video Build a Social Media App With React, Nextjs, Tailwind, TypeScript, Redux, Firebase (Premium Course) online without registration, duration hours minute second in high quality. This video was added by user Iman Musa 18 April 2025, don't forget to share it with your friends and acquaintances, it has been viewed on our site 3,540 once and liked it 197 people.