NYC's traffic cameras have always been public. NycGrid makes them worth exploring.
Browse cameras across all five boroughs on a live map, watch feeds in ambient mode, and take photobooth-style photos with real camera footage. Every feed is layered with live context — weather, transit alerts, bus arrivals, Citibike availability, and nearby events tied to each camera's location.
It's also a way to learn the city. Each camera links to the street, neighborhood, and infrastructure around it — bridges, tunnels, parks, parkways — with historical and cultural context surfaced alongside the live data. The name comes from the two things the app puts together: NYC's gridded streets and the gridlock that defines them.
Built with Next.js 16, React 19, and MapLibre GL.
-
Bun — this project uses Bun exclusively. If you don't have it yet:
npm install -g bun # the last npm command you'll ever needOr install directly:
curl -fsSL https://bun.sh/install | bashFull options: bun.com/docs/installation
# 1. Install dependencies
bun install
# 2. Copy env template and fill in your keys
cp .env.example .env.local
# 3. Start the dev server
bun devFull setup instructions for every service are in docs/setup/:
| Service | Required? | Guide |
|---|---|---|
| Vercel (deployment) | For production | docs/setup/vercel.md |
| NYC Open Data (events) | Optional | docs/setup/nyc-open-data.md |
| 511NY (transit alerts) | Optional | docs/setup/transit.md |
| MTA BusTime (buses) | Optional | docs/setup/bustime.md |
Map tiles are served by OpenFreeMap — no key needed. See docs/setup/maptiler.md if you prefer MapTiler.
NOAA weather, Citibike, tides, and community district data are zero-config — no keys needed.
bun run test:unit # pure logic (~1s)
bun run test:component # DOM rendering (~5s)
bun run test:integration # HTTP-level with MSW (~3s)
bunx vitest run # full suite
bun run test:e2e # Playwright (requires bun dev running)bun run typecheck # TypeScript check (no emit)
bun run lint # ESLint + Prettier
bun run lint -- --fix # Auto-fix
bun run build # Production buildsrc/
app/ Next.js App Router routes + API handlers
features/ Feature-first modules
map/ MapLibre GL map + camera markers
camera-feed/ Live DOT camera feed viewer
photobooth/ Canvas-based photo capture + share
context/ Weather, events, transit, Citibike context
theme/ 5-theme system (street, hacker, brutalist, pastel, light)
components/ui/ Primitive UI components
lib/
cameras/ NYC DOT camera data + geo utils
security/ Shared request hardening and header helpers
test/ MSW handlers and test utilities
.env.example Environment variable reference
See ROADMAP.md for planned features.
The creative use of NYC's public traffic cameras for photobooth-style photos was pioneered by trafficcamphotobooth.com. NycGrid builds on that spirit with a different scope and approach.