ID:82083さん

## 受注受付サイト｜新規開発（Laravel × React） ### プロジェクト概要 リース会社が利用する受注受付サイトの新規開発案件に参画。 管理者向け画面として、商品情報の一覧・登録・編集、カテゴリー管理、商品一括アップロード機能などの開発を担当。 ### チーム体制 開発メンバー8名（自分は実装メンバーとして、詳細設計〜実装・テストまでを担当） ### 開発・実装内容①：商品・カテゴリー管理機能 #### 概要 リース商品を管理するための基本機能として、商品およびカテゴリー情報の管理画面を新規開発。 #### どのような機能の開発・実装か - 商品一覧／商品詳細／商品登録・編集画面の実装 - カテゴリー一覧/登録/編集の実装 - React + TypeScript + Inertia を用いた管理画面の構築 - Laravel によるデータ登録・更新処理の実装 #### 課題・問題点 - React を実務で使用するのが初めてであり、コンポーネント設計やライフサイクルの理解が必要だった - 新規開発案件のため、キャッチアップと並行して実装を進める必要があり、短期間での理解とアウトプットが求められた #### 打ち手・使用した技術 - React の公式ドキュメントや技術記事を参照しながら、基本的なコンポーネント構成や useEffect を用いたデータ取得処理を理解・実装 - Laravel + Inertia 構成を前提に、バックエンドとのデータ連携を意識した実装を行った - 実装中に得た知見を都度整理し、設計書やコード上で再利用しやすい形に落とし込んだ #### 成果 - 実務未経験の技術であってもキャッチアップしながら実装を完遂し、自信に繋がった - 新規技術に対しても自走して対応できることを示し、以降の画面改修や追加対応も任されるようになった ### 開発・実装内容②：商品一括アップロード機能 #### 概要 管理者が商品情報および商品画像を効率的に登録・更新できるよう、 用途の異なる2種類の商品アップロード機能を設計・実装。 ### 開発・実装内容②-A：CSV＋画像一括アップロード機能 #### どのような機能の開発・実装か - CSV ファイルに商品情報を記載し、商品ごとに紐づく画像を最大4枚まで登録・更新できる機能を実装 - CSV の列番号を画像ファイル名に含めることで、CSV と画像を紐付け - CSV と画像ファイルを zip にまとめてアップロードする一括登録機能を実装 #### 課題・問題点 - 商品画像を Amazon S3 に保存していたため、DB トランザクションと外部サービス（S3）間で完全な整合性を担保することが難しかった - DB 側でエラーが発生した場合でも、S3 に画像が保存されたまま残ってしまう可能性があり、 データ不整合が発生する懸念があった #### 打ち手・使用した技術 - S3 へのアップロード時に、一時的なバックアップ領域を設ける設計とした - DB 登録処理が正常に完了したことを確認した後に、本保存領域へ移動するフローを実装 #### 成果 - 外部サービスを利用する構成においても、データ整合性を意識した安全な登録フローを実現 - 運用時のデータ不整合や不要ファイルの蓄積を防ぎ、安定した運用に貢献 ### 開発・実装内容②-B：画像アップロード（登録・更新）機能 #### どのような機能の開発・実装か - 商品情報に紐づく画像を最大4枚までアップロードし、登録・更新できる機能を実装 - 既存商品に対する画像の追加・差し替えにも対応 #### 課題・問題点 - 画像登録・更新時にも同様に、S3 と DB 間の整合性を保つ必要があった #### 打ち手・使用した技術 - 一括アップロード機能と同様のフローを適用し、S3 側のバックアップを活用した安全な更新処理を実装 - 最大枚数制限やファイル形式チェックなどのバリデーションを実装 #### 成果 - 登録・更新時のトラブルを防止し、運用面での信頼性を向上