Skip to content
UdemyWeb DevelopmentPaid courseAll LevelsCertificate

Build Facebook clone with REACT JS AND THE MERN STACK (Udemy.com)

Build a fully advanced social media facebook clone application and master React js, Node js, Express js and Mongodb

Created by: Mohamed Hajji

Last updated May 2023

icon
What you will learn

  • Build a fully functional Advanced Social Media Facebook clone application version 2022
  • Master react js and all of its secrets and tricks and become comfortable using it for you frontend work
  • Build a scalable strong backend using node js and express js
  • Learn how to work with Mongodb and how to add ,update, remove and query like a pro.
  • Learn how to use Cloudinary to store your images in a new brilliant way and how to upload, search, filter and open a new perspective on working with Cloudinary.
  • Build a strong authentication system where you can register, login ,reset password
  • Build a mailing system from scratch to send emails to the user for email verification links and reset code password.
  • Strong advanced form validation using Formik and Yup and learn about the best form validation techniques used

How it compares

Against the other 815 rated Udemy courses in Web Development on CourseDuck:

  • Rating4.4 out of 5higher than 33% of them
  • Reviews546#259 of 816 by number of reviews
  • Length35.2 hourslonger than 90% of them
  • Last updatedMay 2023earlier than 69% of them

icon
Course Description

In this course you will learn how to build an advanced social media Facebook clone application (version 2022) and master working with React js , Node js, Express js, Mongodb and many many other tools we will use through the course.
-So as start we will build a strong authentication system so you can register, login and reset password, we will also have a validation system for register using Formik and Yup with friendly error messages  to verify name to be a certain length or free from special characters, validate email and password, validate dates to verify age, username will be generated automatically and we will make sure it unique.
-We are also creating a mailing system where we will send verification links and reset password codes to the user, and directly after registering the user gets a verification link to activate account, so we are also learning how to create html emails.
-We have a home page where all posts for the people you follow or friends with will be displayed mixed with your posts and ordered from newest to oldest.

-You can create a post using text, emojis ,backgrounds, images and done beautifully dame as Facebook exactly.

-You can react on a post and change react unreact, use like button to like, unlike and remove existing react, also reacts will be displayed and ordered and any react you or remove will affect that live without refresh.
-You can comment using text, emojis and also pictures also comments will be ordered and always updating directly after submit.
-you can save/unsave post, download post images, delete post...
-We will have all sort of validation for file upload for size and type.
-You will learn how to crop, zoom, rotate, flip images using crooper.
-You can update your cover picture using old cover pictures or a new image with the option to crop zoom and select the part of image you want to use and after submit directly it will create a post that says user updated his/her cover picture.
-You can update your profile picture using old cover pictures or a new image with the option to crop zoom and select the part of image you want to use and after submit directly it will create a post that says user updated his/her profile picture and you can also use text and emojis.
-Every user have its own profile, where all details displayed from cover, profile picture , details (othername, bio, job, workplace, relationship...), photos, friends, posts
-You can update all your details and see changes live directly.
-We will use Cloudinary to upload our images in a new creative way, you will be impressed.
-We have a full friendship system whe you can add friend, cancel request, accept request, delete request, unfriend, follow, unfollow
-Also we have a friends page where you can mage all your requests and friends.
-We have live search functionality as you type new results appear, also any user you click will be added to your search history and it's also will be displayed in order by the latest clicked on.
-We will use skeleton loaders while page loads or while we get data from backend and also using all different kind of loaders across our app.
-We will have protected routes.
-We will use react redux store to setup a global store to share data across all components.
-We will use react router dom v6 explained in details.
-We will work with cookies and JSON web tokens to store data temporarily.
-we will use many react js functions like useState, useEffect, useReducer, useRef, useCallback, event listeners and also create custom hooks.

icon
Udemy Discount

The discount is applied through our link. Open the course from here and Udemy's current promotional price is applied at checkout on most courses, no code to type.

Some courses are excluded from Udemy's promotions. If the price does not drop, clear your browser cookies and use the button again.

icon
Instructor Details

Mohamed Hajji

Hello, I’m Mohamed Hajji!

I’m a passionate full-stack web developer with expertise in both frontend and backend development. Over the years, I’ve built countless applications using a variety of cutting-edge technologies, honing my skills to deliver scalable, efficient, and user-friendly solutions.

I understand the challenges of starting out in web development, especially in today’s rapidly evolving tech landscape. That’s why I’m here—to share my knowledge and help developers of all levels, especially beginners, navigate this exciting journey with confidence.

My goal as an instructor is simple: to empower you to build real-world, impactful projects while mastering the technologies that matter. Through my courses, you’ll gain the skills, insights, and hands-on experience needed to stand out as a developer in this competitive field.

Let’s embark on this learning journey together and take your skills to the next level. See you in class!

icon
More courses by Mohamed Hajji

$69.99

$10.99

icon
More Web Development courses

$19.99

$89.99

$89.99

$79.99

$10.99

$84.99

icon
Reviews

4.4

546 ratings on Udemy

Select a bar to show only those reviews.Select the bar again to show every rating.

By Adrian Delfin on 8/17/2023

Very good course that teaches you alot of knowledge in frontend and backend development. Introduces you to a lot of technologies and tools to create a social media app. This stuff alone makes this a 5 star already, however I do have to note some criticism. There are alot of features included in the demo such as the stories posting, and the videocalling and direct messaging features. It is said that that may be added in the future. There are also UI/UX features added to the project that dont necessarily have the functionalities that they should have. Keep these in mind if you are thinking of getting the course. With this said, in my opinion, this is still a very good course to get as a beginner or intermediate developer, looking for some practice and guidance.

By Minh Nguyen on 6/23/2023

PROS: I think this course covers everything you need to set up a facebook- fullstack, informative and has all the code you need. CONS: firstly, the way he shows the video is awful, really small screen, if you are on your computer and you want to code it in the same time with the video, it's impossible, same with your smartphone, you can't see the code clearly. He promised he will create another Zoom-in video for every videos but after the 1st and 2nd sections, he stopped. Secondly, I saw a lot of new questions were asked in the course but this guy doesn't even reply. Last but not least, his English is not so good, it's difficult the hear what's he talking.

By Muhammad Umer Pall on 5/1/2023

Overall, while the font size in the video lectures was a frustration, I would still recommend this online course to anyone interested in developing social media web applications. The content and instruction provided are valuable, and with a bit of extra effort to read the text, it's a great course for beginners and experienced developers alike.

By Raviranjan Mahto on 3/10/2023

1. Font is too small very annoying, I decided to give 1 star due to font only but I also learn many things so I gave 3 but if font is better then I will gave 4 star to this course. 2. So much repetition. 3. Sometimes simply copy pasting. 4. If somebody stuck, no one can help, I asked 1 question almost 26 days over but not a single reply. 5. No deployment

By Luis Quiros on 11/20/2022

It was an excellent course only reason why I'm not giving the 5 star it's because there some chapters where the addded resources where not updated or added but is not a big issue honestly. Excellent course and fully recommend for anyone looking to learn React from scratch and create a great backend with NodeJs and Express

By Gorank Joshi on 10/24/2022

Basically as a beginner you need to be very very logical to understand else you have to google things understand there and comeback to continue. However, its not the tutor's fault as this is a competitive world and you can't evaluate the mental level of every person taking the course.

By Jamal Sheriff on 6/8/2022

On Udemy, I completed around five courses. If you take your time to learn, this is one of the best courses ever, he explains pretty much everything he does in the video which surprises me (Not many instructors do this while building a full stack app). It's obvious that he is passionate about what he does. You can turn this project into your own if you want to . From CSS alone already learn a ton from doing this course. If the text is too small just zoom in yourself

By Saifullah Hosari on 6/2/2022

this course is amazing! Mohamed is amazing ! he is teaching in a professional way with a big heart and great knowledge and he never lets any topic goes without a great explanation ! i would buy any course Mohamed creates without thinking! thank u and god bless u for being an honest teacher.

By Gunjan on 5/31/2022

Very advanced course. though it is difficult for beginners to understand it in a glance. it's not a beginner friendly course indeed. It takes time to complete this course to fully understand how things actually work. you need to read docs and understand yourself and this kind of knowledge in such a short length course cannot be beginner friendly.

By Abdulbasit Hussain on 5/28/2022

One of the best and most detailed course on the MERN stack. you learn a lot of new things, the code is clean, production ready. If you want to become a professional mern developer and want to build fantastic apps then this the best course on udemy by far. the app is built with every single detail in mind.

Showing all 10 reviews on CourseDuck

Read all 546 reviews on Udemy

icon
Quality Score

No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.

Content Quality
/
Video Quality
/
Qualified Instructor
/
Course Pace
/
Course Depth & Coverage
/

Overall Score : 88 / 100