Description
In this course, you will :
- Create a fully effective Advanced Social Media Facebook clone program, version 2022.
- Master react js, including all of its secrets and tricks, and become comfortable using it for frontend tasks.
- Create a robust, scalable backend with node.js and express.js.
- Learn how to operate with MongoDB, including how to add, edit, remove, and query like an expert.
- Learn how to utilize Cloudinary to store your photographs in a new and innovative way, as well as how to upload, search, filter, and gain a new perspective on working with Cloudinary.
- Create a solid authentication system that allows users to register, login, and reset passwords.
- Create a mailing system from scratch to send emails to users containing email verification links and password reset codes.
- Strong advanced form validation with Formik and Yup, as well as an overview of the best form validation strategies.
- Master working with dates on a new level, and discover how to correctly verify age by year, month, and day.
- Live data validation from the database to ensure that your data (such as username) is unique, and then develop a looping method to update it every time.
- Learn how to plan database requests for a given day or reputably, and we will use it to remove any unverified users after one month.
- Learn how to use JSON web tokens and cookies...
- Learn how to utilize React Redux Store to create a global store that is shared by all of our applications.
- Learn and master React router dom v6, and solve all of the problems that people have with it.
- Learn how to construct protected routes and secure your application's pages.
- Create a fully responsive application that works on all devices, and explore advanced responsiveness techniques.
- Learn how to professionally add dark mode to your application and include a switcher to toggle between light and dark modes.
- Learn how to use state, reducer, effect, ref, callback, and event listeners.
- Learn how to write reusable functions for tasks such as toggling, clicking outside, and switching...
- In this application, you will have a Home page with your menus and a list of postings from people you follow or are friends with, which you can scroll infinitely.
- Every user will have a profile page, just as the Facebook cover, profile image, data, photos, friends, posts.
- You can replace your cover with past covers you had or a new image using a cropper to crop, zoom in, and select the section of the image you desire.
- So basically, you will learn how to manipulate with photographs by cropping, zooming, flipping, and rotating.
- You may update your profile photo in the same way that you can choose, zoom, and trim your cover image.
- When you update your cover or profile picture, a post is instantly produced stating that the user has updated his or her profile/cover picture.
- You may compose a post with text, emoticons, background, and photographs in a well-organized manner, exactly like Facebook.
- You can react to a post using several reacts, unreact, alter your react, and watch all of the changes in real time.
- You can save and unsave a post, download its photos, and remove it.
- You can comment with text, emoticons, and images, and the additional comments will be sorted directly, as well as the display more comments functionality.
- You can add and change your details, such as othername, bio, employment, workplace, relationship, etc., and they will be accessible on your profile for everyone to see.
- We will feature a buddy system similar to Facebook, where you may add friends, cancel requests, follow/unfollow, accept/delete requests, and unfriend...
- You will have a friends page where you can see the friend requests you have, the friend requests you issued, and your list of friends as well.
- We have added a live search option, which allows you to search for other users and save them in your search history, which you can always remove.
Syllabus:
- Setup project
- Authentification and send emails (backend)
- Authentification frontend
- Header
- home
- Forgot ,reset password,activate account,logout
- Create Post,Cloudinary,emojis..etc
- Post component
- profile
- Friend Requests,send,cance,delete,accept,follow,unfollow
- Reacts
- Comments
- Post ||
- Live search,search history etc
- Friends-Requests page
- Dark Mode
- Skeleton loader effect (very cool)