System Architecture Overview¶

┌─────────────────────────────────────────────────┐
│           FRONTEND (React + Vite)               │
│        Deployed on Vercel (Static)              │
├─────────────────────────────────────────────────┤
│              API GATEWAY (CORS)                 │
├─────────────────────────────────────────────────┤
│         BACKEND (Node.js + Express)             │
│        Deployed on Render (Server)              │
├─────────────────────────────────────────────────┤
│          DATABASE (MongoDB Atlas)               │
│      Cloud-hosted MongoDB Cluster               │
└─────────────────────────────────────────────────┘

src/
├─ pages/         # Route pages
├─ components/    # Reusable UI components
├─ services/      # API integration
├─ context/       # Global state (Auth, Config)
└─ App.jsx        # Root component

backend/
├─ src/
│  ├─ controllers/    # Request handlers
│  ├─ models/         # Database schemas
│  ├─ routes/         # Route definitions
│  ├─ middleware/     # Auth, validation
│  └─ utils/          # Helper functions
└─ server.js          # Entry point

messwaladb/
├─ users           # User accounts
├─ expenses        # Expense records
├─ meals           # Menu items
├─ attendance      # Attendance records
├─ feedback        # Meal feedback
└─ messconfig      # Mess configuration

{
  _id: ObjectId,
  email: String (unique),
  password: String (hashed),
  fullName: String,
  collegeId: String,
  room: String,
  phone: String,
  role: String // "admin", "manager", "student"
  status: String // "approved", "pending", "rejected"
  googleId: String, // If Google OAuth
  createdAt: Date,
  updatedAt: Date
}

{
  _id: ObjectId,
  category: String,
  amount: Number,
  description: String,
  date: Date,
  recordedBy: ObjectId (ref: Users),
  createdAt: Date,
  updatedAt: Date
}

{
  _id: ObjectId,
  date: Date,
  mealType: String // "Breakfast", "Lunch", "Dinner"
  dishes: [String],
  notes: String,
  createdBy: ObjectId (ref: Users),
  createdAt: Date,
  updatedAt: Date
}

{
  _id: ObjectId,
  userId: ObjectId (ref: Users),
  date: Date,
  mealType: String,
  status: String // "present", "absent"
  markedAt: Date,
  createdAt: Date
}

{
  _id: ObjectId,
  userId: ObjectId (ref: Users),
  date: Date,
  mealType: String,
  rating: Number (1-5),
  comment: String,
  createdAt: Date,
  updatedAt: Date
}

{
  _id: ObjectId,
  messName: String,
  description: String,
  email: String,
  phone: String,
  expenseCategories: [String],
  mealTimes: [
    {
      name: String,
      startTime: String, // "HH:MM"
      endTime: String    // "HH:MM"
    }
  ],
  createdBy: ObjectId (ref: Users),
  createdAt: Date,
  updatedAt: Date
}

User Input (Email/Password)
    ↓
POST /auth/login
    ↓
Validate email exists
    ↓
Compare passwords (bcrypt)
    ↓
Generate JWT token
    ↓
Return token + user info
    ↓
Frontend stores in localStorage
    ↓
Use token in Authorization header

Manager Input (Expense form)
    ↓
POST /expenses with JWT token
    ↓
Verify user is Manager/Treasurer
    ↓
Validate expense data
    ↓
Insert into Expenses collection
    ↓
Return created expense
    ↓
Frontend updates list
    ↓
Student sees in Analytics → Fair share recalculated

Student marks attendance
    ↓
POST /attendance with JWT
    ↓
Verify user authenticated
    ↓
Check/insert into Attendance
    ↓
Calculate participation rate
    ↓
Trigger fair share recalculation
    ↓
Update Analytics cache (optional)

// Frontend loads this on app start
const config = await fetch('/api/auth/admin/config');
// {
//   messName: "Krishna Bhawan",
//   expenseCategories: ["Vegetables", "Rice", ...],
//   mealTimes: [...]
// }

// Used throughout frontend
<select>
  {config.expenseCategories.map(cat => (
    <option key={cat}>{cat}</option>
  ))}
</select>

const authMiddleware = (req, res, next) => {
  const token = req.headers.authorization?.split(' ')[1];

  if (!token) {
    return res.status(401).json({ error: 'No token' });
  }

  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (err) {
    res.status(401).json({ error: 'Invalid token' });
  }
};

const requireRole = (role) => {
  return (req, res, next) => {
    if (req.user.role !== role) {
      return res.status(403).json({ error: 'Forbidden' });
    }
    next();
  };
};

// Usage
router.post('/expenses', requireRole('manager'), createExpense);

1. Get all expenses for the month
2. Get all active members (attended ≥1 meal)
3. For each member:
   - Count meals attended (all types combined)
   - Share = (Total ÷ Active members) × (Member meals ÷ Total meals)
4. Display per member

// On analytics page request:
1. Fetch all expenses for period
2. Fetch all attendance for period
3. Fetch all feedback for period
4. Aggregate:
   - Sum by category
   - Average ratings
   - Attendance percentages
5. Return summarized data

Users
  ├─ has many Expenses (recordedBy)
  ├─ has many Meals (createdBy)
  ├─ has many Attendance records
  ├─ has many Feedback
  └─ has one MessConfig (createdBy - admin only)

Expenses
  └─ belongs to User (recordedBy)

Meals
  ├─ belongs to User (createdBy)
  └─ has many Attendance records (implicit)

Attendance
  ├─ belongs to User
  └─ references Meals (implicit via date/mealType)

Feedback
  ├─ belongs to User
  └─ references Meals (implicit via date/mealType)

MessConfig
  └─ belongs to Admin User (createdBy)

GitHub Repository
    ↓
Push to branch
    ↓
Vercel detects change
    ↓
Build: npm run build
    ↓
Deploy to CDN
    ↓
https://mess-walah.vercel.app (live)

GitHub Repository
    ↓
Push to branch
    ↓
Render detects change
    ↓
Build: npm install
    ↓
Start: node server.js
    ↓
https://messwala-6jvj.onrender.com (live)

MongoDB Atlas Cluster
    ↓
Network whitelist: 0.0.0.0/0
    ↓
Database user with R/W access
    ↓
Connection string: mongodb+srv://...
    ↓
Hourly backups (Atlas)

# Backend
cd backend
npm install
npm run dev          # Starts on port 5000

# Frontend
cd frontend
npm install
npm run dev          # Starts on port 5173

# Database
# Use MongoDB Atlas (cloud) or local MongoDB
MONGO_URI=mongodb://localhost:27017/messwala

Feature development on local
    ↓
Push to feature branch
    ↓
Create Pull Request
    ↓
Review & test
    ↓
Merge to main
    ↓
CI/CD deploys automatically