Ionic React JS - [EXTRA] Quick Intro to StrapiJS As Headless CMS for Mobile App Using GraphQL
Ionic ReactJS - [EXTRA] Quick Intro to StrapiJS As Headless CMS for Mobile App Using GraphQL
#ionic #react #graphql #strapi #headlessCMS #ionicframework #strapijs
Using ionic and reactjs to add documents and query documents from strapijs headless cms using graphQL and the ApolloClient graphQL react hooks useQuery & useMutation. See part one below for an overview of the application. In this video, we are refactoring OUT the REST API to add in the GraphQL API
? CHAPTERS ?
00:00 Intro
00:36 Plugin install for strapi
00:25 Playing with queries before adding to code
03:55 Refactoring the REST API to using graphql query - starting by creating the client
08:00 In Home.tsx using grapnel query to get all of the ImagePosts
14:42 In AddItem.tsx add mutations, first upload the image
20:20 In AddItem.tsx add mutations, upload the ImagePost with the media object
23:37 Update the UI on the Home page after a new image post is added
27:27 Potential solution is updating the cache
30:30 final test
? IONIC REACTJS STRAPI SERIES ?
Part 1: https://youtu.be/KCDtQocnZcQ
Part 2: https://youtu.be/lddJkkZebpU
EXTRA: https://youtu.be/VJTzpufik_s
SOURCE CODE: https://gumroad.com/l/NfyTZg
BLOG POST: https://dev.to/aaronksaunders/quick-introduction-to-strapi-headlesscms-for-ionic-reactjs-mobile-app-w-graphql-48gn
Strapi Quick Start Guide: https://strapi.io/documentation/developer-docs/latest/getting-started/quick-start.html
Strapi GraphQL: https://strapi.io/documentation/developer-docs/latest/plugins/graphql.html#usage
Apollo - useQuery: https://www.apollographql.com/docs/react/data/queries/#usequery-api
Apollo - useMutation: https://www.apollographql.com/docs/react/api/react/hooks/#usemutation
Ionic React GraphQL Starter - https://github.com/aaronksaunders/ionic-react-graphql
? ? IONIC REACT CONTENT
https://www.youtube.com/playlist?list=PL2PY2-9rsgl3OHIMYb1AzVG5wADUxOmUW
? ? IONIC VUEJS CONTENT
See the first part of Ionic VueJS Strapi Video Here for an overview of the CMS structure: https://youtu.be/82Z7Ojsm8NQ
? UDEMY IONIC VUE JS COURSE ?
https://www.udemy.com/course/using-ionic-framework-vuejs-firebase-vuex-for-image-diary/?couponCode=IONIC-VUEJS-1-9.99
? GUMROAD IONIC VUE JS CONTENT ?
https://www.gumroad.com/fiwic
? NEWSLETTER ?
- https://buff.ly/35bAMIf
-~-~~-~~~-~~-~-
Please watch: "Getting Started With Appwrite, Vue JS Ionic Framework & Capacitor"
https://www.youtube.com/watch?v=3d71O1zvlaw
-~-~~-~~~-~~-~-
Что делает видео по-настоящему запоминающимся? Наверное, та самая атмосфера, которая заставляет забыть о времени. Когда вы заходите на RUVIDEO, чтобы посмотреть онлайн «Ionic React JS - [EXTRA] Quick Intro to StrapiJS As Headless CMS for Mobile App Using GraphQL», вы рассчитываете на нечто большее, чем просто загрузку плеера. И мы это понимаем. Контент такого уровня заслуживает того, чтобы его смотрели в HD 1080, без дрожания картинки и бесконечного буферизации.
Честно говоря, Rutube сегодня — это кладезь уникальных находок, которые часто теряются в общем шуме. Мы же вытаскиваем на поверхность самое интересное. Будь то динамичный экшн, глубокий разбор темы от любимого автора или просто уютное видео для настроения — всё это доступно здесь бесплатно и без лишних формальностей. Никаких «заполните анкету, чтобы продолжить». Только вы, ваш экран и качественный поток.
Если вас зацепило это видео, не забудьте взглянуть на похожие материалы в блоке справа. Мы откалибровали наши алгоритмы так, чтобы они подбирали контент не просто «по тегам», а по настроению и смыслу. Ведь в конечном итоге, онлайн-кинотеатр — это не склад файлов, а место, где каждый вечер можно найти свою историю. Приятного вам отдыха на RUVIDEO!
Видео взято из открытых источников Rutube. Если вы правообладатель, обратитесь к первоисточнику.