MargDarshak – AI-Powered Tech Blogging Platform

MargDarshak is a full-stack AI-powered blogging platform that allows users to create, edit, and publish blog posts. It includes content generation powered by AI, a WYSIWYG editor (Quill), comment management with moderation, and admin-only dashboard functionalities.

---

Live Deployment

• The Client side is deployed on Vercel. Live Demo
• Note:- the Server is running on Render , and may take some time to wakeup.Server

---

Tech Stack

Frontend

• React.js
• React Router DOM
• Tailwind CSS
• Quill.js (WYSIWYG Editor)
• Axios
• React Hot Toast
• Vercel (deployment)

Backend

• Node.js
• Express.js
• MongoDB + Mongoose
• Gemini API
• Multer (for file uploads)
• CORS, Dotenv
• Render (deployment)

---

Project Structure

root/
├── client/              # React frontend (AI-Lekhakh UI)
├── server/              # Node.js + Express backend (API, DB, AI integration)
├── README.md            # Project-level README (this file)

---

Features

Frontend

• Blog creation with title, subtitle, category, description, and thumbnail.
• AI-based blog content generation using Gemini/OpenAI.
• Live blog editing with Quill.js editor.
• Dynamic blog category selection.
• Publish/unpublish option.
• Responsive, user-friendly UI with Tailwind CSS.
• View, comment, and read blogs.
• Comment submission and approval system.

Backend

• RESTful APIs for blogs, users, comments, categories.
• AI content generation API (/api/admin/generate) from a blog title.
• Blog image upload handling via Multer.
• Comment moderation system (isApproved flag).
• MongoDB schema design for Blog, Comment, etc.
• Error handling and JSON responses.
• Production-ready deployment setup.

---

Detailed Information on Client and Server

• For Detailed Info , visit their respective README.md files. It contains all the information about the folder structure, installation and deployment.

---

Setup Instructions

Backend

cd server
npm install
npm run dev

Frontend

cd client
npm install
npm run dev

The frontend is configured to interact with backend APIs on http://localhost:3000.

---

🔐 Admin Features

• Admin-only access to /api/admin/generate for AI content.
• Admin manually approves comments before they're displayed.
• AI generation is only triggered via the Generate with AI button in the blog editor.

---

---

Inspiration

This project was built to explore the power of AI in real-world content generation while learning full-stack deployment, secure API practices, and end-to-end CRUD operations.

---

Contributions

Feel free to fork, clone, and build on this project. PRs and issues are welcome!

---

License

This project is open-source and licensed under the MIT License.