Популярное

Музыка Кино и Анимация Автомобили Животные Спорт Путешествия Игры Юмор

Интересные видео

2025 Сериалы Трейлеры Новости Как сделать Видеоуроки Diy своими руками

Топ запросов

смотреть а4 schoolboy runaway турецкий сериал смотреть мультфильмы эдисон
dTub
Скачать

🔴 Let's build a Social Media App with REACT.JS! (Next.js, Tailwind, Image Uploads, Social Login)

Автор: Sonny Sangha

Загружено: 2021-05-15

Просмотров: 547540

Описание:

🚨 Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course

🫂 Join my Community, "University of Code" for FREE: https://www.universityofcode.com

🔴 LOOKING FOR THE CODE? 🛠️
https://links.papareact.com/github

Join me as I build a completely responsive real-time Social Media App with TAILWIND CSS (with 2.1 JIT!) & NEXT.JS with Image Upload functionality and Powered by Firebase!

🎙️ PODCAST
https://links.papareact.com/podcast

🌍 SOCIALS:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord
Newsletter: https://links.papareact.com/newsletter

❤️ SUPPORT
PAPA Merch: https://links.papareact.com/merch
Donate: https://links.papareact.com/donate

🕐 TIMESTAMPS:
00:00 Introduction
00:25 Build Showcase
03:58 Initialising the Build
09:53 Setting Up Tailwind CSS
15:21 Building the Header Component
19:24 Building the Left Side of the Header
39:01 Building the Center of the Header (Header Icon Component)
57:41 Building the Right Side of the Header (1/2)
1:04:37 Implementing NextAuth.js
1:18:14 Building the Login Component
1:27:26 Building the Right Side of the Header (2/2)
1:31:07 Building the Sidebar Component
1:35:33 Building the SidebarRow Component (with Intense Debugging)
1:48:07 Building the Feed Component
1:49:13 Building the Stories Component
1:51:09 Building the StoryCard Component (with Intense Debugging)
2:15:32 Building the InputBox Component (1/2)
2:31:26 Implementing Cloud Firestore
2:35:27 Building the InputBox Component (2/2)
2:59:31 Building the Posts Component
3:02:12 Building the Post Component
3:16:16 Building the Widgets Component
3:23:06 Building the Contact Component
3:26:40 Almost Final Build Demo
3:28:50 Implementing Additional Server Side Rendering Step
3:35:03 Final Build Demo
3:37:49 Outro

DISCLAIMER: This Video is made for informational and educational purposes only. We do not own or affiliate with Facebook and it's subsidiaries in any form. Copyright Disclaimer under section 107 of the Copyright Act 1976, allowance is made for “fair use” of this video for education purposes.

#reactjs #tailwindcss #nextjs

🔴 Let's build a Social Media App with REACT.JS! (Next.js, Tailwind, Image Uploads, Social Login)

Поделиться в:

Доступные форматы для скачивания:

Скачать видео mp4

  • Информация по загрузке:

Скачать аудио mp3

Похожие видео

🔴 Let's build a Delivery Driver App w/ REACT NATIVE! (Navigation, Redux, TS, Google Autocomplete)

🔴 Let's build a Delivery Driver App w/ REACT NATIVE! (Navigation, Redux, TS, Google Autocomplete)

🔴 Let's build a Next-Gen AI Portfolio with NEXT.JS 16 (OpenAI AgentKit, MCP, Sanity, Clerk) | 2026

🔴 Let's build a Next-Gen AI Portfolio with NEXT.JS 16 (OpenAI AgentKit, MCP, Sanity, Clerk) | 2026

Скоро начнётся пятый год войны | Зачем её вести дальше (English subtitles)

Скоро начнётся пятый год войны | Зачем её вести дальше (English subtitles)

«НАЧНЕТСЯ КАСКАДНЫЙ ЭФФЕКТ». В России бьют тревогу. КРИЗИС УЖЕ НАЧАЛСЯ

«НАЧНЕТСЯ КАСКАДНЫЙ ЭФФЕКТ». В России бьют тревогу. КРИЗИС УЖЕ НАЧАЛСЯ

🔴 Let's build a Video Streaming Web App with REACT.JS! (Next.js, Tailwind CSS, Responsive)

🔴 Let's build a Video Streaming Web App with REACT.JS! (Next.js, Tailwind CSS, Responsive)

🔴 Let's build a Deliveroo Clone with REACT NATIVE! (Navigation, Redux, Tailwind CSS & Sanity.io)

🔴 Let's build a Deliveroo Clone with REACT NATIVE! (Navigation, Redux, Tailwind CSS & Sanity.io)

🔴 Let’s build a Scheduling SaaS with NEXT.JS 16! (Sanity, Clerk, CodeRabbit, Google Calendar & Meet)

🔴 Let’s build a Scheduling SaaS with NEXT.JS 16! (Sanity, Clerk, CodeRabbit, Google Calendar & Meet)

Winter Chill 2025 - 2026 ❄️ 🌅 24/7 Live Radio 💻 Happy Music to Start Your Day - Chillout House Music

Winter Chill 2025 - 2026 ❄️ 🌅 24/7 Live Radio 💻 Happy Music to Start Your Day - Chillout House Music

🔴 Let’s build an AI Podcast SaaS with NEXT.JS 16! (Inngest, Clerk, CodeRabbit, Convex, Stripe)

🔴 Let’s build an AI Podcast SaaS with NEXT.JS 16! (Inngest, Clerk, CodeRabbit, Convex, Stripe)

Учим HTML и CSS за 7 часов! Уроки по созданию сайтов Полный курс HTML и CSS с нуля до профессионала

Учим HTML и CSS за 7 часов! Уроки по созданию сайтов Полный курс HTML и CSS с нуля до профессионала

🔴 Lets build a Real-Time Messaging App with Next.js! (Video Calling, Group Chats, Stream, Clerk, TS)

🔴 Lets build a Real-Time Messaging App with Next.js! (Video Calling, Group Chats, Stream, Clerk, TS)

Музыка для работы за компьютером | Фоновая музыка для концентрации и продуктивности

Музыка для работы за компьютером | Фоновая музыка для концентрации и продуктивности

React Native Crash Course 2.0 for Beginners - Build 4 Apps in 14 Hours (Expo, Tailwind, Payment, AI)

React Native Crash Course 2.0 for Beginners - Build 4 Apps in 14 Hours (Expo, Tailwind, Payment, AI)

Master Tailwind CSS By Building 3 Projects | Tailwind CSS Complete Course | #huxnwebdev

Master Tailwind CSS By Building 3 Projects | Tailwind CSS Complete Course | #huxnwebdev

🔴 Let’s build an LMS Platform with NEXT.JS 16! (Sanity, Clerk, CodeRabbit, Stripe, Mux, AI Agent's)

🔴 Let’s build an LMS Platform with NEXT.JS 16! (Sanity, Clerk, CodeRabbit, Stripe, Mux, AI Agent's)

Chillout Lounge Radio - 24/7 Live | Smooth Background Music | Focus, Study, Work, Sleep, Meditation

Chillout Lounge Radio - 24/7 Live | Smooth Background Music | Focus, Study, Work, Sleep, Meditation

Как небольшая команда разработчиков создала React в Facebook | React.js: Документальный фильм

Как небольшая команда разработчиков создала React в Facebook | React.js: Документальный фильм

Word Advanced Tutorial

Word Advanced Tutorial

🔴 Lets build a Class Booking SaaS Platform with NEXT.JS 16! (Sanity, Clerk Billing, AI Agents, Maps)

🔴 Lets build a Class Booking SaaS Platform with NEXT.JS 16! (Sanity, Clerk Billing, AI Agents, Maps)

🔥 Master Playwright with JavaScript in 10 Hours | Automation Hero!

🔥 Master Playwright with JavaScript in 10 Hours | Automation Hero!

© 2025 dtub. Все права защищены.



  • Контакты
  • О нас
  • Политика конфиденциальности



Контакты для правообладателей: infodtube@gmail.com