ApolloServer/Clientのフルスタックチュートリアルやった

最近はGraphQLの時代!!!!! ということでApolloGraphQLのフルスタックチュートリアルをやりました。

www.apollographql.com

構造自体は1-4まではApolloServer側の話で、6-9がApolloClient側の話。 ServerからやっているとGraphQLサーバーの実装から出来てお得という感じ。

例題としてはSpaceXの無料APIをApolloServer側でラップしてGraphQLにして返すのがファーストステップとなっている。

github.com

その後はミューテーションとしてログインや宇宙旅行の予約をServerで実装する。 テストはApollo StudioっぽいGUIの画面で実際にQueryやMutationが返ってきているかを確認する感じ。 リポジトリの雛形実装はPureなJavaScriptだったので、定期的にフィールドの大文字小文字をミスって時間が溶けそうになるなどがあった。 ここだけ別言語で実装してみてもいいかもしれない。

6移行はApolloClientのチュートリアルで、TypeScriptとReactを使っていい感じに宇宙旅行のwebサイトを作っていく。 とはいえあくまでApolloClientのチュートリアルなので、各種componentはすでに実装されているものを使っていく感じ。 componentを作る感じは別のチュートリアル/書籍をやれという感じだけど、ApolloClientで共通した処理の書き方や、Query、Fragmentの書き方などがわかった。

特にPagination関連の実装は自分で手を動かしてみると処理の雰囲気がなんとなく理解できてきて良かった。 ClientだとfetchMore受け取ってcursorいじって再度リクエストするのはなるほどねーとなっていた。

とはいえかなりコンポーネント関係お膳立てされているので素朴にアプリケーション組んでみたほうが良さそうな気がする。 アプリケーション自分で書く前の助走としてはいい感じに出来たかな。また見返したい。