忘備録とマイルストーン

WEBエンジニアを目指す20代男性の奮闘記

プログラミング初心者がWEBサービスを作ってみる―アプリ開発編①

前回の投稿からずいぶん日が経ってしまったが、決して進展がなかったわけではない。ずいぶん仕事関係で忙しくなってしまったのと、インフルエンザで倒れてしまったのとでブログに費やせる時間がなくなってしまった、というわけである。(空いた時間はサービス作成にあてていたのでなおさら)

長かったサイト設計にようやくめどが立ち、いよいよ実際のアプリ開発に入ることになった。ここ最近DB図とにらめっこばかりしていたせいで、Railsの方が若干おろそかになってしまっている。チュートリアルRailsガイド、『基礎RUBY ON RAILS』を頼りになんとか頑張っていこう。

 

 

サイト設計の確認

前回とことんシンプルにしたER図だが、確実にできる範囲で実装を広げてみた。それでもテーブルはわずか10個、実際表示するのはたった3ページという簡素さである。

f:id:sante51:20190212142925p:plain

Database v0.1

一応(実装したい)全機能を備えた完全版のER図もあるが、見ているとMVPを忘れそうになってくるのでアプリ開発が一段落してからまたお披露目したいものだ。(不自然な空白があるのは完全版のなごり)

とりあえずこのバージョンをver.0.1として、まずは早いところ完成させてしまいたい。

 

リクエストとレスポンスの確認

どうも僕はブラウザから何が見えているか?でWEBアプリの構造を考えてしまう癖があるようだ。そのためRoutingをどう振り分けるべきか、Controllerに何のアクションを備えるべきかを度々見失ってしまう。ここでブラウザ・WEBアプリのリクエストとレスポンスを整理しながら、実際WEBアプリ内でどのようにDBとのやりとりが行われているかを順に書き起こしてみよう。

①トップページにアクセス

リクエスト:/ GET→C:toppages#index ⇔ V:toppages/index → レスポンス(html)

モデルはないのでこのまま。toppages/indexには②で必要な試合詳細画面へのリンクを貼る。

②試合詳細画面にアクセス

リクエスト:lineups// GET → C:lineups#show ⇔ M:Lineup → C:lineups#show ⇔  V:lineups/show → レスポンス(html) 

showはわかりやすい。Cは指定されたリソースをMとやりとりし、インスタンス変数(@のやつ)として保存し、Vに渡す。

③でmatch_rating POSTがリクエストされるので、V:lineups/showにあらかじめ@match_ratingを用意しておく必要がある。

③選手採点を入力、送信

リクエスト:match_rating POST → C:match_ratings#create ⇔ M:MatchRating)→ C:match_ratings#create ⇔ V:作成の可否で分岐(match_ratings/show, lineups/show) → レスポンス(html)

paramsで送られてきた情報を、②で用意していた@match_ratingに入れてやる。さらにこの@match_ratingをMに渡し、DBに挿入してもらう。この一連の流れが成功すればmatch_ratings、失敗すればlineups/showのVを選択するよう設定しておく。

④選手採点詳細画面にアクセス

リクエスト:match_ratings// GET → C:match_ratings#show ⇔ M:MatchRating → C:match_ratings#show ⇔ V:match_ratings/show → レスポンス(html)

流れは②と一緒。特に問題なさそう。

 

やるべきことをTo-doリストにする

やるべきことを忘れないよう、おなじみTrelloを使ってタスク管理をしていく。こうしてみるとやるべきことがはっきり分かっていい感じだ。(それでもミスは多発しているが)  

困った時の検索リスト

基本的にはRailsガイドとRailsドキュメントを使い分けている。これでも理解できない or 詳しすぎてよくわからん状態になったらQiitaなり個人ブログなりを探す。

過程ごとにわからない箇所があればこっち。

railsguides.jp

 メソッド名等から検索したいときはこっち。

railsdoc.com

それからHTTPリクエストの詳細をChromeデベロッパーツールから見られるようなのでここでしっかり方法を整理。以下のサイトを参考にした。

www.tsukimi.net

 

次回予告

意気揚々と漕ぎ出したはいいが、さっそく暗礁にのりあげてしまったアプリ開発。このままのペースだと、インフルのせいで頓挫しているスケジュールは果たして役目を果たしてくれるのだろうか。混沌のアプリ開発編②に続く。