Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/aakash811/Student-Progress-Tracker/llms.txt

Use this file to discover all available pages before exploring further.

This guide walks you through running SkillSync on your local machine. By the end you’ll have a working backend API, a live frontend dev server, and at least one student whose Codeforces data has been synced.
Prerequisites — make sure you have the following before starting:
  • Node.js v18 or later (node --version to check)
  • MongoDB running locally, or a free MongoDB Atlas cluster
  • Git
  • A valid Codeforces handle to use as test data (your own, or a well-known handle)
1

Clone the repository

Clone the project from GitHub and navigate into the root folder:
git clone https://github.com/aakash811/Student-Progress-Tracker.git
cd Student-Progress-Tracker
2

Set up the backend

Move into the backend/ directory and create a .env file with the following variables:
cd backend

PORT=5000
MONGO_URI=mongodb+srv://<user>:<password>@cluster.mongodb.net/skillsync
UPSTASH_REDIS_REST_URL=https://<your-upstash-endpoint>.upstash.io
UPSTASH_REDIS_REST_TOKEN=<your-upstash-token>
BREVO_USER=<your-brevo-smtp-login>
BREVO_PASS=<your-brevo-smtp-password>
EMAIL_USER=alerts@yourdomain.com
CRON_SECRET=<any-long-random-string>
Install dependencies and start the development server:
npm install
npm run dev
The server starts on http://localhost:5000. You should see Server running on port 5000 in the terminal once MongoDB connects successfully.
3

Set up the frontend

Open a new terminal, navigate to the frontend/ directory, and create its .env file:
cd frontend

VITE_API_BASE_URL=http://localhost:5000
Install dependencies and start the Vite dev server:
npm install
npm run dev
The app is now available at http://localhost:5173.
4

Add your first student

Open http://localhost:5173 in your browser. You’ll land on the Students table page.
  1. Click the Add Student button in the top-right corner.
  2. Fill in the form:
    • Name — the student’s full name
    • Email — used for inactivity alert emails
    • Phone — contact phone number (required)
    • Codeforces Handle — the student’s Codeforces username
  3. Click Save. SkillSync immediately calls the Codeforces API to fetch the student’s profile, contest history, and recent submissions.
  4. Click the student’s row to open their personal analytics dashboard — you’ll see their current rating, submission heatmap, and contest rating chart populated with live data.
Never commit .env files to version control. Add backend/.env and frontend/.env to your .gitignore before making any commits.
Use a well-known Codeforces handle like tourist, Um_nik, or Petr when testing locally — these accounts have rich contest and submission histories that make the charts and heatmaps look great right away.

Build docs developers (and LLMs) love

Get started for freeTalk to us