@yunu-lab/rpc-react
Version:
🚀 **React + RPC = ❤️**
102 lines (71 loc) • 3.6 kB
Markdown
# @yunu-lab/rpc-react
🚀 **React + RPC = ❤️**
> *"Когда React встречает RPC, происходит магия"* - сказал один мудрый разработчик в 3 часа ночи
## 🎭 Что это такое?
Это библиотека, которая заставляет React и RPC работать вместе, как кофе и понедельник - не идеально, но работает!
## 🎪 Зачем это нужно?
- **Потому что можно** 🎯
- **Потому что TypeScript любит это** ⚡
- **Потому что Redux был одинок** 🛡️
- **Потому что связи между данными - это как связи между людьми** 🔗
- **Потому что асинхронность - это жизнь** 📡
## 🎨 Философия
> *"Если что-то можно сделать через хуки - это нужно сделать через хуки"*
Мы верим в:
- 🎯 Реактивность (когда данные меняются, UI тоже)
- ⚡ TypeScript (потому что `any` - это грех)
- 🛡️ Валидацию (потому что доверять данным нельзя)
- 🔗 Связи (потому что все в этом мире связано)
- 📡 Асинхронность (потому что жизнь не ждет)
## 🎪 Установка
```bash
npm install @yunu-lab/rpc-react @reduxjs/toolkit react-redux
```
## 🎭 Быстрый старт
```tsx
// Просто скопируй это и удивись
import { RpcProvider } from '@yunu-lab/rpc-react';
const App = () => (
<RpcProvider repository={repository}>
<YourAmazingApp />
</RpcProvider>
);
```
## 🎪 Что внутри?
- 🎯 **Реактивное состояние** - данные меняются, UI обновляется
- ⚡ **TypeScript** - потому что мы любим типы
- 🛡️ **Валидация** - Zod говорит "нет" плохим данным
- 🔗 **Связи** - как в социальных сетях, но для данных
- 📡 **Асинхронность** - потому что интернет медленный
## 🎪 Хуки (потому что React)
- `useRpc` - основной хук (как `useState`, но круче)
- `createRpcHooks` - создает хуки для твоих типов
- `useUserRelated` - для связанных данных
- `useUserListener` - для прослушивания изменений
- `useUserFullRelatedData` - для полных данных (с рекурсией!)
## 🎪 Примеры
```tsx
// Получаем пользователей
const { users } = useUser();
// Получаем связанные продукты
const userProducts = useUserRelated(1, "product");
// Слушаем изменения
const unsubscribe = useUserListener((events) => {
console.log("Что-то изменилось!", events);
});
```
## 🎪 Типизация
```tsx
// Определяем типы (потому что TypeScript)
type YourTypes = {
user: User;
product: Product;
};
// Используем (и радуемся автокомплиту)
const users = useRpcData<YourTypes, 'user'>('user');
```
## 🎪 Лицензия
MIT - делай что хочешь, но не вини нас 😄
---
*Создано с ❤️ командой Yunu*
*P.S. Если что-то не работает - это не баг, это фича!*