CLASS101 Clone Coding Project

紹介の前に

現在、私が所属しているwecodeでは自分が好きなウェブサイトをclone codingするプロジェクトを行っています。clone codingというと、「サイトをそのままコピペするのでは？」思われるかもしれませんが、それとは違います。
コピペすることは一切なく、フロントエンドもバックエンドもサイトを分析し、必要な機能やレイアウトを一から作り出します。既存のウェブサイトをcloneする理由は、２週間という期間で企画・デザインまで全く新しいサイトを作るのは容易ではなく、コーディング技術を磨くブートキャンプの目的とも適さないからです。

プロジェクト紹介

今回のプロジェクトで作ったのは、韓国のオンラインクラスサービスであるCLASS101です。このサイトを選んだ理由は、クラスの種類や数が多くデータの処理を勉強したかったことと、前回のプロジェクトでできなかった掲示板システムやいいね機能を実装してみたかったからです。

開発期間📆

2020/11/2 ~ 2020/11/13(約２週間)

使用技術⚙️

Python
Django
MySQL
AWS(RDS, S3, EC2)
Redis
Docker
AQueryTool
postman

Communication Tools📫

Github
Slack
Trello

役割および実装API💻

今回、プロジェクトはフロントエンド4名、バックエンド2名で構成されました。私は主に商品（クラス）関係のAPIを作成しました。

実装機能

1. 商品のメインページやカテゴリー別ページ　API
2. 商品詳細ページ API
3. 詳細ページのコミュニティページでの書き込み・画像アップロード　API
4. 商品検索およびカテゴリー別・整列 API
5. 商品注文ページ API
6. 商品決済前の本人確認のためのsms認証 API（外部API使用）

バックエンドとの共同作業🙏

前回のプロジェクトではバックエンドが自分だけだったので、全て自分で計画を立ててこなしていけばよかったですが、今回はバックエンドとの共同作業もあり、意見の調整や話し合う時間などで進捗は前回より少し遅いと感じました。しかし、仕事を分担している以上、情報共有は欠かせないためその時間は決して無意味な時間ではありませんでした。
わからないことがあれば相談して一緒に答えを見つけたり、相手のコードから新しい知識を学んだりなど、とても良い経験でした。

できたと思う点🥇

今回のプロジェクトでは新しい技術をたくさん取り入れて作業しました。例えば、boto3を使って画像をAWSのS3にアップロードしたことや、Redisを使ってデータベースを直接ヒットせずキャッシュメモリーにあらかじめ保存していたデータを素早く持ってきたりなど、新しい技術を思う存分、試すことができました。
また、作成したすべてのAPIにunit testを加えることができました。

改善が必要な点📉

今回も改善すべき点がいくつかありました。

1. Git, Githubの使い方

前回もそうでしたが、今回もGithubの使い方で様々なトラブルに遭いました。特に今回はcommit数を圧縮できるgit rebaseを使ってＰＲを行いました。たしかに最後のcommit数は1に固定されてきれいに見えますが、コンフリクト数はそれに反比例して増えていきました。
2~3コミットしてから必ずrebaseするようにしましたが、コンフリクトはどうしても避けられませんでした。

2. Unit Test

前回と違い、今回はunit testも併せて実施しながらAPIを作成しました。そのため、テスト作成に使う時間が長くなり、一時的にAPIが間に合わずフロントエンドを待たせてしまいました。
テストに慣れてないこともあって、テストに失敗したらその原因を探すのに時間がかかったり、外部APIを使用した場合のテスト方法探しに時間がかかるなど、なかなかAPI作成が進まない原因でもありました。

3. Docker

前回はEC2を使ってその中に仮想環境を作りその中でセッティングをしてから配布を行いました。今回はDockerを利用してサーバーを配布してみました。いちいち環境を設定する必要なく、コンテナーとイメージだけ作っておけばそれをpullしてすぐに配布ができるというとても便利な技術でした。
ただ今回のDocker授業がプロジェクトの期限間近にあったので、ちゃんと配布ができず、Redisサーバーとの接続も調べる時間がなかったこともあって一部だけつなげたのはとても残念でした。

残しておきたいコード

1. DjangoのORM活用

前回もselect_related, prefetch_relatedを使いましたが、それが実際どれくらい効果があるのかはわからず使っていました。今回のプロジェクトではログを表示するように設定し、viewが呼び出される際に何回データベースをSELECTでヒットするかが確認できるようになりました。
そしてゆるくselect_relatedやprefetch_relatedを使っていたら何回も重複してqueryを飛ばすのを見て驚きました。そしてもっと細かく関係するテーブルを入れて、時間を測ってみたら2.7秒→0.7秒に減ったのが確認できて、効率を上げるためのselect_related, prefetch_relatedの重要性を身をもって感じました。

2. Redis

Redisはインメモリ型のデータベースのため、ハードディスクより早くデータを持ってくることができます。今回のプロジェクトは商品の数も多く、呼び出すデータ量も大きかったため、メインページのローディングにかなり時間がかかりました。（約4~5秒）遅いローディングスピードはユーザーがサイトから離れる理由でもあるので、この問題を解決すべくRedis＆django-redisを使用しました。
おかげで、メインページに入ったら瞬時に商品リストが出て、スクロールもスムーズに動くようになりました。

まとめ

一度プロジェクトをやったことがあるため、2回目は大したことないと思っていましたが、新しい技術やunit test、そして体力的にも精神的にも限界だったため、思ったよりも進まないことが多かったです。
ですが、使ってみたかった技術を使うことができて、unit testもすべてのメソッドに適用することができたので、満足しています。
ただ、Dockerでの配布や実装できなかった機能もまだたくさんあるので、今後も勉強を怠らずもっと効率的なコードが書けるようにがんばんっていきたいです。