📝 New Blog App

A full-stack blog application built with React + Vite on the frontend and Node.js + Express + MongoDB on the backend.

---

🗂️ Project Structure

New-Blog-app/
├── client/          # React frontend (Vite)
│   ├── src/
│   │   ├── components/
│   │   │   ├── Navbar.jsx
│   │   │   ├── Footer.jsx
│   │   │   ├── HeroSection.jsx
│   │   │   ├── BlogCard.jsx
│   │   │   └── BlogList.jsx
│   │   ├── pages/
│   │   │   └── Home.jsx
│   │   ├── context/
│   │   ├── App.jsx
│   │   └── main.jsx
│   └── public/
└── server/          # Express + MongoDB backend

---

🚀 Tech Stack

Frontend

Tool	Purpose
React 18	UI library
Vite	Build tool & dev server
React Router DOM	Client-side routing
Tailwind CSS	Utility-first styling
ESLint	Code linting

Backend

Tool	Purpose
Node.js + Express 5	REST API server
Mongoose	MongoDB ODM
CORS	Cross-origin request handling
dotenv	Environment variable management
nodemon	Dev auto-restart

---

⚙️ Getting Started

Prerequisites

• Node.js >= 18
• MongoDB (local or MongoDB Atlas)

---

1. Clone the repository

git clone https://github.com/AadityaBansal01/New-Blog-app.git
cd New-Blog-app

---

2. Set up the Server

cd server
npm install

Create a .env file in the server/ directory:

PORT=5000
MONGO_URI=your_mongodb_connection_string

Start the server:

# Development (with nodemon)
npm run dev

# Production
npm start

Server runs at http://localhost:5000

---

3. Set up the Client

cd client
npm install

Create a .env file in the client/ directory if needed:

VITE_API_URL=http://localhost:5000

Start the dev server:

npm run dev

Client runs at http://localhost:5173

---

📦 Available Scripts

Client (/client)

Script	Description
npm run dev	Start Vite dev server
npm run build	Build for production
npm run preview	Preview production build
npm run lint	Run ESLint

Server (/server)

Script	Description
npm run dev	Start with nodemon
npm start	Start without nodemon

---

🌐 Features

• Browse blog posts on the home page
• Responsive layout with Navbar and Footer
• Hero section for featured content
• Blog card grid with list view
• REST API backend with MongoDB persistence

---

🤝 Contributing

1. Fork the repository
2. Create a feature branch: git checkout -b feature/your-feature
3. Commit your changes: git commit -m 'Add your feature'
4. Push to the branch: git push origin feature/your-feature
5. Open a Pull Request

---

📄 License

This project is open source. See LICENSE for details.

---

Built by Aaditya Bansal