ProblemRank

A small web app where people can browse and rank real business problems (instead of jumping straight to "build a solution"). Built with Next.js, Tailwind, and Prisma + Postgres.

---

Tech stack

• Next.js 16 (App Router) — pages live in app/
• React 19 + TypeScript
• Tailwind CSS v4 — styles via app/globals.css, no separate config file (v4 uses @theme in CSS)
• Prisma 7 + Postgres — schema in prisma/schema.prisma, client generated to app/generated/prisma
• lucide-react — icons

Project structure

app/
  api/             # route handlers
  page.tsx          # homepage
  auth.ts            # handles next-auth
  layout.tsx        # root layout (fonts, analytics)
  globals.css        # Tailwind theme + global styles
lib/
  prisma.ts         # Prisma client singleton
components/          # UI pieces (Navbar, HeroBanner, ProblemRow, CategoryCard, ...)
prisma/
  schema.prisma      # database models (User, Post, Problem, Category, Tag)
  seed.ts            # seeds prisma db
public/              # icons imgs
types/
  index.ts          # types and interfaces

---

Getting started

1. Clone the repo

git clone https://github.com/pushAbhi/ProblemRank
cd problemrank

2. Install dependencies

npm install

3. Set up your database and keys

Create a .env file in the root Fill in the keys (DATABASE_URL + others).

4. Generate the Prisma client and push the schema

npx prisma generate
npx prisma migrate dev

5. Run the dev server

npm run dev

Open http://localhost:3000.

---