Mern Stack Instagram Clone Using Mongo, Express, React, Node

Build Real-time Full Stack Instagram Clone with MERN Stack (Socketio, React.js, MongoDB, Nodejs, ExpressJS)

What you'll learn

Build Instagram clone project

Authentication and Authorization

Tailwind CSS

Admin Dashboard

Redux and Redux Toolkit

MongoDB

Connect MongoDB and Mongoose

Postman for API testing

Requirements

Familiarity with modern Javascript concepts and syntax

A basic understanding of the React ecosystem

Description

This course offers a complete, in-depth look at modern web development using the MERN stack. By the end, you'll have a fully functional Instagram clone and the skills to build and manage your own web projects. Plus, you'll gain insights into best practices for both frontend and backend development, making you a versatile and valuable developer in today's job market.Core Features Explained:Authentication & Authorization: Establish secure login mechanisms and manage user permissions effectively.Login: Integrate JWT token authentication process.Engagement Features: Engage your audience with likes, dislikes, follow/unfollow options, and a dynamic commenting system.Chat: Manage chats and message, categorize pages, and implement Socket Io for real-time like.Community Building: Use creator rankings to promote a competitive atmosphere and user dashboards for customized experiences.Deployment: We will Deploy Our App on Render.Security Features: Implement login and registrations functionality. Manage users & user roles.Who This Course Is For:Aspiring MERN Stack Developers: Ideal for those looking to master the MERN stack by developing a comprehensive blog project.Web Developers: Suitable for web developers aiming to advance their skill set with sophisticated features and functionalities within the MERN ecosystem.Tech Enthusiasts: Perfect for technology enthusiasts eager to explore the development of modern web applications with social features, content management, and monetization strategies.This course is meticulously crafted to guide you through building a feature-rich blog application, ensuring you gain hands-on experience with essential web development practices and technologies.

Overview

Section 1: Introduction

Lecture 1 Introduction

Section 2: Server Setup

Lecture 2 Environment and Tools

Lecture 3 Project Initialization

Lecture 4 Installing Packages

Lecture 5 Run an Express Server

Lecture 6 Use Environment Variables

Section 3: Database Setup

Lecture 7 Atlas Configuration

Lecture 8 Connect to the Database

Lecture 9 Create a Schema for User

Lecture 10 Create a Schema for Post

Lecture 11 Create a Schema for Comment

Lecture 12 Create Schema for Chat

Section 4: Controller: Creating User Controller and Logic in Express

Lecture 13 Controller for Registration

Lecture 14 Controller for Login

Lecture 15 Controller for Logout

Lecture 16 Controller for Getting the User Profile

Lecture 17 Controller for Editing the User Profile

Lecture 18 Controller for Suggested Users

Lecture 19 Controller for Follow or Unfollow Users

Lecture 20 Creating Routes for API

Lecture 21 Checking API's using Postman

Section 5: Controller: Creating Post Controller and Logic in Express

Lecture 22 Controller for Add New Post

Lecture 23 Controller to Get All Posts

Lecture 24 Controller to Get Individual User Posts

Lecture 25 Controller to Like and Dislike Posts

Lecture 26 Controller to Add Comment

Lecture 27 Controller to Get Comments

Lecture 28 Controller to Delete Post

Lecture 29 Controller to Bookmark Post

Section 6: Controller: Creating Message Controller for Chatting and Logic in Express

Lecture 30 Controller to Send Message

Lecture 31 Controller to Get Message

Section 7: Creating Routes for Message and Post

Lecture 32 Creating Routes for Message

Lecture 33 Creating Routes for Post

Section 8: Frontend Setup

Lecture 34 React 19, Vite, Shadcnui and Tailwindcss 4 setup

Lecture 35 Creating Signup Page

Lecture 36 Signup Page Functionality

Lecture 37 Creating Login Page

Lecture 38 Routing Pages (react-router-dom)

Lecture 39 Creating Sidebar

Lecture 40 Logout Functionality

Lecture 41 Building Posts Page

Lecture 42 Creating Single Post Page Part 1

Lecture 43 Creating Single Post Page Part 2

Lecture 44 Creating Comment Page Part 1

Lecture 45 Creating Comment Page Part 2

Section 9: Redux Toolkit

Lecture 46 Redux Installation

Lecture 47 Redux Persist

Lecture 48 Create Post Page

Lecture 49 Create Post Page Continue

Lecture 50 Post API Integration

Lecture 51 Creating Post Slice

Lecture 52 Creating Custom Hook to Get All Post

Lecture 53 Getting and Showing Post Data from the API using Redux

Section 10: Implement Delete/Like/Dislike/Comment

Lecture 54 Delete Post

Lecture 55 Like and Dislike Post

Lecture 56 Comment Functionality Part 1

Lecture 57 Comment Functionality Part 2

Lecture 58 Building Right Sidebar Header

Lecture 59 Suggested Users Component

Section 11: Building Profile Page & Follow/Unfollow

Lecture 60 Create Initial State for User Profile

Lecture 61 Create Custom Hook to Fetch User Profile

Lecture 62 Calling the function useGetUserProfile in Profile Page

Lecture 63 Styling Profile Picture

Lecture 64 Adding Other Options

Lecture 65 Adding Condition for Logged In User

Lecture 66 Showing Count for Posts, Followers and Following

Lecture 67 Showing Bio of User

Lecture 68 Adding Tabs for Posts, Saved and Tagged

Lecture 69 Display Posts

Web Developers interested in creating Full Stack Web Applications using MERN Stack