# react-appwrite

> Gorgeous library for integrating React with Appwrite.

Latest version **0.4.3** (published 2023-07-10) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-appwrite
pnpm add react-appwrite
yarn add react-appwrite
bun add react-appwrite
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.4.3 |
| Published | 2023-07-10 |
| First published | 2023-03-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=10 |
| Dependencies | 4 |
| Unpacked size | 139.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 39 |
| Author | sanny-io |
| Maintainers | sanny-io |
| Keywords | react, appwrite, hooks, firebase |

## Links

- npm: https://www.npmjs.com/package/react-appwrite
- Repository: https://github.com/react-appwrite/react-appwrite
- Issues: https://github.com/react-appwrite/react-appwrite/issues
- npm.io page: https://npm.io/package/react-appwrite

## Dependencies (4)

- [immer](https://npm.io/package/immer.md) ^9.0.19
- [encoding](https://npm.io/package/encoding.md) ^0.1.13
- [@tanstack/react-query](https://npm.io/package/@tanstack/react-query.md) ^4.24.9
- [@tanstack/react-query-devtools](https://npm.io/package/@tanstack/react-query-devtools.md) ^4.24.9

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.4.3 (latest) — 2023-07-10
- 0.4.2 — 2023-05-30
- 0.4.1 — 2023-05-06
- 0.4.0 — 2023-04-10
- 0.0.5 — 2023-03-12
- 0.0.4 — 2023-03-12
- 0.0.3 — 2023-03-11

## README

<div
  align="center"
>
  <img
    alt="React logo"
    width="100"
    src="docs/logos/react.svg"
  />

  <img
    alt="Appwrite logo"
    width="300"
    src="docs/logos/appwrite.svg"
  />

  <p>
    Gorgeous library for integrating React with Appwrite.
  </p>

  <p align="center">
    <a href="https://www.npmjs.com/package/react-appwrite" alt="Latest npm version">
        <img alt="Latest npm version" src="https://img.shields.io/npm/v/react-appwrite?color=blue"></a>
    <a href="https://github.com/react-appwrite/react-appwrite/blob/main/LICENSE" alt="MIT license">
        <img alt="MIT license" src="https://img.shields.io/github/license/react-appwrite/react-appwrite?color=success" /></a>
    <a href="https://github.com/react-appwrite/react-appwrite/issues" alt="GitHub issues">
        <img alt="GitHub issues" src="https://img.shields.io/github/issues/react-appwrite/react-appwrite" />
        </a>
</p>
</div>

---

## Features

✅ Realtime updates for everything

✅ Next.js middleware support

✅ React Server Components (RSC) support

✅ Optimized for performance with minimal re-renders

✅ Incredibly simple API

✅ Fully typed, written 100% in TypeScript

✅ Eventual feature parity with the Appwrite SDK

## Supported Services

This library is a work in progress. The intent is to eventually reach 100% feature parity with Appwrite.

- [Account](/src/account)
- [Avatars](/src/avatars)
- [Databases](/src/databases)
- [Functions](/src/functions)
- [Locale](/src/locale)
- [Next.js](/src/next)
- [Storage](/src/storage)
- [Teams](/src/teams)

### Table of Contents

- [Installation](#installation)
- [Configuration](#configuration)
- [Contributing](#contributing)
- [License](#license)

### Installation

```
npm i react-appwrite appwrite
```

### Configuration

```tsx
import { Client } from 'appwrite'
import { AppwriteProvider } from 'react-appwrite'

const appwrite = new Client()
  .setEndpoint('https://my-appwrite-url.com')
  .setProject('myAppwriteProjectId')

function App() {
  return (
    <AppwriteProvider
      client={appwrite}
    >
      {
        // ...
      }
    </AppwriteProvider>
  )
}
```

This library is powered by [react-query](https://tanstack.com/query/v4/docs/react/reference/useQuery).
Hooks follow this format.

```typescript
const { data, isLoading } = useHook(...)
```

### Contributing

> **Note**
> We're looking for maintainers! [Leave a comment](https://github.com/react-appwrite/react-appwrite/discussions/1) if you'd like to help out.

Follow these steps to get started with local development.

1. Clone the repository.

```
git clone https://github.com/react-appwrite/react-appwrite.git
cd react-appwrite
```

2. Install dependencies.

```
npm i
```

3. Execute the development script.

```
npm run dev
```

Follow these extra steps if you'd like to test with the provided example
project.

1. In another terminal, navigate to the `example` directory.

```
cd example
```

2. Create your `.env` file.

```
cp .env.example .env
```

3. Replace the environment variables in `.env` with your own.

4. Install dependencies.

```
npm i
```

5. Execute development script.

```
npm run dev
```

### License

[MIT](/LICENSE)

<a href="https://vercel.com?utm_source=react-appwrite&utm_campaign=oss" alt="Powered by Vercel">
        <img alt="Vercel logo" src="docs/logos/vercel.svg" />
        </a>

---
_Source: https://npm.io/package/react-appwrite · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._