React, GraphQL, SpringBootを使ってテニスの大会ページを作ってみた
概要
初めてのはてなブログ記事!緊張する!!
ここ4ヶ月くらい仕事ではエクセルエンジニアとしてお絵描きばっかりしてたんで、これじゃまずいと思い仕事終わってから黙々とプログラムのお勉強を続けてました。
とりあえず動くものが出来て嬉しいので記事書いてみる!
具体的に使用したツールやミドルウェアはこんな感じ。
作ったページ
実際に作ったのは以下2ページ。
ページのアクションに応じてAPIが呼び出されて、DBのCRUD操作が行われ、レスポンスに応じて再描画って感じ。
- 大会一覧表示ページ
- 大会申し込みページ
これから書いていく記事
概要の絵に記載したツールを以下区分けでそれぞれ記事を書いていこうと思う。
基本的には自分のメモだが、これらの技術をでなにか作ってみたい人の勉強きっかけになれば嬉しいなとも思ったりしてる。
(結構いっぱいになってしまった。。。書けなかったらすんません)
- バックエンド開発
- フロントエンド
- 開発環境の作成
- アプリケーション開発
- ReactのUI部分だけ作成(Routing含む)
- ApolloでReactからGraphQLのQueryとMutationしてみる
- Reduxでstate管理
- Material-UIでおしゃれな雰囲気のページ作成
- 本番環境検討
まとめ
「AWS ECSでDocker環境そのまま動かす」とか「GraphQLでページ表示時にMutation実施」とか、結構挫折して出来なかったこともたくさんあるが、とりあえず動くものを作るという観点では参考になるものが出来たので、そのとおりソース作れば動きますよってな記事にしていきたい。