📝 BuildNotes - MERN Blog Application

A Modern Full-Stack Blogging Platform

A feature-rich blog application built with MongoDB, Express.js, React, and Node.js

Features • Demo • Installation • Tech Stack • Contributing

---

✨ New Features (Latest Update)

🎉 Four Major Features Added!

Feature	Description
📝 Blog Post Summaries	Auto-generated summaries for blog posts displayed in previews
🏆 Author Badges System	Gamification badges that reward authors for achievements (FIXED: Now awards properly!)
🎯 Milestones System	Track long-term progress with 20+ milestones
👑 Admin Dashboard	Complete admin panel to manage users, roles, and view statistics

---

📋 Prerequisites

Before you begin, ensure you have the following installed:

• Node.js (v14 or higher)
• MongoDB (local or Atlas account)
• Cloudinary account (for image uploads)

---

🚀 Installation

1️⃣ Clone the repository

git clone https://github.com/yourusername/MERN-Blog.git
cd MERN-Blog

2️⃣ Backend Setup

cd backend
npm install

Create a .env file in the backend directory:

PORT=5000
MONGO_URI=your_mongodb_connection_string
SECRET_KEY=your_jwt_secret_key
CLOUDINARY_CLOUD_NAME=your_cloudinary_cloud_name
CLOUDINARY_API_KEY=your_cloudinary_api_key
CLOUDINARY_API_SECRET=your_cloudinary_api_secret
FRONTEND_URL=http://localhost:5173

3️⃣ Frontend Setup

cd ../frontend
npm install

Create a .env file in the frontend directory:

VITE_API_URL=http://localhost:5000/api

---

🏃 Running the Application

Start Backend Server

cd backend
npm start

Backend will run on http://localhost:5000

Start Frontend Development Server

cd frontend
npm run dev

Frontend will run on http://localhost:5173

---

🔐 Environment Variables Explanation

Backend Environment Variables

Variable	Description
PORT	Port number for backend server
MONGO_URI	MongoDB connection string
SECRET_KEY	Secret key for JWT token generation
CLOUDINARY_CLOUD_NAME	Your Cloudinary cloud name
CLOUDINARY_API_KEY	Your Cloudinary API key
CLOUDINARY_API_SECRET	Your Cloudinary API secret
FRONTEND_URL	Frontend URL for CORS configuration

Frontend Environment Variables

Variable	Description
VITE_API_URL	Backend API base URL

---

🎮 Initialize New Features (One-Time Setup)

After starting both servers:

1. Visit http://localhost:5173/setup
2. Click "Initialize All" button
3. Wait for success confirmation ✅
4. Navigate to /dashboard/achievements to see badges and milestones

---

🎯 Features

🌟 Core Features

• ✅ User authentication (register/login)
• ✅ Create, edit, delete blog posts
• ✅ Publish/unpublish blogs
• ✅ Comment on blogs
• ✅ Like blogs and comments
• ✅ User profiles with social links
• ✅ Image uploads via Cloudinary

🆕 Advanced Features

• 📝 Auto-generated blog summaries - Concise previews on blog cards
• 🏆 Author badges system - 8 achievement badges (First Post, Trending, Top Rated, etc.) ✅ Fixed awarding!
• 🎯 Milestones tracking - 20+ milestones across 5 categories
• 👁️ View tracking - Track total and unique blog views
• 📊 Author statistics - Automatic tracking of blogs, views, likes, comments
• 📈 Progress visualization - Progress bars and completion indicators
• 🎮 Gamification dashboard - Unified view of achievements

👑 Admin Features

• 🔧 Make Admin - Promote any user to admin role
• ⬇️ Remove Admin - Demote admin back to user
• 👥 View All Users - Complete user list with blog/comment statistics
• 📊 Dashboard Stats - Real-time platform metrics
• 🔒 Protected Routes - Admin-only access control
• ⚡ Easy Setup - Simple script to make first admin:

  node backend/makeAdmin.js your-email@gmail.com

---

🛠️ Tech Stack

Frontend

Backend

Tools & Services

📦 Complete Tech Stack

Frontend:

• React - UI library
• Redux Toolkit - State management
• Vite - Build tool
• Radix UI - Component library
• TailwindCSS - Styling
• Lucide React Icons - Icons

Backend:

• Node.js - Runtime environment
• Express - Web framework
• MongoDB & Mongoose - Database
• JWT Authentication - Security
• Cloudinary - Image storage
• Bcrypt - Password hashing

---

🏆 Badge System

Unlock Amazing Achievements! 🎉

Authors can earn these badges:

Badge	Name	Requirement
🏅	First Post	Publish your first blog
🔥	Trending Author	Get 100+ views
🚀	Viral Creator	Get 1000+ views
✍️	Consistent Writer	Maintain a 4-week streak
📝	Dedicated Writer	Maintain a 12-week streak
⭐	Top Rated	Receive 50 total likes
🌟	Highly Acclaimed	Receive 200 total likes
🧠	Expert Contributor	Publish 10 posts in one category

---

🎯 Milestone Categories

Track Your Progress Across Multiple Categories! 📊

Category	Milestones
📌 Blogs Published	10, 20, 50, 100 posts
👁️ Total Views	100, 500, 1K, 10K, 100K views
💬 Comments Received	10, 50, 100, 500 comments
📅 Active Time	1, 3, 6, 12 months
🌍 Global Reach	10, 50, 100, 500 unique readers

---

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

How to Contribute

1. Fork the repository

   git clone https://github.com/Saurabhtbj1201/BuildNotes.git

2. Create your feature branch

   git checkout -b feature/AmazingFeature

3. Commit your changes

   git commit -m 'Add some AmazingFeature'

4. Push to the branch

   git push origin feature/AmazingFeature

5. Open a Pull Request

---

📝 License

This project is open source and available under the MIT License.

---

👨‍💻 About Me

Hi! I'm Saurabh Kumar 👋

A passionate developer focused on automation, AI, and building scalable solutions for real-world problems.

This project represents my commitment to leveraging modern technologies to streamline e-commerce operations and enhance customer experiences.

💼 Skills

Full-Stack Development • MERN Stack • API Integration • Cloud Services • UI/UX Design • Database Management • DevOps • AI & Automation

---

© Made with ❤️ by Saurabh Kumar. All Rights Reserved 2025

Saurabh Kumar

🔗 Connect With Me

---

Made with ❤️ by Saurabh Kumar
⭐ Star this repo if you find it helpful!