ID:81849さん

# AIエージェント活用 大手通信会社の顧客データ可視化ダッシュボード新規開発 *** ## 役割: アプリケーション新規開発リード | チーム: 5名（アプリ4名、インフラ1名） AWS Bedrock Agent coreのAIエージェントを活用した顧客データ分析・可視化ダッシュボード新規開発。プロジェクト開始1ヶ月後から参画し、開発リードとしてアプリケーション開発を主導しています。 *** ## 主な成果 ■ 開発体制の構築とコード品質の向上 案件参画時、AI生成コードをベースに開発が進められコーディング規約も未整備で、PRごとにコードスタイルや品質がばらつく状態でした。 この課題に対し、GitHub ActionsによるCIパイプライン構築（Prettier/ESLint/型チェック）とコーディング規約策定を実施しました。また、AI出力品質を安定させるドキュメント整備により、初回レビュー指摘事項を50%削減し、コード品質の標準化を実現しました。 ■ パフォーマンス最適化によるUX向上 SSRでのページ遷移時に発生していた遅延問題（初回ロード20秒超）に対し、SSR/CSRの適切な使い分けとSuspense、loading.tsxを活用した段階的レンダリングにより初回ロード時間を20秒短縮しました。また、SSE（Server-Sent Events）を用いたエージェントの思考プロセスをストリーミング形式で表示する実装により、レスポンスの結果を待つ間にもリアルタイムなデータ表示を実現し、ユーザー体験を向上させるよう努めました。 ■ エラーハンドリングの強化 ページ表示時のエラー頻発とデータバリデーション不足による不具合により、エラーページが頻繁に表示されていました。 この課題に対し、Zodによるスキーマバリデーションの実装、Error Boundaryによる予期せぬエラーのキャッチと部分的機能継続を実現するレジリエント設計を導入し、ユーザが引き続きシステムを使用できるよう実装しました。 ■ プロトタイプ駆動開発による手戻り削減 週次デモで実装後に大幅な仕様変更が発生し、手戻りが多発していました。 v0/lovable/boltなどを活用した高速プロトタイプ作成により、実装前に複数デザイン案を提示し顧客の意向を確認するフローを確立しました。その結果、実装後の手戻りを大幅に削減しました。 *** |カテゴリ |技術スタック | |-------------|--------------------------------------------------------------------| |フロントエンド |Next.js 15, React 19, TypeScript, Material-UI, Chart.js, React Sigma| |バックエンド / API |TypeScript, Zod, AWS Bedrock Agent core, SSE (Server-Sent Events) | |ツール |Yarn, Prettier, ESLint, Docker | |インフラ |AWS(ECS) | |開発環境 / DevOps|GitHub Copilot, GitHub Actions |

# プログラミング学習サービス「CodeLesson」開発 *** URL: <https://code-lesson.com>​​​​​​​​​​​​​​​​ ## 役割: 開発メンバー | チーム: 8名 コミュニティ活動を通じて株式会社ifと接点を持ち、自社サービスのプログラミング学習サービス「CodeLesson」の開発参画の機会をいただきました。自分自身がCodeLessonのユーザーとして利用していた経験があり、「学習者として感じた課題を解決したい」という思いを持って参画しました。 *** ## 主な開発したアウトプットの詳細 ### 1. 学習メモ機能の企画・実装 自身の学習体験から「重要なポイントをその場で記録したい」「後から振り返りたい」というニーズを感じていました。 そのため学習中のメモ作成機能を提案し、ユーザーが学習コンテンツを読みながら、気づきや疑問点をその場で記録できる機能の実装を行いました。 メモ機能の作成によって学習効率の向上に貢献し、実際にユーザーからも「メモ機能が欲しかったので便利です」とのフィードバックを獲得しました。 ### 2. 管理者用ダッシュボード機能の実装 運営側から、ユーザー管理の課題を伺い、管理者用ダッシュボード機能を実装しました。 具体的には以下の機能を一元化し管理できる機能を作成しました。 - コンテンツの公開者の管理 - 教師と生徒の紐付け管理（どの教師がどの生徒を担当しているかの管理） これらの機能により運用効率を改善し、運営側の管理工数を削減しました。 その他にも約8ヶ月間で複数の新規機能開発とバグ修正を担当し、サービスの品質向上に貢献しました。 *** ## 特に工夫をしたこと ### 1. ユーザー視点での機能企画と優先順位付け 自分自身がユーザーだった経験を最大限に活かし、実際の利用シーンで感じた課題をもとに機能提案を行いました。開発者目線ではなく、学習者目線で「本当に必要な機能は何か」を考えて機能を検討し、優先順位をつけて実装しました。例えば、メモ機能では「どのタイミングでメモを取りたいか」「どう復習したいか」を具体的にイメージし、UIの配置や操作フローを設計しました。 ### 2. 手戻りを最小限に抑えるコミュニケーション 本業と並行して開発を進めるため、限られた時間で最大の成果を出すことが求められました。そこで、実装前後のコミュニケーションを特に意識しました。 **実装前：画面イメージとプロトタイプによる認識齟齬の防止** 新規機能の実装時にはプロトタイプを作成したり、デザイン提案時にはv0やlovableなどのツールを活用し、チームメンバーや運営側に複数のパターンを事前に共有しました。「こういうUIでこういう操作フローを考えています」と具体的なイメージを共有することで、実装後の「イメージと違った」という手戻りを防止しました。 **実装後：PRでの丁寧な説明** PR作成時には、レビュアーの視点を意識し、必要な情報を載せることを徹底しました。例えば以下の情報を含めることを意識しました。 - 変更前後の画面キャプチャ: ビジュアルで変更点が一目で分かるよう工夫 - 動作デモのGIF: 動的な機能変更の場合は、実際の動作を録画して共有 - 変更内容の箇条書き: 「何を変更したのか」「なぜ変更したのか」を明確に記載 - 特に確認して欲しい点: 特に確認して欲しい点を明記することで懸念点の見逃しを抑制 これらの工夫により、本業と並行しながらも手戻りを最小限に抑え、効率的に開発を進めることができました。 *** |カテゴリ |技術スタック | |-------------|-----------------------------------------------| |フロントエンド |Next.js, React, TypeScript, Mantine UI, Zustand| |バックエンド / API |TypeScript, tRPC, Prisma, TanStack Query | |ツール |Bun, Biome, Docker | |開発環境 / DevOps|Cursor, Claude Code, GitHub Actions |

# スノーボード会員管理システム開発（業務委託） *** ## 役割: 開発メンバー ### 開発に至った経緯： 株式会社ifが運営するコミュニティ活動を通じて技術力が認められ、スノーボード会員のアカウント情報やHPを管理するシステムの開発に業務委託として2025年12月から参画しています。 フロントエンドからバックエンドのフルスタックで開発を担当しています。 *** |カテゴリ |技術スタック | |-------------|---------------------------------------------------------| |フロントエンド |Next.js, React, TypeScript, Mantine, react-hook-form, Zod| |バックエンド / API |TypeScript, tRPC, Prisma, TanStack Query | |インフラ / 認証 |Vercel, Supabase Auth | |ツール |Bun, Biome, Docker | |開発環境 / DevOps|Cursor, Claude Code, GitHub Actions |

# 大手銀行の脆弱性情報管理システム開発 *** ## 役割: 開発担当 | チーム: 15名 ServiceNowプラットフォームを活用した脆弱性情報の一元管理システム構築。複数ステークホルダーからの要件ヒアリングから設計・実装・テストまで担当しました。 |カテゴリ |技術スタック | |--------|--------------------------------------| |プラットフォーム|ServiceNow (ITSM / ITOM / Custom App等)| |開発言語 |JavaScript (Client-side / Server-side)|

# 大手商社の社内向けWebアプリケーション開発 *** ## 役割: メンバー（リーダー不在時サブリーダー） | チーム: 4名 ServiceNowプラットフォームを活用した社内向けWebアプリケーションの導入支援および新規機能開発。AngularJS/JavaScriptによる開発、コードレビュー実施、リーダー不在時のチーム進捗管理を担当しました。 |カテゴリ |技術スタック | |--------|------------------------------------------------| |プラットフォーム|ServiceNow (ITSM / ITOM / Custom App等) | |開発言語 |AngularJS JavaScript (Client-side / Server-side)|