@@weynemeynen у Apollo есть общий Стейт менеджер как у redux toolkit? Например тебе надо открывать модальное окно из разных компонентов. И Apollo это прежде всего это работа с запросами на примере rest только с помощью graphql и схем.
@@АлександрСкиталец-ц7р Еще есть вопрос сохранения данных на клиенте. Вроде есть некий "apollo-cache-persist", но что делать, если хранить нужно не только запросы, а еще что-нибудь. В этом случае redux toolkit выглядит универсальнее. А вот насколько он удобнее для запросов - это вопрос.
Здравствуйте Михаил Непомнящий, Отличная подача, Спасибо за контент! Было бы здорово, если вы будите продолжать освещать данную тему по Apollo GraphQL, и к примеру объяснили темы концепции архитектуры "Apollo Client & Client-side Architecture", нюансы с кешированием, как правильно выполнять и настраивать пагинацию (особенно, когда индексы страниц могут сбиваться), и т.д. либо другие полезные темы. :)
Михаил, отличнейшая подача и материал. Очень актуально как всегда. Хотелось бы только видеть всё тоже самое, только на ts, вряд ли кто-то использует js сейчас.)
планируются ли еще видео на тему Apollo react? Например, пагинация, подписки. Тема запросов и мутаций раскрыта просто замечательно. Особенно порадовала правильная работа с кэшем. Не видел, чтобы кто-то так подробно показывал именно использование кэша в GraphQL. Так же и пагинацию, как мне кажется, нужно делать через кэш. Но подобных видео на ютубе я не встречал.
лучший канал. для человека который умеет читать доку , эти ролики заходят на ура для ознакомления. прохожу курс про редакс, планирую потом курс по тайп скрипт у вас ж приобрести. спасибо!
Отлично, спасибо. Я за 2 часа разобрался с этими технологиями и уже применяю в проекте :) Хотелось бы еще уточнить, я вижу сходство некое с Редаксом. МОгу ли я частично или полностью заменить этими технологиями - Редакс?
Я у вас проходила курс по ридаксу. Заюзала его до дыр и во всех технических заданиях uзала или redux или toolkit. Если бы вы еще сделали такой же классный курс с apollo клиент и сервер с разными примерами, то это было бы мега. Многие компании постепенно переходят с rest на graphql и не хватает достаточно контента
Я сейчас работаю с Relay вместо Apollo. Пока над курсом не задумывался, но вижу что контента по нему совсем нет. Хотя инструмент крутой, да и поддерживается той же Meta, что и сам React разрабатывает.
@@mishanep контент немного есть на англ, но для того, чтобы хорошо усвоить технологию всегда нужно попробовать разные апп. Мне дико понравился ваш старый и новый ридакс. Очень помогло все понять фундаментально.
Откуда на сервере взялся Graphiql, и каким образом сгенерировалась schema для туду? В начале же только был установлен пакет json-graphql-server и создан json файлик с данными. Т.е. этот пакет содержит в себе Graphiql? А схема сгенерена просто дефолтная? Ничего не понятно))
мне очень было полезно. Михаил, добрый день, расскажите пожалуйста подробно как работать с Аполло-Персист-Кеш! persistCache({ cache, storage: new LocalStorageWrapper(window.localStorage), }); Как добавлять и удалять элементы в локал стор, а потом через @client в кеш и вызывать это у локального qgl запроса пример. Но самое интересное! Аполло-Сторедж. storage: new LocalStorageWrapper(window.localStorage), что это такое? как с ним работать? как добавить, или достать, записать или вытянуть переменные из персист кеша? Заранее благодарю! Спасибо, Ростислав
Михаил спасибо за видео! Есть один вопрос, могу ли я использовать результат мутации в вышестоящем компоненте, как например в RTK Query с помощью флага fixed_cache_key для мутаций? Например, у меня есть компонент в котором по очереди показываются две формы, мои действия: - Успешно прохожу первую форму с помощью мутации - Хочу отследить результат мутации в родительском компоненте, чтобы отрендерить следующую форму - поле data от мутации не изменяется в родительском компоненте и форма не переключается
But we see the fact that when updating the cache, we added a newTodo to the beginning of the array, but it still appears at the end of the cache. This can be seen if you update it again or in Apolo Client Devtools.
Спасибо, как всегда интересно и полезно. Обратил внимание, что при загрузке(ожидании) показываете компонент-спиннер, а вы не реализовывали скелетон (самостоятельно или при помощи библиотеки)? Очень много где сейчас на сайтах используют. С удовольствием бы посмотрел реализацию скелетона в вашем проекте.
Хорошее видео. Но есть один нюанс.. Можете попробовать именно с изначальной ДБ поработать (где посты). При добавление поста - пост почему-то идет все равно в конец массива кеша + идет повторный запрос на сервер всех постов.... Был бы очень любезен если бы смогли ответить на данный вопрос почему так происходит
Я разобрался - может быть кому поможет: При добавление полей - соблюдайте структуру данных которые вы получаете. То есть поле которое вы добавляете вы явно должны указать в мутации
Очень полезная информация. Если работать с Next.js и нужно делать запрос со стороны backend и со стороны frontend. Использовал обычный fetch, так как Next.js поддерживает fetch на стороне backend. А как тогда использовать Apollo так, чтобы на стороне backend и frontend делать запрос?
Почему вы делаете кэллбек инпута на Enter? Просто подпишитесь на submit формы, а submit по Enter браузер делает самостоятельно. Походу HTML самый сложный язык для JS разработчиков :)
180 пример с тудушками... поднадоело. Как не зайдешь на какой-то видос посмотреть к Михаилу, обязательно тудушки. Михаил, будь немного уже пооригенальней, чтоли
Интересно будет посмотреть graphql и redux toolkit в связке. А за видео большое спасибо.
Плюсую
Поддерживаю
...а он, redux toolkit, там где apollo/graphql, по ходу и не нужен
@@weynemeynen у Apollo есть общий Стейт менеджер как у redux toolkit? Например тебе надо открывать модальное окно из разных компонентов. И Apollo это прежде всего это работа с запросами на примере rest только с помощью graphql и схем.
@@АлександрСкиталец-ц7р Еще есть вопрос сохранения данных на клиенте. Вроде есть некий "apollo-cache-persist", но что делать, если хранить нужно не только запросы, а еще что-нибудь. В этом случае redux toolkit выглядит универсальнее. А вот насколько он удобнее для запросов - это вопрос.
Здравствуйте Михаил Непомнящий,
Отличная подача, Спасибо за контент!
Было бы здорово, если вы будите продолжать освещать данную тему по Apollo GraphQL, и к примеру объяснили темы концепции архитектуры "Apollo Client & Client-side Architecture", нюансы с кешированием, как правильно выполнять и настраивать пагинацию (особенно, когда индексы страниц могут сбиваться), и т.д. либо другие полезные темы. :)
Михаил, отличнейшая подача и материал. Очень актуально как всегда. Хотелось бы только видеть всё тоже самое, только на ts, вряд ли кто-то использует js сейчас.)
Велике дякую за інформацію і окрема вдячність за стартовий код на гітхабі. Просто суепр💻
планируются ли еще видео на тему Apollo react? Например, пагинация, подписки. Тема запросов и мутаций раскрыта просто замечательно. Особенно порадовала правильная работа с кэшем. Не видел, чтобы кто-то так подробно показывал именно использование кэша в GraphQL. Так же и пагинацию, как мне кажется, нужно делать через кэш. Но подобных видео на ютубе я не встречал.
Рад что видео понравилось. Долго его готовил. Пока продолжение не планирую. Но за тематику спасибо.
Огонь видео! Спасибо за подробное и четкое объяснение. только вот момент в конце с db.js хотелось бы разобрать подробнее
Огромное спасибо, реально классный контент, надеюсь некс видео graphql и redux toolkit, было бы здорово
Спасибо большое! Видео помогло разобраться с Apollo и GrapQL. Иду пробовать на практике!
лучший канал. для человека который умеет читать доку , эти ролики заходят на ура для ознакомления. прохожу курс про редакс, планирую потом курс по тайп скрипт у вас ж приобрести. спасибо!
не думал, что скажу когда-то, но лайк ещё до просмотра )
Спасибо! Отличнейшая подача материала! (Apollo GraphQL)
Если у вас readQuery возвращает null то прокиньте туда variables, которые вы прокидывали при изначальном запросе, например так:
1) Получение всех публикаций пользователя
const {
loading,
error,
data: dataV,
} = useQuery(GET_PUBLICATIONS, {
variables: { userId },
});
2) Создание публикации
const [addPublication, { data: dataT, loading: loadingT, error: errorT }] =
useMutation(ADD_PUBLICATION, {
update(cache: any, { data: { createPost } }: any) {
const tes = cache.readQuery({
query: GET_PUBLICATIONS,
variables: { userId },
});
console.log(tes);
},
});
Как всегда лучший!
Отлично, спасибо. Я за 2 часа разобрался с этими технологиями и уже применяю в проекте :) Хотелось бы еще уточнить, я вижу сходство некое с Редаксом. МОгу ли я частично или полностью заменить этими технологиями - Редакс?
Чтобы добить серию осталось только показать в связке с ts + codegen, ну и тесты)
Полезный урок Михаил, спасибо.
Spasibo, kak vsegda polezno i po delu!!!
Спасибо больше, просто нет слов, одна благодарность!!!
Спасибо Михаил за полезный контент! (Apollo GraphQL)
Спасибо, очень доходчиво объясняете, лайк, подписка.
Спасибо, Михаил. Очень доходчиво объясняете 😊
Михаил - спасибо! Нужная штука!) Будем посмотреть, так сказать!)
Как всегда отличное видео! поддержу вопрос по поводу новых видео про подписки и пагинацию с использованием кэша, а также работу с TS. Спасибо!
Видео просто на высоте!
а есть еще подписки. Было бы здорово, если бы на данном канале их разобрали. У автора хорошо получается
Спасибо за видео, хотелось бы увидеть эту тему с использованием ts типизацией.
Жаль, два лайка поставить нельзя. Спасибо за видео!
Я у вас проходила курс по ридаксу. Заюзала его до дыр и во всех технических заданиях uзала или redux или toolkit. Если бы вы еще сделали такой же классный курс с apollo клиент и сервер с разными примерами, то это было бы мега. Многие компании постепенно переходят с rest на graphql и не хватает достаточно контента
Я сейчас работаю с Relay вместо Apollo. Пока над курсом не задумывался, но вижу что контента по нему совсем нет. Хотя инструмент крутой, да и поддерживается той же Meta, что и сам React разрабатывает.
@@mishanep контент немного есть на англ, но для того, чтобы хорошо усвоить технологию всегда нужно попробовать разные апп. Мне дико понравился ваш старый и новый ридакс. Очень помогло все понять фундаментально.
Откуда на сервере взялся Graphiql, и каким образом сгенерировалась schema для туду? В начале же только был установлен пакет json-graphql-server и создан json файлик с данными. Т.е. этот пакет содержит в себе Graphiql? А схема сгенерена просто дефолтная? Ничего не понятно))
Видео про фронтенд часть, поэтому настройки бэкенда второстепенны. Да, Graphiql идет из коробки json-graphql-server
мне очень было полезно.
Михаил, добрый день, расскажите пожалуйста подробно как работать с Аполло-Персист-Кеш!
persistCache({
cache,
storage: new LocalStorageWrapper(window.localStorage),
});
Как добавлять и удалять элементы в локал стор, а потом через @client в кеш и вызывать это у локального qgl запроса пример.
Но самое интересное! Аполло-Сторедж.
storage: new LocalStorageWrapper(window.localStorage), что это такое? как с ним работать? как добавить, или достать, записать или вытянуть переменные из персист кеша?
Заранее благодарю!
Спасибо, Ростислав
Михаил спасибо за видео! Есть один вопрос, могу ли я использовать результат мутации в вышестоящем компоненте, как например в RTK Query с помощью флага fixed_cache_key для мутаций? Например, у меня есть компонент в котором по очереди показываются две формы, мои действия:
- Успешно прохожу первую форму с помощью мутации
- Хочу отследить результат мутации в родительском компоненте, чтобы отрендерить следующую форму
- поле data от мутации не изменяется в родительском компоненте и форма не переключается
Супер! Хотелось бы нырнуть глубже в apollo: subscriptions, testing...
посмотрел вводный и Апполо, и захотелось проект переписать :)
О, класс!!! Как раз по моему запросу)
But we see the fact that when updating the cache, we added a newTodo to the beginning of the array, but it still appears at the end of the cache. This can be seen if you update it again or in Apolo Client Devtools.
Спасибо!
Nice content ☺️👍
очень полезно и доступно, спасибо!
Спасибо, как всегда интересно и полезно. Обратил внимание, что при загрузке(ожидании) показываете компонент-спиннер, а вы не реализовывали скелетон (самостоятельно или при помощи библиотеки)? Очень много где сейчас на сайтах используют. С удовольствием бы посмотрел реализацию скелетона в вашем проекте.
Во многих библиотеках компонентов сейчас предлагаются скелетоны. И в Material UI были и в Chakra и в Ant.Design.
Хорошее видео. Но есть один нюанс.. Можете попробовать именно с изначальной ДБ поработать (где посты). При добавление поста - пост почему-то идет все равно в конец массива кеша + идет повторный запрос на сервер всех постов.... Был бы очень любезен если бы смогли ответить на данный вопрос почему так происходит
Я разобрался - может быть кому поможет: При добавление полей - соблюдайте структуру данных которые вы получаете. То есть поле которое вы добавляете вы явно должны указать в мутации
Очень полезная информация. Если работать с Next.js и нужно делать запрос со стороны backend и со стороны frontend. Использовал обычный fetch, так как Next.js поддерживает fetch на стороне backend. А как тогда использовать Apollo так, чтобы на стороне backend и frontend делать запрос?
Спасибо
🔥🔥🔥
лайк, подписка!
Привет. Хотелось увидеть работу с fragments спасибо
Респект!
Добрый день. Михаил, а как насчёт SuperGraph? Есть опыт, которым можете поделиться? Очень ценная была бы информация!
Приветствую, Евгений.
Никогда про него не слышал =)
@@mishanep www.apollographql.com/blog/announcement/backend/the-supergraph-a-new-way-to-think-about-graphql/
🐯
🥳
После удаления элементов, изменения в кэше в аполло дев тулз появляются только после обновления страницы. В чём причина?
Формально мы не удалили элемент из кэша, а убрали ссылку на него из коллекции. При перезагрузке в данном варианте кэш полностью очищается.
Почему вы делаете кэллбек инпута на Enter?
Просто подпишитесь на submit формы, а submit по Enter браузер делает самостоятельно.
Походу HTML самый сложный язык для JS разработчиков :)
+
180 пример с тудушками... поднадоело. Как не зайдешь на какой-то видос посмотреть к Михаилу, обязательно тудушки. Михаил, будь немного уже пооригенальней, чтоли
onKeyPress зачёркивает.
Пишет предупреждение:
'onKeyPress' is deprecated.ts(6385)
index.d.ts(2431, 13): The declaration was marked as deprecated here.
Спасибо 🙏