shorterql - Speaker Deck

Slide 1

Slide 1 text

shorterql 2018/11/3

Slide 2

Slide 2 text

- soeyu - 3年 - Zli サークル - 趣味: 深夜ラジオ(bananamoon) github 2 introduction

Slide 3

Slide 3 text

3 shorterql ?

Slide 4

Slide 4 text

4 url shortener + graphql api

Slide 5

Slide 5 text

5 url shortener + graphql api

Slide 6

Slide 6 text

6 url shortener 6 短縮URL（たんしゅくユーアールエル）とは、長い文字列のURLを短くしたものである。リダイレクトを利用して本来の長いURLに接続する。 (wiki) - goo.gl ( 3月で終了) - Firebase Dynamic Links (FDL) - Ow.ly - Bitly https://goo.gl/bQkBfu https://github.com/poccariswet/shorterql

Slide 7

Slide 7 text

7 Using url shortener 7 - URL の共有 - SNSの文字列制限 - bot等のメッセージフォーマットが崩れないように - サービスの終了に伴い、短縮URLと元となるURLの結びつきがなくなり、リンク切れになる可能性 - ドメインカスタムされたURLができないデメリット最近のハロウィーン回 ” 2018年10月26日(金) ”

Slide 8

Slide 8 text

8 と言ったのが url shortener です

Slide 9

Slide 9 text

9 url shortener + graphql api

Slide 10

Slide 10 text

10 url shortener + graphql api

Slide 11

Slide 11 text

11 GraphQL 11 - クライアント・サーバ間 API用のクエリ言語でありランタイム - クライアントがサーバーからデータを取得,変更,購読できるようにするためのデータ言語 - リアルタイム処理が可能(購読[サブスクリプション]) - REST API との違い (https://www.slideshare.net/keisuketsukagoshi/rest-api-graphql) ref ● https://graphql.org/ 「チャーハン握り一番早く食べられるのは？！の回」 ” 2018年9月21日(金) ”

Slide 12

Slide 12 text

12 GraphQL 3種類のオペレーションタイプ 12 Query 取得 Mutation 更新 Subscription 購読「口笛を頑張る日村さん」 ” 2018年9月14日(金) ”

Slide 13

Slide 13 text

13 GraphQL メリット 13 - クライアントが欲しい情報だけをqueryで指定することが可能 query request response https://developer.github.com/v4/explorer/ - ドキュメント生成が楽 - 一回のリクエストで深い階層のデータまで取得可能 example スキーマ定義

Slide 14

Slide 14 text

14 GraphQL どーゆーときに使う？ 14 https://aws.amazon.com/jp/campaigns/manga/vol4-3/

Slide 15

Slide 15 text

15 以上が graphqlと url shortenerです

Slide 16

Slide 16 text

16 url shortener + graphql api = shorterql

Slide 17

Slide 17 text

17 実装までの経緯 - url shortener: 夏のインターンで実際に調べたり、利用する機会があってロジック等が気になったので、作ってみたくなった - GraphQL: 単に興味があって今回で知見を得体のと使ってみたかった 17 「オススメのお菓子を求めて！の回」 ” 2018年9月28日(金) ”

Slide 18

Slide 18 text

- LongURL をPostする - ShortURLを生成し、responseする 18 主な機能 18 「オススメのお菓子を求めて！の回」 ” 2018年9月28日(金) ” - ShortURLを作る際に生成された hash値をIDに ShortURLの情報をgetできる実装言語: go

Slide 19

Slide 19 text

19 実装 19 ● Redis storage ● Create Hash ● Redirect handler ● GraphQL handler 「日村＆オークラを笑わせろ！2018 Summer！」 ” 2018年8月31日(金) ”

Slide 20

Slide 20 text

20 Redis Storage 20

Slide 21

Slide 21 text

21 Create hash 21 ● uuid ○ 一意の値を生成 ○ https://github.com/google/uuid

Slide 22

Slide 22 text

22 Redirect handler 22

Slide 23

Slide 23 text

23 GraphQL handler 23 - request body から query の取得 - そのqueryを実行する関数へ飛ばす - 実行して得たresultをエンコードして出力

Slide 24

Slide 24 text

24 GraphQL 3種類のオペレーションタイプ 24 Query 取得 Mutation 更新 Subscription 購読「口笛を頑張る日村さん」 ” 2018年9月14日(金) ”

Slide 25

Slide 25 text

25 GraphQL handler 25 Query (取得)

Slide 26

Slide 26 text

26 GraphQL handler 26 request response

Slide 27

Slide 27 text

27 GraphQL handler 27 Mutation (更新)

Slide 28

Slide 28 text

28 GraphQL handler 28 request response

Slide 29

Slide 29 text

29 まとめ 29 - 短いhash値を作るのがちょっと大変 (id(1...n) を生成してbase62 encodeすればいい？) - 公式リファレンスにGraphQLのexampleやチュートリアルがにあるのでとっつきやすかった - 個人的にこれからサービスを作ろうと思っているので、それに graphql の apiを取り入れていければいいなと思った。「設楽流、さくらんぼの種のかっこいい出し方！回」 ” 2018年6月1日(金) ”

Slide 30

Slide 30 text

30 最後に 30 - graphql チートシート (https://devhints.io/graphql) - Web app graphql (https://wehavefaces.net/learn-golang-graphql-relay-1-e59ea 174a902) - Github graphql client (https://developer.github.com/v4/explorer/) - Bananamoon picture ref - (https://www.tbsradio.jp/banana/)

Slide 31

Slide 31 text

“ ご静聴ありがとうございました。 31