Full Stack React & Firebase Tutorial - Build a social media app

⭐️ Code ⭐️

⭐️ Course Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:07:03) Create & Read Data
⌨️ (0:27:56) Express & formatting response
⌨️ (0:42:37) User Registration
⌨️ (1:03:22) Validation & Login Route
⌨️ (1:19:33) Authentication Middleware
⌨️ (1:33:10) Refactoring & Organizing
⌨️ (1:48:46) Image Upload
⌨️ (2:13:45) Add and Get User Profile Details
⌨️ (2:33:15) Getting and Commenting on Post
⌨️ (2:56:38) Like, Unlike and Delete Post
⌨️ (3:25:42) Create and Get Notifications
⌨️ (3:58:11) Finishing up Cloud Functions
⌨️ (4:23:46) Getting Started With React
⌨️ (4:44:01) Post Card Details
⌨️ (5:11:45) Login Form
⌨️ (5:50:36) Signup and Auth State
⌨️ (6:05:16) Redux Setup
⌨️ (6:41:17) Signup and Auth Route
⌨️ (6:56:35) Profile Section
⌨️ (7:19:48) Image Upload
⌨️ (7:31:24) Logout and Edit profile
⌨️ (7:53:60) Navbar Buttons
⌨️ (8:07:60) Like and Unlike Actions
⌨️ (8:39:11) Delete Button
⌨️ (8:57:45) Add Post Component
⌨️ (9:20:19) Post Dialog
⌨️ (9:47:30) Post Dialog Details
⌨️ (10:01:21) Displaying Comments
⌨️ (10:16:29) Submitting comments
⌨️ (10:37:28) User Page
⌨️ (10:54:30) Notifications
⌨️ (11:31:59) Loading Skeletons
⌨️ (11:59:28) Deployment to Firebase

February 15, 2022 Update: note that we cannot update this video. Here are some updates from @FrankJacquette:
- Firebase no longer offers a free tier. You will have to set up an account and provide a credit card to use Firebase functions.
- The current version of Busboy has broken the API described in the video. I recommend modifying your code to use the current version.
- React-router-dom has API-breaking changes since the video was made. I recommend downgrading to version 5.x.
- The instructor will occasionally introduce a bug in his work and repair it later. If your code isn't working, watch a little longer before assuming it's your issue.
- The Redux code as implemented will cause an infinite page refresh loop under some circumstances. Clearing local storage and reloading the page will bypass this.
- componentWillReceiveProps is deprecated and should be replaced with componentDidUpdate. There are several good pages out there describing how to do this.
- Material UI has gone through a major version release since the video was produced. While everything in the video will continue to work, the documentation you'll find is for the current version of MUI and will be slightly different. Also, Grid has slightly different parameters.

-

[nirajkc]

This is completely insane, somebody is sharing his knowledge for 12 hours for free absolutely.God Bless you!!

[Your_Boy_Suraj]

⭐️ Course Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:07:03) Create & Read Data
⌨️ (0:27:56) Express & formatting response
⌨️ (0:42:37) User Registration
⌨️ (1:03:22) Validation & Login Route
⌨️ (1:19:33) Authentication Middleware
⌨️ (1:33:10) Refactoring & Organising
⌨️ (1:48:46) Image Upload
⌨️ (2:13:45) Add and Get User Profile Details
⌨️ (2:33:15) Getting and Commenting on Post
⌨️ (2:56:38) Like, Unlike and Delete Post
⌨️ (3:25:42) Create and Get Notifications
⌨️ (3:58:11) Finishing up Cloud Functions
⌨️ (4:23:46) Getting Started With React
⌨️ (4:44:01) Post Card Details
⌨️ (5:11:45) Login Form
⌨️ (5:50:36) Signup and Auth State
⌨️ (6:05:16) Redux Setup
⌨️ (6:41:17) Signup and Auth Route
⌨️ (6:56:35) Profile Section
⌨️ (7:19:48) Image Upload
⌨️ (7:31:24) Logout and Edit profile
⌨️ (7:53:60) Navbar Buttons
⌨️ (8:07:60) Like and Unlike Actions
⌨️ (8:39:11) Delete Button
⌨️ (8:57:45) Add Post Component
⌨️ (9:20:19) Post Dialog
⌨️ (9:47:30) Post Dialog Details
⌨️ (10:01:21) Displaying Comments
⌨️ (10:16:29) Submitting comments
⌨️ (10:37:28) User Page
⌨️ (10:54:30) Notifications
⌨️ (11:31:59) Loading Skeletons
⌨️ (11:59:28) Deployment to Firebase

[tcshple]

12 hours .. impressed by your hard work. great job!

[Nevergnnanoe]

This is hands down the best tutorial i've ever followed in regards to coding yes it's long but thorough. I used it for 2 different projects one in Express and the other in Koa.

[iamsammybe]

i really like the way you build this app. i have been taking a lot of react courses and even some that i really love and helped me learn a lot, don't make as much sense as your method. after watching this, i realize that they are really chaotic and go all over the place, but i love how you start on backend functionality and then build the ui on top of that. it seems more organized and easy to understand.

[marekvozarik]

I can't say how grateful am I for this video. Thank you very much. Fullstack web dev all in one place, clear, interesting and informative. I really enjoyed this course, thanks again. Maybe a little note, I would use a hooks in react.

[JayronWhitehaus]

At 4:57:20 he laughs a little when he realizes the code basically reads, "for each scream, return a component, scream, with a property of scream set to scream". Lol. Amazing video by the way! Absolutely love it!

[alexfinley]

Great course! Thank you so much. Learned so much and aced my senior project because of this. Just a quick note for anybody who makes it to the end - It does take a bit before your Firebase Hosting updates with the Client contents.

[KommSusserTd]

CRAZY! You guys are simply the best. I freakin' love this channel.

[thaungthanhan]

Perfect course ever! Some errors might occur due to version changes. No worries, its an chance for you to learn fixing bugs.

[coder]

to make 12 hours video is not a piece of cake. all I'm looking for on internet you just put all that in one video. really really appreciate your hard work and thank you for your amazing efforts

[eruston]

I have yet to even start this tutorial, but am very grateful that you have posted it! I am looking forward to diving right into this content!

[fenixful]

After 3rd attempt, I finally done this project, I've learned a lot, enjoying with my friends using app and I wanna thank you for your hard work on this content!

[akiladilan]

Wow that's amazing please upload any other projects 🙏🙏.. I'm follow your Chanel and very helpful for my coding life (I'm from SL 🇱🇰🇱🇰🇱🇰)

[milacful]

about your question @ 3:02:00 - I like the way you are explaining everything while typing. Not too much, not too little. I find it perfect with my level of knowledge. Thank you, you are a great teacher and this tutorial has been great so far!!!

[martinmuenning]

Perfect introduction, great overview of whats needed and why. Saved me a lot of time, thanks!

[guilhermebais]

i have more than 40 courses on udemy, you made a course better than most of what i have seen, and, for free, you`re awesome

[finncrisp]

Great tutorial! Front end development used to be so so difficult back in the day when we only had jQuery. Now with tools like react and firebase it has become much much easier to get started with front end.

[bobbytop]

This is the best channel in youtube..I become developer because of you..please never stop teaching us.

[joshuad]

this style of teaching is the best i've ever had. ty!