From 3ed98889ea1e87e553645c2199bd542a54014b23 Mon Sep 17 00:00:00 2001
From: Kohei Watanabe <kou029w@gmail.com>
Date: Tue, 20 Jul 2021 14:58:37 +0900
Subject: [PATCH] =?UTF-8?q?=E6=9B=B8=E3=81=84=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .marprc.yml |   2 ++
 README.md   | 102 +++++++++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 103 insertions(+), 1 deletion(-)
 create mode 100644 .marprc.yml

diff --git a/.marprc.yml b/.marprc.yml
new file mode 100644
index 0000000..ba118a0
--- /dev/null
+++ b/.marprc.yml
@@ -0,0 +1,2 @@
+title: Hasura 概論
+html: true
diff --git a/README.md b/README.md
index 16795b5..34cb8c3 100644
--- a/README.md
+++ b/README.md
@@ -11,4 +11,104 @@ WebDINO Japan エンジニア
 
 ---
 
-_TBD_
+## Hasura
+
+GraphQL サーバー
+
+データベースを\
+自動的に GraphQL API として提供
+
+![bg right:45% h:600px](https://hasura.io/static/schema-query-3e7ddf6d398359f910d334df09391638.svg)
+
+<!-- _footer: 画像の出典: Hasura 公式サイト - https://hasura.io -->
+
+---
+
+## GraphQL
+
+> - GraphQL とはデータを問い合わせるクエリ言語仕様と周辺技術
+> - 単一リクエスト/型システム/開発ツール
+
+![bg right:22% w:200px][graphql.svg]
+
+[graphql.svg]: https://cdnjs.cloudflare.com/ajax/libs/simple-icons/5.7.0/graphql.svg
+
+<!-- _footer: 引用元: スライド [GraphQL 概論 (拙著)](https://kou029w.github.io/intro-to-graphql/) -->
+
+---
+
+## Hasura を使うメリット
+
+GraphQL にはコードジェネレーターがあり、多くの言語をサポートされている<sup>[^1]</sup>
+しかし、バックエンドでは SQL 等のデータソースのクエリーに変換する必要がある
+
+Hasura を使うと GraphQL から SQL への変換を自動的に実現可能
+
+[^1]: https://www.graphql-code-generator.com/
+
+<!-- _footer: ^1: [https://www.graphql-code-generator.com/][^1] -->
+
+---
+
+## 特徴
+
+- 強力な CRUD 操作
+- 簡単なデータ構造の変更
+- 堅牢なアクセス制御モデル
+
+---
+
+## Hasura 2.0 の機能の紹介
+
+[RESTified GraphQL Endpoints (2.0 の新機能)](https://hasura.io/docs/latest/graphql/core/api-reference/restified.html)
+GraphQL の REST 化のサポート
+
+Query/Mutation を REST エンドポイントに対応付けることが可能
+GraphQL API と同様のレスポンスを得る
+
+---
+
+## RESTified GraphQL Endpoints ハンズオン
+
+<!-- prettier-ignore-start -->
+[Hasuraで作るREST API](https://kou029w.github.io/hasura-rest-hands-on/)
+<!-- prettier-ignore-end -->
+
+---
+
+## 後付
+
+---
+
+## 認証・認可
+
+- Webhook
+- JWT - 推奨
+
+<!-- _footer: 公式ドキュメント: https://hasura.io/docs/latest/graphql/core/auth/index.html -->
+
+---
+
+## 設定
+
+[CORS](https://hasura.io/docs/latest/graphql/core/deployment/graphql-engine-flags/config-examples.html#id1)
+
+- 適宜セキュリティ要件に合わせて設定
+- デフォルトですべてのオリジン(`Access-Control-Allow-Origin: *`)が許可
+
+---
+
+## 関連
+
+- [Hasura GraphQL Docs](https://hasura.io/docs/latest/graphql/core/index.html)
+- [Hasura GraphQL チュートリアル](https://hasura.io/learn/graphql/hasura/introduction/)
+- [Hasura GraphQL チュートリアル (日本語版)](https://hasura.io/learn/ja/graphql/hasura/introduction/)
+- [Hasura GraphQL API サーバーを Heroku に構築後、Auth0 で権限認証 - YouTube](https://www.youtube.com/watch?v=nxnn_VhfoQM)
+
+---
+
+## ![h:0.8em][github.svg] フィードバック
+
+[このスライドを編集する](https://github.com/kou029w/intro-to-hasura/edit/main/README.md) / [問題を報告する](https://github.com/kou029w/intro-to-hasura/issues/new)
+
+[github.svg]: https://cdnjs.cloudflare.com/ajax/libs/simple-icons/5.7.0/github.svg