[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発
Hasura cloud, Nextjs, Apollo Client, Typescript, React-testing-library, Tailwind CSS, MSW, next-page-tester
4.48 (232 reviews)
![[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発](https://thumbs.comidoc.net/750/3845506_b94d_5.jpg)
1 748
students
5 hours
content
Feb 2025
last update
$19.99
regular price
Why take this course?
🎓 [Hasura基礎編] Nextjs + Hasura + Apollo Clientで学ぶモダンGraphQL Web開発
コース概要
本コースでは、フロントエンドのNext.jsとバックエンドのHasuraによるGraphQLサーバーを組み合わせた現代的なWeb開発技術を学びます。このコースでは、Next.jsの革新的なSSG(Static Site Generation)とISR(Incremental Static Regeneration)、Hasura Cloudの強力なAPI、Apollo Clientの状態管理、そしてReact-testing-libraryを用いたテスト手法など、モダンなフルス택を凝縮する方法を学びます。
学習内容 📚
Hasura Cloud
- Hasura CloudとGraphQLの基本理解
- Hasuraでのテーブル間の関係性(1:1, 1:N, N:N(中間テーブル))の管理
- Next.jsとHasuraの統合方法
Apollo Client
- Apollo Clientでの状態管理の仕組み、
makeVar
+useReactiveVar
の使用方法 - Apollo Clientのキャッシュ管理と更新手順(
cache.modify
) - GraphQLクエリの実行とマルチクリアント操作(
useQuery
+useMutation
) - 4つのフェッチポリシー(
cache-first
,cache-and-network
,network-only
,no-cache
)の理解と適用方法
Next.js
getStaticProps
とApollo client
を使ったSSG(Static Site Generation)とISR(Incremental Static Regeneration)の実装技術getStaticPaths
とApollo client
を使った個別ページのSSG&ISR- カスタムフックによるロジックとUIの分離との協力方法
useCallback
+memo
の最適化技術
React-testing-library
next-page-tester
とreact-testing-library
を用いたテストケースの書き方- MSW(Mock Service Worker)でのGraphQL応答モックng
- CI/CDパイプラインにおける自動テストの実施
GraphQL types
- GraphQLコードジェネレータを使ったデータ型の自動生成(TypeScript)
収録機材
- マイク:SHURE SM7B
- マイクスタンド:Blue compass
- オーディオインターフェース:Solid State Logic (SSL 2+)
- 映像編集:Screen Flow 9
必須習慣
- Next.js(getStaticProps, getStaticPaths)の基礎は事前に自習しておくと良い。公式Tutorialなど参照可能です。
👩💻 このコースを通じて、あなたはモダンなGraphQL Web開発を導入し、フロントエンドとバックエンドの連携能力を高めることができます。現在この機会を逃さない! 🚀
このコースは、あなたがWeb開発の新しい境界線に立ち向かう準備を整えるための理想的なスタート点となります。最新の技術とベストプラクティスを学び、実践的なプロジェクトを通じて自分のスキルを磨き上げましょう!
Course Gallery
![[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発 – Screenshot 1](https://cdn-screenshots.comidoc.net/3845506_1.png)
![[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発 – Screenshot 2](https://cdn-screenshots.comidoc.net/3845506_2.png)
![[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発 – Screenshot 3](https://cdn-screenshots.comidoc.net/3845506_3.png)
![[Hasura基礎編] Nextjs+Hasura+Apollo Clientで学ぶモダンGraphQL Web開発 – Screenshot 4](https://cdn-screenshots.comidoc.net/3845506_4.png)
Loading charts...
3845506
udemy ID
13/02/2021
course created date
23/04/2021
course indexed date
Bot
course submited by