interview-kit-web

Interview prep scaffolding for web developers — two full projects + 14 copy-paste code templates.

What's inside

interview-kit-web/
├── frontend/       React + Vite + react-router-dom v6 + pure CSS
├── fullstack/
│   ├── client/     React + Vite (axios, 3 pages, Vite proxy)
│   └── server/     Express + Open Library API + JSONPlaceholder
└── templates/      14 ready-to-use interview code snippets

Usage

npm install interview-kit-web

Then find everything inside node_modules/interview-kit-web/. Copy the folder you need:

# Copy to your workspace
cp -r node_modules/interview-kit-web/frontend ./my-frontend
cp -r node_modules/interview-kit-web/fullstack ./my-fullstack
cp -r node_modules/interview-kit-web/templates ./snippets

Run the frontend

cd my-frontend
npm install
npm run dev
# → http://localhost:5173

Run the fullstack app

# Terminal 1 — Express server
cd my-fullstack/server
npm install
cp .env.example .env
npm run dev
# → http://localhost:5000

# Terminal 2 — Vite client
cd my-fullstack/client
npm install
npm run dev
# → http://localhost:5173 (proxied to :5000)

Projects

frontend/

• 2 pages: Home (posts from JSONPlaceholder) + About (skills grid, timeline)
• react-router-dom v6 with NavLink active states
• Pure CSS design system (CSS variables, dark theme, responsive)

fullstack/

• 3 client pages: Home, Search Books, Book Detail
• 4 Express routes: GET /api/books, GET /api/books/:id, GET /api/posts, POST /api/posts
• External APIs: Open Library + JSONPlaceholder (no API keys)
• Vite proxy config for seamless local dev

templates/

See templates/README.md for the full list.

License

MIT