UNPKG

@yunu-lab/rpc-react

Version:
102 lines (71 loc) 3.6 kB
# @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. Если что-то не работает - это не баг, это фича!*