https://github.com/thefznkhan/nextblog
A sleek, production-ready blogging platform built with Next.js 14, MongoDB Atlas, Tailwind CSS, and React-Quill.
https://github.com/thefznkhan/nextblog
admin-dashboard auth blog-platform crud full-stack javascript mongodb nextauth nextjs prettier radix-ui react-quill rich-text-editor seo shadcn-ui tailwindcss vercel
Last synced: 2 months ago
JSON representation
A sleek, production-ready blogging platform built with Next.js 14, MongoDB Atlas, Tailwind CSS, and React-Quill.
- Host: GitHub
- URL: https://github.com/thefznkhan/nextblog
- Owner: THEFZNKHAN
- Created: 2025-07-07T18:09:35.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-07T20:20:27.000Z (12 months ago)
- Last Synced: 2025-07-07T20:58:30.966Z (12 months ago)
- Topics: admin-dashboard, auth, blog-platform, crud, full-stack, javascript, mongodb, nextauth, nextjs, prettier, radix-ui, react-quill, rich-text-editor, seo, shadcn-ui, tailwindcss, vercel
- Language: JavaScript
- Homepage:
- Size: 1.13 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🚀 NextBlog — Modern Blog Platform
A clean, modern, and responsive blogging platform.
Built with Next.js 14, MongoDB Atlas, Tailwind CSS, and React-Quill.
---
## 🏠 Home Page
---
## 🛡️ Admin Dashboard
---
## 📝 Create Post
---
## 🔑 Admin Login
---
## 🔐 Quick Admin Access
> **Test Admin Account:**
> **Email:** `admin@mail.com`
> **Password:** `admin@123`
---
## ✨ Features
- **🖼️ Beautiful UI:** Glassmorphism, smooth animations, mobile-first
- **🔐 Secure Admin Auth:** NextAuth.js + bcrypt, JWT sessions
- **✍️ Rich Content:** WYSIWYG editor, SEO-friendly slugs
- **🗂️ Full CRUD:** Publish, update, delete posts (admin)
- **⚡ SEO & Performance:** SSR, image optimization, dynamic meta tags
- **👨💻 Dev Experience:** TypeScript, clean architecture, error handling
---
## 🚀 Quick Start
Show Setup Instructions
### Prerequisites
- **Node.js** v18+
- **MongoDB Atlas** (free-tier)
- **Git**
### 1. Clone & Install
```bash
git clone https://github.com/thefznkhan/nextblog.git
cd nextblog
npm install
```
### 2. Configure Environment
Create `.env.local`:
```env
MONGODB_URI=your-mongodb-connection-string
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=your-32-byte-secret
NEXT_PUBLIC_BASE_URL=http://localhost:3000
```
### 3. Start Development
```bash
npm run dev
```
Visit [http://localhost:3000](http://localhost:3000)
---
## 🧩 Tech Stack
| Tool | Purpose |
| ---------------- | -------------------------- |
| **Next.js 14** | Full-stack React framework |
| **React 18** | Frontend library |
| **MongoDB** | Cloud database |
| **Mongoose** | MongoDB ODM |
| **NextAuth.js** | Authentication |
| **React-Quill** | Rich text editing |
| **Tailwind CSS** | Styling |
| **bcryptjs** | Password hashing |
---
## 📚 API Overview
Show API Endpoints
### Posts
- `GET /api/posts` — List all posts
- `POST /api/posts` — Create post (admin)
- `GET /api/posts/[slug]` — Get single post
- `PUT /api/posts/[slug]` — Update post (admin)
- `DELETE /api/posts/[slug]` — Delete post (admin)
### Admin
- `GET /api/admin/setup` — Check if admin exists
- `POST /api/admin/setup` — Create initial admin
---
## 🛠️ Configuration Tips
- **MongoDB:** Whitelist your IP in Atlas
- **NEXTAUTH_SECRET:** Must be consistent for sessions
- **Tailwind:** Customize in `tailwind.config.js`
---
## 🆘 Troubleshooting
- **MongoDB connection error:** Check `.env.local`, whitelist IP
- **NextAuth JWT errors:** Ensure `NEXTAUTH_SECRET` is set, clear cookies
- **Tailwind issues:** Run `rm -rf .next` and restart
---
## 🤝 Contribution Guide
1. **Fork** the repo
2. **Branch:** `git checkout -b feat/your-feature`
3. **Develop & Test**
4. **Lint/Test:** `npm run lint && npm test`
5. **Pull Request**
---
## 📝 License & Credits
This project is **MIT licensed** — see [LICENSE](LICENSE).
Thanks to the Next.js, MongoDB, Tailwind CSS, and React-Quill communities!
---
Made with ❤️ by THEFZNKHAN.
If you enjoy this project, please ⭐ star on GitHub!