electric-sql / electric-sql/electric

Skill: Next.js + Electric integration

Open
#3,912 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
10.4k
Forks
375
Avg merge
3d 1h
Merged PRs (30d)
18

Description

## Context

Next.js is a common framework pairing with Electric. The proxy pattern differs from TanStack Start (API routes vs server functions), and there are Next.js-specific considerations around App Router vs Pages Router, server components, and middleware.

## Scope

Create an `electric-nextjs` skill covering:

1. **Proxy route implementation** — App Router route handler (`app/api/shapes/route.ts`) vs Pages Router API route
2. **Server-side shape definition** — Where to inject ELECTRIC_SECRET, user-scoped WHERE clauses
3. **Electric protocol param forwarding** — Using ELECTRIC_PROTOCOL_QUERY_PARAMS
4. **Header forwarding** — Preserving electric-offset, electric-handle, electric-schema
5. **Middleware patterns** — Auth validation before proxy forwarding
6. **TanStack DB integration** — Collections with Next.js-specific proxy URL patterns
7. **Common gotchas** — CORS, Vercel serverless timeouts with SSE, edge runtime limitations

## Source

Identified during domain discovery skill test run. Maintainer confirmed Next.js warrants standalone skill due to integration complexity.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.