This project is a full-stack social media web application 🌐 that has been developed using the MERN stack 🖥️ and Rest API 🚀, In this social media platform where you can share posts, like/unlike posts, Follow/Unfollow users and more.
Deployed link : https://social-media-app-cbw8.onrender.com
- Register and Login users
- Posts
- Create Post : Posts include text(caption) and image
- Delete Posts
- Like/Unlike Post
- Comment to a Post
- View all comments on a post
- Realtime Messaging
- Dark and Light Mode
- Chat App With Image Support
- Seen/Unseen Status for Messages
- Notification sounds
- Search for Chat
- user suggestions menu
- Profile Pages
- Change profile picture
- Change Name, email , password
- Follow/Unfollow Users
- Freeze Your Account
- Add your own bio
- profile page shows user details and posts with following and followers menu
- password is stored in database in encrypted format with salt
- Dark Mode Support in Chat Page
This project was created using the following technologies.
- React js - JavaScript library that is used for building user interfaces specifically for single-page applications
- React Hooks - For managing and centralizing application state
- react-router-dom - To handle routing
- axios - For making Api calls
- Css - For User Interface
- Node js -A runtime environment to help build fast server applications using JS
- Express js -The server for handling and routing HTTP requests
- cors - Provides a Connect/Express middleware
- Dotenv - Zero Dependency module that loads environment variables
- Mongoose - For modeling and mapping MongoDB data to JavaScript
- Nodemon - an auto-refresh the server on code change
- jsonwebtoken - For authentication
- Bcryptjs - For data encryption
- concurrently - allow coders to run multiple scripts with one command
- cloudinary - Cloudinary is an end-to-end image- and video-management solution for websites and mobile apps, covering everything from image and video uploads, storage, manipulations, optimizations to delivery
- cookie-parser - The cookie-parser middleware simplifies the process of parsing and managing cookies in ExpressJS applications, providing developers with convenient access to client-side cookies for various purposes, including session management and security
- socket.io - Socket.IO enables real-time bidirectional event-based communication
- MongoDB - It provides a free cloud service to store MongoDB collections.
PORT=...
MONGO_URI=...
JWT_SECRET=...
CLOUDINARY_CLOUD_NAME=...
CLOUDINARY_API_KEY=...
CLOUDINARY_API_SECRET=...
Install dependencies for server
npm install
Install dependencies for client
cd client
npm install
Run the client & server with concurrently
npm run dev
Run the Express server only
npm run server
Run the React client only
npm run client
Server runs on http://localhost:5000 and client on http://localhost:3000
