ポートフォリオサイト

概要

このポートフォリオサイトは、モダンなWeb技術を使用して構築しました。 年末年始駆動開発で作成したプロジェクトです。

主な機能

多言語対応（i18n）

• next-intl を使用した日本語/英語の切り替え
• URLベースのルーティング（/ja/, /en/）
• 翻訳ファイルによるコンテンツ管理

ダークモード

• next-themes によるテーマ切り替え
• システム設定との連動
• 手動切り替えボタン

タイムライン経歴表示

• 職歴と学歴を時系列で表示
• 色分けによる視覚的な区別（職歴: 青、学歴: 緑）
• 現職はパルスアニメーションで強調
• Framer Motion によるスクロールアニメーション

資格・受賞セクション

• 認証情報へのリンク付きカード表示
• Oracle、AWS Credly などの外部認証ページへ遷移

ブログ機能

• MDX によるMarkdownベースの記事管理
• シンタックスハイライト（rehype-highlight）
• 読了時間の自動計算
• タグによる分類

SEO対策

• 動的OG画像生成
• sitemap.xml / robots.txt 自動生成
• メタデータの最適化

技術スタック

カテゴリ	技術
フレームワーク	Next.js 16.1.1 (App Router)
UI	React 19
言語	TypeScript
スタイリング	Tailwind CSS v4
i18n	next-intl
コンテンツ	MDX (next-mdx-remote)
アニメーション	Framer Motion
分析	Vercel Analytics, Google Analytics

アーキテクチャ

• SSG（静的サイト生成） による高速なページロード
• App Router によるモダンなルーティング
• コンポーネント駆動の設計
• Zodによる型安全なバリデーション