[![Blitz.js](https://raw.githubusercontent.com/blitz-js/art/master/github-cover-photo.png)](https://blitzjs.com)

<!-- prettier-ignore-start -->
<p align="center">
  <a aria-label="Join our Discord Community" href="https://discord.blitzjs.com">
    <img alt="" src="https://img.shields.io/badge/Join%20our%20community-6700EB.svg?style=for-the-badge&labelColor=000000&logoWidth=20&logo=data:image/png;base64, ">
  </a>
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
<a aria-label="All Contributors" href="#contributors-"><img alt="" src="https://img.shields.io/badge/all_contributors-403-17BB8A.svg?style=for-the-badge&labelColor=000000"></a>
<!-- ALL-CONTRIBUTORS-BADGE:END -->
  <a aria-label="License" href="https://github.com/blitz-js/blitz/blob/main/LICENSE">
    <img alt="" src="https://img.shields.io/npm/l/blitz.svg?style=for-the-badge&labelColor=000000&color=blue">
  </a>
  <a aria-label="NPM version" href="https://www.npmjs.com/package/@blitzjs/auth">
    <img alt="" src="https://img.shields.io/npm/v/blitz.svg?style=for-the-badge&labelColor=000000&color=E65528">
  </a>
</p>
<!-- prettier-ignore-end -->

<br>

<h1 align="center">
Blitz "Zero-API" data layer (Blitz RPC) 
</h1>

<br>

### [Documentation Link](https://blitzjs.com/docs/rpc-overview)

### [GitHub Link](https://github.com/blitz-js/blitz/tree/main/packages/blitz-rpc)

### Quick Start

#### Install Blitz RPC

```bash
`npm i @blitzjs/rpc`
# yarn add @blitzjs/rpc
# pnpm add @blitzjs/rpc
```

_You can alternatively use [`npx`](https://www.npmjs.com/package/npx)_

### Overview

Blitz "Zero-API" data layer (Blitz RPC) is focused on making the communication between server and client seamless. It lets you

import server code directly into your components instead of having to manually add API endpoints and do client-side fetching and caching.
Here's a quick overview:

![Blitz RPC Overview](https://blitzjs.com/img/architecture-alt.png)

#### Queries and mutations

Queries and mutations only run on the server — at build time, the direct function import is replaced with an RPC network call. So the query function code is never included in your client code. It's instead moved to an API layer.

### Framework Support

Currently Blitz RPC is only supported in Next.js. We are working on adding support for other frameworks.

### [Setup Blitz RPC in Next.js](https://blitzjs.com/docs/rpc-setup)
