📝 MERN Stack Blog Platform

A full-featured blogging application built using the MERN (MongoDB, Express.js, React.js, Node.js) stack. Users can create, edit, and delete blog posts, register and log in, and read articles from others.

🌐 Live Demo

Live Website – Explore the blog, read posts, and try out the features.

✨ Features

✅ User Authentication (JWT-based) ✅ Create, Read, Update, Delete (CRUD) blog posts ✅ Rich text editing with image support ✅ Responsive design ✅ Author-specific dashboard ✅ Protected routes and session management ✅ MongoDB for flexible post storage ✅ RESTful API with error handling

🛠️ Tech Stack

🧠 Backend

• Node.js + Express.js
• MongoDB + Mongoose
• JWT Authentication
• bcrypt for password hashing

🎨 Frontend

• React.js
• Tailwind CSS or CSS Modules
• Axios for API requests
• React Router for page navigation
• React Hook Form or Formik for handling forms
• Lexical for rich text editor

📸 Screenshots

🏠 Home Page

📝 Blog Editor

🔐 Login

🧪 Getting Started

Prerequisites

• Node.js and npm/yarn installed
• MongoDB running locally or MongoDB Atlas URL

⚙️ Installation

1. Clone the repository

https://github.com/rahat728/blog.git

2. Backend Setup

cd backend
npm install

Create a .env file in backend/:

PORT=5000
MONGO_URI=your_mongodb_connection_string
JWT_SECRET=your_secret_key
CLOUDINARY_CLOUD_NAME=name
CLOUDINARY_API_KEY=api_key
CLOUDINARY_API_SECRET=api_secret

Start backend server:

npm run dev

3. Frontend Setup

cd ./client
npm install

Create a .env file in frontend/:

VITE_API_URL=http://localhost:5000

Start frontend server:

npm run dev

📁 Folder Structure

blog/
├── backend/
│   ├── models/
│   └── index.js
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── pages/
│   │   ├── api/
│   │   ├── App.jsx
│   │   └── main.jsx
├── .env
└── README.md

🔐 Authentication

• Users are authenticated using JWT tokens
• Protected routes on both client and server
• Tokens stored in HTTP-only cookies

🚀 Deployment

Frontend:

• Render

Backend:

• Render

🙋‍♂️ Author

• Name: Asifuzzaman Rahat
• Email: [email protected]
• LinkedIn: mdrahat728
• GitHub: github