副業として業務委託として参画しているプロジェクト
# 【業務内容】
- Rails のモノリシックなアプリケーションでの新規機能開発
- 要件定義・基本設計・詳細設計・実装(rspec を用いたテストコード含む)・QA まで一気通貫で担当
## 担当機能
- サイトトップ LP( https://foovest.com/ )(コーディング)
- 新規製造リクエスト機能(一般的な CRUD 機能)
- オペレータ用管理画面(一般的な CRUD 機能)
## 使用技術
- バックエンド
- Ruby(v3.0.0) / Rails(v6.0.\*)
- フロントエンド
- jQuery (v3.5.1)
- DB
- PostgreSQL
- インフラ
- Heroku
## チーム構成
- PdM兼PjM(IT未経験): 1
- デザイナー: 1
- バックエンド: 1
- フロントエンド: 1
### 自分の担当
最初は、フロントエンド担当としての参画だった。担当領域は、マークアップのコーディングと、バックエンドとのつなぎこみ(アクションから渡されたデータの表示・decorator実装など)である。エンジニアは自分ともう1人の2人体制で、当初より相互レビューによりバックエンド機能もレビュワーとして関わった。β版リリース後の追加機能実装からはバックエンド機能開発にも携わるようになり、現在ではプロダクト開発の全ての領域を任されている。
# 【成果・学び】
自身の出身である食品業界の購買担当者向けプロダクト。ドメイン知識を生かして仕様策定段階から深く関わることができ、プロダクト開発におけるドメイン知識の必要性を強く感じた。ドメイン知識があることで、仕様やデザインに対して「ユーザー目線」での改善提案ができている。さらに、ユーザー目線でそれぞれの機能の必要性・重要性が分かるので、工数かけてフル実装するべきか・一部機能を絞って開発するべきか・今は開発しないべきか、という選択を適切に行うことができている。エンジニア 2 人でのチーム開発であったので、要件定義〜リリースまでの全工程を担当し、開発者としてのスキルも大きく飛躍できた。
本業のフォトラクションでは、エンジニアリングマネージャーとして働いており、業務内でコードを書く機会はかなり減ってしまった。エンジニア歴 2 年ほどで、まだまだスキルも伸ばしていきたいフェーズであったので、本業以外の時間で副業や個人開発を通じてキャッチアップをしている。
もう一人のエンジニア(バックエンド歴 15 年)との相互レビュー体制によって、本プロジェクト参画前までは未経験だった Rails を用いた開発も、経験 1 年ほどで小規模システムなら一通り rspec でのテストも含めて一人で実装できるようになった。適切なレビューを受けると飛躍的にスキルが伸びると実感できた。
また、ドメイン知識がプロダクト開発においてどれだけ重要かということを本業のフォトラクション(建設業界向けプロダクト)との比較でより感じる。FOOVEST は自身が食品業界にいた当時、まさにユーザーになり得たサービス。業界・ユーザーのことに精通しているので、適切に要件やデザインに対して指摘ができ、建設的な議論が行えている。「いかにドメイン知識が大切か」を身をもって体感できたことは、本業へもいい影響を与えている。
# 工夫したこと
## フロントエンドのリンター(ESLint, StyleLint, Prettier)をCIに組み込み、レビューコスト削減
当初フロントエンドのリンターはPJ内に存在せず、手動でインデント修正やレビューでの指摘を行なっていた(バックエンドはrubocopが入っていた)。実装者・レビュー者ともにムダが大きいので、ESLint, StyleLint, Prettier をプロジェクト内およびGithubActionsのCIに組み込み、フロントエンドの実装およびレビューコストを下げつつ、実装者による差異をなくすことに成功した。
## 実装前に設計を行い、手戻りによるムダ削減
本PJに参画するまで、バックエンド開発のチーム開発は未経験であった(個人での受託開発経験はあり)。その経験値の無さゆえ、最初は「PRレビュー時に設計レベルの指摘を受け、大幅に作り直しが必要になる手戻りが発生する」という失敗をしてしまった。
恥ずかしながら、この時は「実装前に設計を行う」という発想がなく、いきなり実装に入っていた。
それ以降は、実装前に設計方針のすりあわせを行ったのち、設計のレビュー(ルーティング・アクション・サービスクラスなど各階層でどんな処理を行うかのざっくりとした流れ)をしてもらってから実装に入るよう進め方を変更。
設計→実装というあるべき進め方をとることで、「PRレビュー時に設計レベルの指摘を受ける」ということがなくなり、手戻りによるムダが削減できた。
## ScssでBootstrap風のオリジナルクラスを作成し、コーディング時間削減
スピーディーな開発を行うため、CSSフレームワークにBootstrapを採用している。デザインをBootstrapのコンポーネントスタイルに寄せてはいるが、Bootstrapではカバーしきれない部分があり、一部オリジナルのスタイリングをせざるを得ないものもある。
その中でも、使用頻度の高いfont-sizeやborder-radiusについてはBootstrapのソースコードを参考にBootstrap風のクラスを作成することで、コーディング時間を削減することができた(例:font-size-sm-18 で、568px以上のときfont-size:18px など)。
独自のコーディング規約は今後人が増えたときの参入障壁になるので、ドキュメント化も行っている。