Let's build Facebook 2.0 with REACT.JS! (Next.js, Tailwind CSS,Google Login,Full Tutorial-Beginner)

👑👑👑👑👑

Second Video: "Soon"

Build a fully functional Facebook feed with comments!!!What you'll learn:
-How to use React, Next js and Tailwind CSS to build a FULLY mobile responsive web app!
-Tutorial for Beginners

TimeStamps:
0:00 Intro
5:48 Building the Header
8:55 Building the Left side of the Header
12:32 Building the Middle Part of the Header
17:47 Building the Right side of the Header
27:08 Creating the Feed Component
29:18 Creating the Left Sidebar
36:35 Adding description to the Left Sidebar
43:10 Creating the Facebook Stories
52:35 Making the Facebook Stories Responsive on mobile
1:00:06 Adding the second part of the story
1:12:27 Creating the New Post Component
1:31:19 Creating the second part of the New Post Component
1:41:15 Making the new post responsive on mobile
1:47:15 Outro

Music:
1
––––––––––––––––––––––––––––––
Music provided by Audio Library Plus
––––––––––––––––––––––––––––––
2
––––––––––––––––––––––––––––––
Track: The Portal — Next Route [Audio Library Release]
Music provided by Audio Library Plus
––––––––––––––––––––––––––––––
3
––––––––––––––––––––––––––––––
Track: Eight — Land of Fire [Audio Library Release]
Music provided by Audio Library Plus
––––––––––––––––––––––––––––––
4
––––––––––––––––––––––––––––––
Track: Tiger — Metro Vice [Audio Library Release]
Music provided by Audio Library Plus
––––––––––––––––––––––––––––––
5
––––––––––––––––––––––––––––––
Creative Commons — Attribution-ShareAlike 3.0 Unported — CC BY-SA 3.0
––––––––––––––––––––––––––––––
6
––––––––––––––––––––––––––––––
Creative Commons — Attribution 3.0 Unported — CC BY 3.0
––––––––––––––––––––––––––––––
7
––––––––––––––––––––––––––––––
Creative Commons — Attribution 3.0 Unported — CC BY 3.0
––––––––––––––––––––––––––––––
8
––––––––––––––––––––––––––––––
Creative Commons — Attribution 3.0 Unported — CC BY 3.0
––––––––––––––––––––––––––––––
9
––––––––––––––––––––––––––––––
Creative Commons — Attribution-NoDerivs 3.0 Unported — CC BY-ND 3.0
––––––––––––––––––––––––––––––
10
––––––––––––––––––––––––––––––
Creative Commons — Attribution 3.0 Unported — CC BY 3.0
––––––––––––––––––––––––––––––

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.

[goosedev]

Leave a comment with what social media app should i build in the future!
Next Part coming in 20h

[FirstHighFlight]

Nice video!! Waiting for the backend one

[biswajitghosh]

Plz bulid a uber clone with maps integration...its highly needed...and btw awesome work till now

[megatronskneecap]

Amazing! But why not Facebook login lol

[egistbalegistbal]

Hello, can you please show how sites such as Twitter, Uber, Netflix etc. are designed as lessons?

[betterbehappythannot]

Romanian Brother, I paused the video in the beginning and tried to make up the design as close as possible without copying the code (reverse engineer small scale :D), can I use it in for my job portfolio? I added my self every single functionality without looking at your code and even added chat app at the end myself :).

[egistbalegistbal]

please can you add subtitles to your all videos on your channel and can you upload new videos to your channel more and often ? Thanks

[yasserhy]

Too bad you did not implement the sticky header and sidebars :(

[Fang_Yuan]

instead of storing data in firebase, I want to save data on google drive, what do you think is a good library for me to use? and can it be directly in nextjs or is it mandatory to use nodejs/express?

[semikolondev]

I think the key to FB 2.0 is to not use react x) FB 1.0 is so slow and buggy with react.