プロジェクト概要
自身の公式サイト。多言語対応とSEO最適化を重視し、技術的専門性と親しみやすさのバランスを重視しました。Next.js 15の最新機能を活用した高速・高品質なWebサイトです。
主要機能
- 日本語・英語の完全多言語対応
- Next.js App Routerによる高速ページロード
- レスポンシブデザイン（全デバイス対応）
- SEO最適化とメタデータ管理
- React Markdownによるコンテンツ管理
技術スタック詳細
フロントエンド
- Next.js 15（App Router）
- React 18 + TypeScript
- Tailwind CSS
国際化・SEO
- Next.js i18n機能
- 構造化データ対応
- Open Graph最適化
開発課題
Pages RouterからApp Routerへの移行時にルーティング競合が発生。また、多言語サイトでのSEO最適化とコンテンツ管理の効率化が課題でした。
解決手法
App Routerに完全移行し、[lang]パラメータでの動的ルーティングを実装。React MarkdownとGray Matterによるコンテンツ管理システムで効率的な更新フローを構築しました。
プロジェクト成果
高速なパフォーマンスと多言語対応により、グローバルなユーザーへの対応を実現。Lighthouseスコアで95点以上を維持し、検索エンジンでの視認性も大幅に向上。AI活用サポーターとしてのブランド確立に貢献しています。
95+点
Lighthouseパフォーマンス
2言語対応
日本語・英語完全対応
0.5秒
平均ページロード時間