# Blitz.js — Full-Stack React Framework with Zero-API Layer

> Blitz.js is a full-stack React framework built on Next.js that eliminates the need for a REST or GraphQL API by letting you import server code directly into your React components.

## Install

Save as a script file and run:

# Blitz.js — Full-Stack React Framework with Zero-API Layer

## Quick Use
```bash
npx blitz new my-app
cd my-app
blitz dev
```

## Introduction
Blitz.js extends Next.js with a zero-API data layer, built-in authentication, code scaffolding, and conventions that make building full-stack React apps feel like working with a traditional server-rendered framework. The goal is to bring the developer experience of Ruby on Rails to the React ecosystem.

## What Blitz.js Does
- Provides a zero-API data layer where server functions are called directly from React components
- Includes built-in authentication with session management, login, signup, and password reset flows
- Scaffolds CRUD operations with `blitz generate` for models, queries, mutations, and pages
- Extends Next.js with recipes (code mods) for adding libraries like Tailwind, Material UI, or Chakra
- Manages database schema and migrations through Prisma integration out of the box

## Architecture Overview
Blitz's zero-API layer works by compiling server-side query and mutation functions into RPC endpoints at build time. When you import a server function in a React component, Blitz replaces the import with an HTTP call to the generated API route. This gives you the developer experience of direct function calls while maintaining a proper client-server boundary. Authentication state is managed through secure HTTP-only session cookies with configurable strategies.

## Self-Hosting & Configuration
- Create a new project with `npx blitz new` which sets up Next.js, Prisma, and auth scaffolding
- Configure the database in `db/schema.prisma` and run `blitz prisma migrate dev` to apply changes
- Place queries in `app/queries/` and mutations in `app/mutations/` for automatic RPC endpoint generation
- Set session and auth configuration in `src/blitz-server.ts` and `src/blitz-client.ts`
- Deploy to any Node.js host, Vercel, or Docker with `blitz build` for production builds

## Key Features
- Zero-API data layer eliminates boilerplate of writing REST or GraphQL endpoints for CRUD operations
- Built-in auth with secure sessions, CSRF protection, and configurable login strategies
- Code scaffolding generates models, pages, queries, and mutations from a single command
- Full Next.js compatibility means all Next.js features, plugins, and deployment targets work unchanged
- Recipes automate adding third-party libraries with proper configuration and boilerplate

## Comparison with Similar Tools
- **Next.js** — Blitz is built on Next.js and adds the zero-API layer, auth, and scaffolding that Next.js leaves to you
- **Remix** — focuses on web fundamentals with loaders and actions; Blitz uses RPC-style queries and mutations with direct imports
- **RedwoodJS** — similar full-stack ambition but uses GraphQL as the API layer; Blitz eliminates the API entirely
- **T3 Stack** — community convention for Next.js with tRPC; Blitz provides the same type-safe server calls with less manual setup
- **Ruby on Rails** — Blitz aims to bring Rails-level productivity to React with conventions, generators, and batteries included

## FAQ
**Q: Is Blitz.js just Next.js with extra features?**
A: Blitz started as a Next.js superset. It now provides a toolkit that can be adopted incrementally in any Next.js app, so you can use just the auth or just the RPC layer.

**Q: How does the zero-API layer handle authentication?**
A: Server functions automatically receive the session context. You can call `ctx.session.$authorize()` in any query or mutation to restrict access to authenticated users.

**Q: Can I use Blitz with databases other than PostgreSQL?**
A: Yes. Blitz uses Prisma under the hood, which supports PostgreSQL, MySQL, SQLite, MongoDB, and SQL Server.

**Q: Is Blitz.js actively maintained?**
A: Yes. The project has moved to a toolkit model where its features (auth, RPC, code gen) are usable independently within any Next.js project.

## Sources
- https://github.com/blitz-js/blitz
- https://blitzjs.com/


---
Source: https://tokrepo.com/en/workflows/78f789d2-40c3-11f1-9bc6-00163e2b0d79
Author: Script Depot