🚀Стань квалифицированным разработчиком за 9+ месяцев с трудоустройством в IT —INCUBATOR: Front-end https://it-incubator.io/front-end/?utm_source=youtube&utm_medium=it-k&utm_campaign=education Back-end https://it-incubator.io/back-end/?utm_source=youtube&utm_medium=it-k&utm_campaign=education Репозиторий https://github.com/it-incubator/musicfun-react-all-stacks Топ 5 книг для программиста https://youtu.be/IeODSXm4s_E Станьте спонсором канала, и вы получите доступ к эксклюзивным бонусам. Подробнее: https://www.youtube.com/channel/UCTW0FUhT0m-Bqg2trTbSs0g/join Поддержать меня можно на: Patreon https://www.patreon.com/itkamasutra Boosty https://boosty.to/itkamasutra Поддержать проект монеткой: https://social-network.samuraijs.com А здесь бесплатная взаимопомощь: https://t.me/reactjs_samurai * Мы в соц. сетях: https://vk.com/itkamasutra https://instagram.com/it.incubator https://telegram.me/itkamasutra * Мои личные VK и Inst: https://vk.com/d.kuzyuberdin https://www.instagram.com/dmitry.kuzyuberdin/ #reactjs #курс #reactquery 00:00:00 — О чём курс, репозиторий 00:24:05 — Практика: создаём проект Vite 00:25:25 — Установка TanStack Query 00:27:31 — Установка openapi-typescript (кодогенерация) 00:28:48 — Установка TanStack Router 00:29:58 — Установка openapi-fetch 00:31:17 — ApiHub и MusicFun: вводная 00:33:20 — Запуск проекта, первый запрос к API 00:35:15 — Осмысление первого запроса 00:37:25 — Генерируем код 00:38:42 — Настройка openapi-fetch, первый запрос 00:43:12 — Архитектура: кэш + API-слой 00:48:09 — Подключаем QueryClient, первый useQuery 00:57:36 — Много одинаковых vs один запрос 01:01:12 — Рендеринг плейлистов 01:04:01 — WebSocket из WebStorm (HMR) 01:05:36 — staleTime 01:11:50 — gcTime 01:14:36 — DevTools 01:17:36 — refetchOnMount / refetchOnFocus 01:19:17 — refetchOnReconnect 01:20:38 — defaultOptions — гибкость 01:23:41 — CSS styles 01:25:41 — Настройка TanStack Router 01:35:17 — Header 01:38:17 — Preloader / skeleton / status / fetchStatus 01:55:29 — Errors 02:04:29 — Retry 02:08:23 — Pagination 02:09:09 — Ссылка на «самурайское» видео о пагинации 02:18:47 — placeholderData 02:21:35 — AbortController 02:28:31 — Object as queryKey 02:33:43 — OAuth2, useMutation для login 03:35:17 — Middleware, accessToken 03:36:09 — invalidateQueries 03:27:34 — Logout, resetQueries 03:36:21 — Ротация access / refresh tokens 03:56:49 — My playlists, redirect если anonymous 04:03:02 — Add playlist 04:18:25 — refetchType 04:20:54 — Delete playlist 04:27:01 — setQueries 04:38:42 — Edit playlist 04:53:26 — enabled 05:01:26 — Optimistic update 05:25:11 — Key factory for playlists 05:34:11 — queryOptions 05:36:14 — usePlaylistsQuery 05:42:29 — Auth keyFactory 05:43:56 — useAddPlaylistMutation 05:46:15 — useDeletePlaylistMutation 05:49:26 — usePlaylistQuery 05:51:55 — useUpdatePlaylistMutation 06:00:41 — Config / env-vars / LocalStorage keys 06:06:26 — Bug-fix EditPlaylistForm 06:08:31 — hideForm after delete (callback) 06:11:41 — Продолжаем фикс 06:14:57 — Close edit form; callback vs mutateAsync 06:20:26 — AddPlaylistForm: callback vs mutateAsync 06:22:26 — Process errors 06:25:56 — Server error format (JSON API) 06:34:44 — Apply error factory (Edit Form) 06:38:20 — react-toastify 06:40:22 — Global error handling, mutationCache 06:42:50 — meta