ポートフォリオサイト

2024-07-20

---

概要

このポートフォリオサイトは、自身のスキルと経験を効果的に伝えるために開発しました。 最大の特徴は、Googleの生成AI「Gemini CLI」を開発パートナーとして全面的に採用した点です。 「要件定義 → 設計 → タスク化」という体系的な開発プロセスをdocsディレクトリで管理し、Gemini CLIに各タスクを指示することで、ボトムアップかつ着実に開発を進めました。

アピールポイント

1. AIとの協業によるモダンな開発プロセス

• スペック駆動開発の実践: README.mdやdocsに記載の通り、まず初めに要件と設計を固め、それを具体的なタスクに落とし込みました。これにより、手戻りの少ない効率的な開発を実現しています。
• ドキュメントベースの開発: 実装コードだけでなく、設計思想や要件定義といったドキュメントもリポジトリで一元管理することで、プロジェクトの全体像を把握しやすくしています。

2. Next.js(SSG)とMUIによる高速かつ美しいUI

• パフォーマンス: Next.jsの静的サイト生成（SSG）機能により、ビルド時に全てのページがHTMLとして生成されるため、ユーザーは非常に高速にサイトを閲覧できます。
• デザイン: 高品質なUIコンポーネントライブラリであるMaterial-UI (MUI)を全面的に採用し、モダンでクリーン、かつレスポンシブ対応のUIを効率的に構築しました。

3. Git-based CMSによる効率的なコンテンツ管理

• 簡単な更新: 実績やスキル情報はMarkdownやJSONファイルで管理しています。これにより、データベースを必要とせず、GitリポジトリにpushするだけでVercelが自動でデプロイを行い、コンテンツが本番環境に反映される「Git-based CMS」を実現しました。

使用技術

• フロントエンド: Next.js, React, TypeScript
• UIフレームワーク: Material-UI (MUI)
• 開発ツール: Gemini CLI
• ホスティング: Vercel (CI/CD連携)