Pulse — Mini Social Media Platform

• Features
• Tech Stack
• Project Structure
• Database Design
• API Endpoints
• Getting Started
• Environment Variables
• Author

• Authentication: JWT stored in httpOnly cookies, bcrypt password hashing, login with email or username, session persists on refresh
• Image uploads: posts and avatars stored on Cloudinary (JPG/PNG/WEBP/GIF, max 2 MB)
• Notifications: alerts for likes, comments and new followers, with an unread badge
• Search: find people by name or username
• Who to follow: suggestions ranked by follower count
• Explore page: discover posts from everyone
• In-app confirmations: delete confirmations and status messages appear as notifications at the top of the screen (no browser pop-ups)
• Optimistic UI: likes and follows update instantly and roll back if the request fails
• Pagination: "Load more" on every post list
• Dark/light mode: follows system preference and remembers your choice
• Fully responsive: tested from 320px phones to 1920px monitors
  • Phones: top bar + bottom tab bar
  • Tablets & laptops: compact icon sidebar
  • Desktops: full sidebar + "Who to follow" panel
• Security: Helmet headers, CORS restricted to the frontend URL, rate limiting on auth routes, input validation, ownership checks on every edit/delete

CodeAlpha_SocialMediaPlatform/
├── backend/
│   ├── config/          # MongoDB connection, Cloudinary setup
│   ├── controllers/     # auth, users, posts, comments, notifications
│   ├── middleware/      # auth guard, file upload, validation, error handler
│   ├── models/          # User, Post, Comment, Notification
│   ├── routes/          # Express routers
│   ├── utils/           # JWT helper, async wrapper, seed script
│   └── server.js
│
└── frontend/
    ├── public/
    └── src/
        ├── api/         # Axios instance
        ├── components/  # PostCard, CreatePost, CommentSection, FollowButton, Layout, ...
        ├── context/     # AuthContext, ThemeContext
        ├── hooks/       # usePosts (pagination)
        ├── pages/       # Feed, Explore, Profile, EditProfile, PostDetail, Notifications, ...
        ├── utils/       # date formatting, confirmation toast
        ├── App.jsx
        └── main.jsx

Followers are stored as arrays of user IDs on both users, so follow/unfollow uses $addToSet / $pull. Deleting a post also removes its comments, related notifications and its Cloudinary image.

Base URL: /api · 🔒 = requires login

• Node.js 18 or newer
• A MongoDB Atlas cluster (free tier works)
• A Cloudinary account for image uploads (free tier works)

git clone https://github.com/devshaheerx/CodeAlpha_SocialMediaPlatform.git
cd CodeAlpha_SocialMediaPlatform

cd backend
npm install
cp .env.example .env     # then fill in your values
npm run seed             # optional: adds demo users and posts (clears existing data)
npm run dev              # runs on http://localhost:5000

cd frontend
npm install
cp .env.example .env     # VITE_API_URL=http://localhost:5000/api
npm run dev              # runs on http://localhost:5173

After running the seed script, log in with:

Username: demo
Password: password123

Syed Shaheer Ahmed: Full-Stack Developer (MERN)

LinkedIn · GitHub