studyMeet

Full-stack online learning platform: course catalog, enrollment, payments, and role-based dashboards for students, instructors, and admins. The runnable application lives under E-Commerce/ (React client and Node API).

Architecture

High-level view of how the browser, API, and external services connect.

flowchart TB
  subgraph client [Presentation tier]
    SPA[React 18 SPA]
    RTK[Redux Toolkit]
    HTTP[Axios REST client]
    SPA --> RTK
    RTK --> HTTP
  end
  subgraph api [Application tier]
    EXP[Express.js]
    RTR[Route modules]
    CTL[Controllers]
    EXP --> RTR
    RTR --> CTL
  end
  subgraph data [Data and integrations]
    MDB[(MongoDB)]
    CLD[Cloudinary]
    RZP[Razorpay]
    SMTP[SMTP email e.g. SendGrid]
  end
  HTTP -->|"HTTPS /api/v1/*"| EXP
  CTL --> MDB
  CTL --> CLD
  CTL --> RZP
  CTL --> SMTP

Loading

Tech stack

Layer	Technologies
Frontend	React 18, React Router 6, Redux Toolkit, Tailwind CSS, Axios, react-hot-toast
Backend	Node.js 18, Express 4, Mongoose 7, JWT, cookie-parser, express-fileupload
Data	MongoDB (Atlas in production)
Media	Cloudinary
Payments	Razorpay
Email	Nodemailer over SMTP (e.g. SendGrid)

Repository layout

Study-Notion/
  E-Commerce/
    frontend/          # Create React App, Tailwind
    server/            # Express API, entry: index.js
    DEPLOYMENT.md      # Render + Vercel checklist
  render.yaml          # Render Blueprint when repo root is Study-Notion

Prerequisites

• Node.js 18 or newer and npm
• MongoDB connection string (local or Atlas)
• Cloudinary, Razorpay, and SMTP credentials if you use those features end-to-end

Local development

1. API server

cd E-Commerce/server
cp .env.example .env
# Edit .env: MONGODB_URL, JWT_SECRET, FRONTEND_URL, mail, Cloudinary, Razorpay, etc.
npm install
npm run dev

Default API port is 5000 unless PORT is set.

2. React client

cd E-Commerce/frontend
cp .env.example .env
# Set REACT_APP_BASE_URL to your API origin without trailing slash, e.g. http://localhost:5000
npm install
npm start

The client reads REACT_APP_BASE_URL; src/services/apis.js appends /api/v1 for all endpoints.

3. Optional OTP skip (local only)

In server/.env, never use in production:

SKIP_EMAIL_OTP=true

npm scripts

Location	Command	Purpose
E-Commerce/server	npm run dev	API with nodemon
E-Commerce/server	npm start	API with node (production-style)
E-Commerce/frontend	npm start	CRA dev server
E-Commerce/frontend	npm run build	Production static build

Deployment

Production-oriented steps (MongoDB Atlas, Render for API, Vercel for SPA) are documented in E-Commerce/DEPLOYMENT.md.

Summary:

• API (Render): root directory E-Commerce/server, build npm install, start npm start, set all server environment variables including FRONTEND_URL.
• SPA (Vercel): root directory E-Commerce/frontend, set REACT_APP_BASE_URL to the Render service URL (no /api/v1 suffix).

Root render.yaml is for Blueprint deploys when this repository’s root is Study-Notion. If you publish only the E-Commerce folder as its own repo, use E-Commerce/render.yaml instead.

Security notes

• Do not commit .env files. Use .env.example as a template only.
• Rotate API keys if they are ever exposed in chat, screenshots, or public repos.

License

See package metadata in E-Commerce/frontend/package.json and E-Commerce/server/package.json for authorship and license fields.