TECH::EXPERT7週目を振り返る - TECH::EXPERTでWebエンジニアを目指す

f:id:yuuma_pg:20190604132811p:plain

今週はチーム開発の１週目でした。

今週の学習内容を振り返ってみましょう。

今週の学習時間
今週の学習内容
- チーム開発
初めてのスプリントレビューを終えて
終わりに

今週の学習時間

今週の学習時間は以下の通りです。（合計70時間）

5/25（土）9時間
5/26（日）9時間
5/27（月）11時間
5/28（火）8時間　
5/29（水）11時間　
5/30（木) 11時間
5/31（金）11時間

今週は休みを取らなかったので、ちょっと疲れてます。（休みたい・・・）

今週の学習内容

チーム開発

今週からチーム開発が始まり、５人のメンバーでメルカリのコピーサイトを作っています。役割分担をして開発を進めており、今週僕が担当したのは以下の通りです。

DB設計（チーム全員）
本番環境へのデプロイ
ユーザーマイページのフロント作成

DB設計

何かを開発するときにまず考えなければいけないのがDB設計です。どの機能があってどの機能が実行されたときにどのコントローラーが動きどこのモデルにデータが保存されるか、などアプリの根幹になるものです。

メルカリのDB設計は今まで学習してきたDB設計よりもはるかに複雑そうなので担当を決めて考えるのではなく全員で考えることにしました。

DB設計を始めてみると予想以上に難しく、チーム開発初日は全員でこれでもかというほど話し合い丸1日かかってはしまいましたがなんとか決めることができました。

他の期の人の話を聞くと、DB設計に１週間ほどかかったところもあるようです。そう考えると割と早く決めることができたのかなと思います。

本番環境へのデプロイ

DB設計が終わったら次にやることはHamlとScssを使ってページの見た目部分を作ることです。

作ったページは１週間ごとのスプリントレビューでメンターさんに実際にサイトを見てレビューをしてもらうのですが、本番環境で動いているものしかレビューしてもらえません。

つまり、１週間（厳密には6日）で本番環境にデプロイする必要があり、デプロイできなければ作ったページはレビューしてもらえません。

この超責任重大なデプロイが僕の担当でした。

基本的には応用学習の時のデプロイ手順で進めればいいのですが、2箇所違う部分がありました。

１つ目は、カリキュラムではRailsのバージョンが5.0だったのに対し、今回は5.2だったことです。

このバージョンの差によって本番環境へのデプロイ手順が少しだけ変わります。

Rails 5.0では他の人に公開したくない情報（AWSの認証鍵など）はsecrets.ymlというファイルに保存するようにしますが、Rails 5.2ではcredentials.yml.encとmaster.keyという組み合わせになっており、少しデプロイ方法を考慮する必要があります。

僕は以下の記事を参考にしました。

qiita.com

デプロイする前までは、なんで変えたんだ・・・

と思っていましたが、基本的にやっていることは同じですし、仕組みを理解してみるとこっちの方が自然な方法なのかなぁと思います。

２つ目は、Basic認証が必要だったことです。

メルカリのコピーサイトを作っているわけですから、なんの許可も取らずに公開してはいけません。なので、知っている人にだけページを開けるように認証機能が必要であり、それがBasic認証です。

Basic認証では、初めてページを開いたときにユーザー名とパスワードの入力欄がアラートとして表示され、認証できた場合にのみページを表示する仕組みです。

Basic認証の導入自体は簡単なのですが、Capistranoで自動デプロイする場合は注意が必要です。認証のためのユーザー名とパスワードは環境変数として本番環境に保存しているのですが、その環境変数を有効にするためにはCapistranoの設定ファイルに明示的に変数を記述する必要があります。

これはカリキュラムの中に書いてあるのでそのまま書けばいいのですが、Qiitaの記事とかでは少し違った書き方が多かったのでメモ。

環境変数の中身は本番環境の

/etc/environment

あるいは

~/.bash_profile

に書けばいいと思います。

そして、deproy.rbのなかで以下のように記述しています。

# これより上は省略

set :default_env, {
  BASIC_AUTH_USER: ENV["BASIC_AUTH_USER"],
  BASIC_AUTH_PASSWORD: ENV["BASIC_AUTH_PASSWORD"]
}

ユーザーマイページのフロント作成

僕が作ったのはユーザーマイページとユーザーアイコンをクリックしたときに遷移するプロフィールページです。

左がユーザーマイページ。右がプロフィールページです。

f:id:yuuma_pg:20190604150022p:plain f:id:yuuma_pg:20190604150100p:plain

f:id:yuuma_pg:20190604150028p:plain f:id:yuuma_pg:20190604150104p:plain

フロント部分はhamlとscssで作らなければならないのですが、僕は個人アプリをhtmlとcssで作っていたので、最初に慣れるのに時間がかかってしまいました。

結局このフロントを作るのに丸2日間かかってしまいました。

hamlを調べている間に知ったのですが、hamlの他にもslimという書き方があるようです。slimはhamlをさらにシンプルにしたもので、タグの前に%がいらない、などの特徴があるようです。

シェア的にはhamlの方が普及しているようですが、時間があれば使ってみたいと思っています。

初めてのスプリントレビューを終えて

当初はスプリントレビューまでに全てのフロント部分を終える予定でしたが、全体の８割ぐらいの進捗でスプリントレビューを迎えました。

少し遅いかな〜と個人的に感じていたのですが、メンターさんにいいペースと評価をもらうことができました。

とはいえ、僕の期は全体的にペースが良いらしく、他の期に比べれば良いかもしれませんが同じ期の中で比べたらそんなに変わらないと思っています。

一応スクラムマスターなのでチーム開発を良い結果にしたいと考えており、そのためには他のチームよりも早いペースで進めるべきなのかなと思っています。早いペースで進めるには開発時間を多めに割くことが１番に考えられますが、朝早く教室に来る、などのルールは決めていません。強制してしまうとチーム開発が辛く感じてしまうと思ったからです。

その代わり、メンバーがエラーに引っかかった時に一緒に考えいち早くエラーを解決できるように心がけています。開発を進める上で一番時間がかかるのはエラーの解決と言われており、この時間を短縮するのも開発時間を多く割くための一つの方法なのかなと思っています。