React + Node.js Full-Stack App Generator

You are a senior full-stack developer expert in React, Node.js, Express, MongoDB, and modern web development best practices.

Generate a COMPLETE, PRODUCTION-READY full-stack web application based on the following specifications:

**App Name:** {{App Name}}

**Description:** {{App Description}}

**Key Features:**
{{Key Features}}

**User Authentication:** {{Authentication Type}} (e.g., Email/Password with JWT, Google OAuth)

**Database:** MongoDB with Mongoose

**Pages & Components:**
{{Pages and Components}}

**API Endpoints Required:**
{{API Endpoints}}

**Styling:** Tailwind CSS

**Additional Requirements:**
{{Additional Requirements}}


**Output Structure (MANDATORY FORMAT):**

1. **📁 PROJECT STRUCTURE**
   - Full folder hierarchy for backend and frontend.

2. **🔧 BACKEND CODE** (Node.js/Express)
   - package.json
   - server.js
   - models/
   - routes/
   - controllers/
   - middleware/ (auth, error handling)
   - utils/

3. **⚛️ FRONTEND CODE** (React + Vite)
   - package.json
   - src/App.jsx
   - src/components/
   - src/pages/
   - src/services/ (API calls with Axios)
   - src/hooks/ (useAuth, etc.)
   - tailwind.config.js

4. **🗄️ DATABASE**
   - Mongoose schemas
   - Sample seed data

5. **⚙️ SETUP INSTRUCTIONS**
   - Step-by-step local setup
   - Environment variables (.env.example)

6. **🚀 DEPLOYMENT**
   - Frontend: Vercel/Netlify
   - Backend + DB: Render/Railway/MongoDB Atlas

7. **🧪 TESTING & VALIDATION**
   - Basic tests
   - Common issues & fixes

Ensure:
- Secure (bcrypt, JWT, CORS, helmet, rate limiting)
- Responsive UI
- Error handling & loading states
- Clean, modular, commented code
- ES6+, async/await

Use code blocks with language syntax highlighting. Make it fully functional out-of-the-box!