ID:82392さん

## プロジェクト概要 製造業の脱炭素経営支援を目的に、CO₂排出量の計算効率化と管理を実現する業務システムを設計・開発しました。 ## 役割・体制 ### 自身のポジションと役割 - フロントエンドを中心に、一部バックエンドの設計・実装・テストを担当し、機能要望の具体化からリリースまで一貫して対応しました。 - 顧客とのコミュニケーションを通じて要件の整理を行い、タスク管理や進捗調整も担当してプロジェクトの円滑な進行を支援しました。 ### チーム規模と構成 - エンドクライアント5名、委託元エンジニア3名、自社エンジニア3名、PM1名、テックリード1名の合計約13名のチーム体制で推進しました。 - 複数拠点間のリモートコラボレーションも含む分散チームで、アジャイル寄りの柔軟な開発体制をとっていました。 ## 背景・課題 - 製造業界の脱炭素化推進に伴い、CO₂排出量を正確かつ効率的に計算・管理可能なシステムが求められていました。 - 顧客の要望が不明確で具体化が難しく、仕様の曖昧さが設計フェーズにおける大きな課題でした。 - プロジェクトメンバーの頻繁な入れ替わりにより、仕様やルールが個人の頭の中にしかなく、情報の共有不足が進捗や品質に影響していました。 ## 実際の取り組み ### 開発環境 - フロントエンドはTypeScript、JavaScript、Next.js、Chakra UIを用い、直感的で操作性の高いUIを構築しました。 - バックエンドにはPostgreSQLを採用し、Prismaでデータベース操作の効率化を図りました。 - Visual Studio Codeを開発環境として使用し、Microsoft Azure上にシステムをデプロイしました。 - ReactFlowやTanStackTableを活用し、複雑なデータの可視化や表形式の操作性を強化しました。 - Vitestを用いたユニットテストを実施し、品質維持に努めました。 - 開発手法は顧客の要望に柔軟に対応するアジャイル寄りの方式を採用し、短期間でのフィードバックループを重視する開発サイクルを構築しました。 ### 設計・改善内容 - 不明確な要望を具体化するため、双方が共通認識を持てるフォーマットを作成し、要件管理と共有の基盤を整備しました。 - 仕様やルールを誰でも理解できる形でwikiなどに書き出し整理し、プロジェクト管理の透明性を向上させました。 - 定期的に発生するタスクの自動化を推進し、手作業による負荷を軽減するとともに、作業効率を向上させました。 - 計算効率化を目的とした比較機能や定数設定機能、外部API連携機能を設計・実装し、ユーザーの操作性と業務効率を高めました。 - 顧客とのコミュニケーションを密に取り、要望の変化に迅速に対応できる設計体制を整えました。 ### その他アピールポイント - タスクの見える化と共有により、プロジェクトメンバー間の情報格差を解消し、複数人でのレビューや進捗確認をスムーズにしました。 - プロジェクト管理の効率化により、数日かかっていた作業をボタン一つで完了できる仕組みを実現しました。 ## 成果・価値 - 仕様を明確に定義することで手戻りを大幅に削減し、納期遅延や残業時間の削減に貢献しました。 - 正確な工数見積もりが可能となり、計画的なプロジェクト運営が実現しました。 - 管理の整理と自動化により、メンバー間の問い合わせや調整の手間を削減し、業務効率を向上させました。

## プロジェクト概要 自己学習を目的に同期と共同開発した手紙投稿アプリのフロントエンドを担当し、ユーザー同士が思いを共有できる環境を構築しました。 ## 役割・体制 ### 自身のポジションと役割 - フロントエンドエンジニアとして、TypeScriptとNext.jsを用いた機能開発を担当し、バックエンドとのAPI連携によるデータ送受信を実装しました。 - UIの設計にTailwind CSSやReact Hook Form、zodを活用し、ユーザーフレンドリーかつ堅牢な入力フォームの構築に注力しました。 - GitHubを利用したソースコード管理とチーム内でのコードレビューに参加し、品質向上に貢献しました。 ### チーム規模と構成 - フロントエンド2名、バックエンド4名の計6名で構成され、企画から設計、実装までを全員で協力して推進しました。 - 短期間のプロジェクトであったため、密なコミュニケーションを取りながらアジャイル的な手法で開発を進めました。 ## 背景・課題 - 自己学習の一環として同期と共同で手紙投稿アプリを開発し、自由に思いを投稿し閲覧できるプラットフォームを構築する目的がありました。 - バックエンドとフロントエンドの開発スピードの差異により、タスク進行の調整が難しく、開発効率の低下が課題となりました。 - フルスタックチーム内での役割分担が多岐にわたる中で、共通認識の欠如がコミュニケーションコスト増加の一因となっていました。 ## 実際の取り組み ### 開発環境 - フロントエンド開発はTypeScript、JavaScript、Next.jsを用い、Visual Studio Codeを開発環境として使用しました。 - UI設計にはTailwind CSSを採用し、React Hook Formおよびzodを組み合わせてフォームバリデーションを実装しました。 - バックエンドとのAPI連携はPostmanを活用して検証し、PostgreSQLをデータベースとして利用しました。 - ソースコード管理はGitHubで行い、チーム内のコード共有とレビューを推進しました。 ### 設計・改善内容 - 事前に画面ごとのデータの送受信フローを詳細にまとめ、API仕様や画面遷移の共通認識形成を図りました。 - APIのエンドポイント設計とデータ形式の明確化により、バックエンドとの連携障害を低減し、開発速度の平準化を実現しました。 - UI/UX面では、React Hook Formとzodによる堅牢な入力チェックを実装し、ユーザーが快適に手紙を投稿できる体験を提供しました。 - チーム内でのGitHubを活用したプルリクエストレビューを重視し、コード品質とバグの早期発見に努めました。 ### その他アピールポイント - 自己学習プロジェクトながら、実務に近い環境での設計・開発・チームコミュニケーションの経験を積み、今後の開発業務に活かせるスキルを獲得しました。 ## 成果・価値 - バックエンドとフロントエンドの連携部分に関する理解を深め、API設計やデータフローの事前整備の重要性を体感しながら学習できました。 - 短期間での実装とチーム協働を通じて、開発効率の向上とコミュニケーション力の強化を実現しました。 - ユーザーが自由に思いを投稿・閲覧できる手紙投稿アプリを完成させ、自己学習の成果を形にしました。