A dark, gamified workspace for a small crew to track DSA progress together—XP, levels, streaks, and a live squad feed.
We’re a tight-knit group of friends who wanted one honest place to stay accountable on Data Structures & Algorithms—not another anonymous leaderboard, but something that felt like our arena.
So we built DSA Arena: a shared progress hub where we log solves by topic and difficulty, cheer each other on, and watch the squad move together. Five of us use it today, and we’re actively improving it with plans to grow the community and tie it into our Discord server for reminders, challenges, and richer social loops.
This project was built together by Satyam Singh and Mohd. Taiyab Jazim.
| Landing — pick your profile and jump in | Dashboard — overview, squad, and stats |
|---|---|
![]() |
![]() |
| Dashboard — weekly progress & squad activity | Tracker — log solves per topic (Easy / Medium / Hard) |
|---|---|
![]() |
| Leaderboard — XP, problems solved, or streak |
|---|
![]() |
- Squad-first landing — Choose your member from the group roster (admin accounts use an extra verification step).
- Dashboard — Streak, XP, level, today’s activity, The Squad strip, weekly chart, and Squad Activity feed.
- Tracker — Per-topic cards with counters for Easy / Medium / Hard; XP updates as you log progress.
- Leaderboard — Sort by XP, problems solved, or streak; highlights your row.
- Themes & layout — Dark/light mode and an app shell with sidebar navigation.
- Switch user — Admins can impersonate another squad member for support and testing (see API).
| Layer | Technology |
|---|---|
| Frontend | Next.js (App Router), React, TypeScript |
| Styling | Tailwind CSS, Radix UI primitives, Lucide icons |
| Backend | Next.js Route Handlers (app/api) |
| Database | PostgreSQL with Prisma |
| Auth | JWT in httpOnly cookies |
Note: The live deployment URL contains “rust” from an earlier naming choice; this repository is the Next.js + TypeScript app that ships today.
- Node.js 18+
- A PostgreSQL database (local or hosted)
git clone <your-repo-url>
cd DSA-Arena-main
npm installCopy the example file and set your database URL and secrets:
cp .env.example .envSee .env.example for required variables. For Prisma, DIRECT_URL is often the same as DATABASE_URL locally; some hosts (e.g. connection pooling) need a separate direct connection string.
npm run db:generate
npm run db:push
npm run db:seedThe seed script creates five squad users (matching the roster used on the landing page), starter badges, and join activities.
npm run devOpen http://localhost:3000.
npm run dev # Development server
npm run build # Production build
npm run start # Production server
npm run db:generate # Generate Prisma Client
npm run db:push # Push schema (dev)
npm run db:migrate # Migrations (when used)
npm run db:seed # Seed squad data
npm run db:studio # Prisma Studio- Deeper Discord integration (notifications, bot commands, optional role sync).
- Room for more learners beyond the founding squad while keeping the “small group energy.”
- Polish and hardening as usage grows.
MIT




