フリーランスエンジニアを目指してプログラミングスクール「TECH:EXPERT」に通ってみた(最終課題編)(9日目〜19日目)
こんにちは、かとたくです。
今回も最終課題の「メルカリ」のコピーサイトの作成をやっていきます!
元号が変わりましたが、相変わらずやることは変わらないのでひたすら作業します。
開発メンバーが2人しかいませんができるところまで精一杯頑張りますので、最後まで読んでいただけると嬉しいです。
令和初日となった5/1にやったことは以下の通り。
・ログイン画面の設計
今までdeviseというGemでログインや新規登録画面を作っていましたが、ここにきて疑問に思ったのが、どこでCSSを作っているのかということ。BootstrapというGemを使うという選択肢もありましたが、今回はそのまま本家のメルカリを見ながらCSSを作る方針でいきます。
ものすごい時間はかかりますが、地道に進めることが重要なので頑張ります。
5/2にやったことは以下の通り。
・ログイン画面の設計
・パスワードリセット画面の設計
いずれもなんとか完成させることができました。ビューファイルだけなのでサーバーサイドは今後改善していく必要がありますが、deviseをインストールしているので大幅な変更はないと思います。余裕があったらFacebook・Google・ロボット認証は導入したいところですね。
5/3にやったことは以下の通り。
・新規登録画面の設計
ここで痛恨のミスをやらかしました・・・。というのもUserテーブルに項目を追加しようとしてカラムを追加したらエラーになったので、安易にマイグレーションファイルを消した状態で実行してしまったので新たにテーブルが追加できないという事態になりました。幸いなんとかなったのですが、railsアプリの開発ではマイグレーションファイルは絶対に消さないようにしましょう!
5/4にやったことは以下の通り。
・ポートフォリオサイトの作成
開発メンバーの相方の人がいなかったので、ポートフォリオサイトの作成を行いました!といってもテンプレートをダウンロードして、これまでの経歴や学習してきたこと、見た目をいじったりと割と遊び心も交えて作っていました。メルカリのコピーサイトができていないのでそこは後回しですが、完成次第Twitterかどこかにリンクを貼っておきます!
5/5にやったことは以下の通り。
・新規登録画面の設計
メルカリの場合、登録完了画面も含めると複数回遷移する必要があって面倒だったので、1つの画面に全てのユーザー情報を格納できるように簡略化しました。
完成したらTwitterなどでもアップするので、本家と比べてみてください!
5/6にやったことは以下の通り。
・新規登録画面の設計
大まかな画面のデザインを完成させることができて安心しました。とは言え、このままだと必須項目も空の状態で遷移されてしまうので、そこを修正していきます。
5/7にやったことは以下の通り。
・新規登録画面(サーバーサイド)
とりあえず、値がデータベースに入るところまでは完成しました。しかし、バリデーションがないのでこのままだと必須項目が空の状態でも通過してしまうので、バリデーションも追加して行きます。
5/8にやったことは以下の通り。
・新規登録画面(サーバーサイド)
バリデーションはある程度(空の時、全角カナのみなど)出来上がってきました。ただ、デフォルトのdeviseだと、エラーメッセージを表示する際にビューも崩れるので、そこをなんとかしていこうと思います。
5/9にやったことは以下の通り。
・新規登録画面(サーバーサイド)
バリデーションの数があまりにも多いので、空白のみ・空白かつ数字のみ・空白かつ全角かなのみといったパターン毎に分類しました。
サンプルはこんな感じ。
with_options presence: true do
validates :nickname
validates :family_name
validates :last_name
validates :birthday
end
5/10にやったことは以下の通り。
・新規登録画面(サーバーサイド)
・ログアウト機能
新規登録画面の実装で、一つ指摘されたのが、マイグレーションファイルの数がかさんで管理が難しくなっていることがありました。情報が少なかったものの、Qiitaにいい記事があったので、アプリ開発に悩んでいる人はぜひ試してみてください。
https://qiita.com/devnokiyo/items/b4233b91ce94ccaa6903https://qiita.com/devnokiyo/items/b4233b91ce94ccaa6903
最終課題発表会まであとわずかで、かなり大変な状態ですが、完成したらポートフォリオサイトとともにお見せできるように頑張ります!
最後までご購読していただきありがとうございました!
また次回も読んでいただけると嬉しいです!!