Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

16 Commits
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ§‘β€πŸ’Ό LinkedIn Clone – Full Stack Social Media App

A modern LinkedIn-style social media platform built with React + TypeScript + Node.js + MongoDB, where users can sign up, log in, create posts (with text or images), like, comment, and view posts from all users β€” in real time.

🌐 Live Demo

πŸ–₯️ Frontend (Vercel): https://linkedclone-mu.vercel.app

βš™οΈ Backend (Render): https://linkedclone-a9n0.onrender.com

πŸ’Ύ GitHub Repository: https://github.com/ankittrip/linkedclone

πŸš€ Tech Stack πŸ–₯️ Frontend (React + TypeScript)

React 19 (Vite)

TypeScript

Tailwind CSS

React Router DOM

Axios

Socket.io Client

Lucide React Icons

Date-fns

βš™οΈ Backend (Node.js + Express)

Node.js + Express.js

MongoDB + Mongoose

JWT Authentication

Multer (File Upload)

Cloudinary (Image Storage)

Socket.io (Real-time communication)

CORS, Morgan, Dotenv

✨ Key Features

βœ… Secure User Signup & Login (JWT Authentication) βœ… Create, Edit & Delete Posts βœ… Upload Images with Posts (via Cloudinary) βœ… Like & Comment on Posts βœ… Real-Time Updates using Socket.io βœ… Responsive Modern UI using TailwindCSS βœ… Clean Folder Structure & Type-Safe Frontend (TypeScript)

πŸ“‚ Folder Structure linkedin-clone/ β”‚ β”œβ”€β”€ backend/ β”‚ β”œβ”€β”€ src/ β”‚ β”‚ β”œβ”€β”€ models/ β”‚ β”‚ β”‚ β”œβ”€β”€ user.model.js β”‚ β”‚ β”‚ └── post.model.js β”‚ β”‚ β”œβ”€β”€ routes/ β”‚ β”‚ β”œβ”€β”€ controllers/ β”‚ β”‚ β”œβ”€β”€ middlewares/ β”‚ β”‚ └── server.js β”‚ β”œβ”€β”€ .env β”‚ β”œβ”€β”€ package.json β”‚ └── frontend/ β”œβ”€β”€ src/ β”œβ”€β”€ public/ β”œβ”€β”€ tsconfig.json β”œβ”€β”€ package.json └── vite.config.ts

βš™οΈ Installation Guide πŸ”§ Backend Setup cd backend npm install

Create a .env file:

PORT=5000 MONGO_URI=your_mongodb_connection_string JWT_SECRET=your_jwt_secret CLOUDINARY_CLOUD_NAME=your_cloud_name CLOUDINARY_API_KEY=your_api_key CLOUDINARY_API_SECRET=your_api_secret

Run the backend server:

npm run dev

➑️ Backend runs at http://localhost:5000

πŸ’» Frontend Setup cd frontend npm install

Create a .env file:

VITE_API_URL=http://localhost:5000

Run the frontend app:

npm run dev

➑️ Frontend runs at http://localhost:5173

πŸ§ͺ API Endpoints Method Endpoint Description POST /api/auth/signup Register new user POST /api/auth/login Login existing user GET /api/posts Get all posts POST /api/posts Create new post PUT /api/posts/:id Edit post DELETE /api/posts/:id Delete post POST /api/posts/:id/like Like/Unlike post POST /api/posts/:id/comment Add comment

πŸ–ΌοΈ Screenshots

Login Page image

Feed Page image

Create Post image

profile page image

πŸš€ Deployment

Frontend: Deployed on Vercel

Backend: Deployed on Render

Database: Hosted on MongoDB Atlas

πŸ‘¨β€πŸ’» Author

Ankit Tripathi Full Stack Developer (MERN + TypeScript) πŸ“§ ankittripathi559@gmail.com

πŸ”— GitHub: https://github.com/ankittrip

🌍 Live Project: LinkedIn Clone App

πŸ“œ License

This project is licensed under the ISC License.

🚧 Future Enhancements

Add user connections (follow/friend system)

Add profile picture & bio section

Implement notifications & real-time comments

Improve UI animations and loading states

Releases

Packages

Contributors

Languages