GitHub 上で公開している制作物を、モバイル端末で見やすい作品集として閲覧できる Web アプリです。
作品の詳細は GitHub の README をそのまま表示できるようにし、更新コストを最小限に抑えています。
Links
概要
- 作品一覧をカード形式で表示
- タイトルリンクから作品詳細ページ（README表示）へ遷移
- GitHubリンクから該当リポジトリへ遷移
- README は raw URL から取得して表示（構成をシンプルに）
- Markdown 表示の可読性向上のため、Markdown用CSSに対して global.css で余白・文字サイズなどを調整
使用技術
- Next.js（App Router）
- TypeScript
- Tailwind CSS
- react-markdown
- Vercel
工夫した点
README をそのまま作品説明に活用
作品ごとに README を更新するだけで、ポートフォリオ側にも内容が反映される構成にしました。
GitHub API は使わず、raw URL から取得することで実装と運用を簡潔にしています。
Markdown 表示のスタイリング
Markdown の見出し・リスト・余白などを、global.css 側で調整し、スマホでも読みやすい見た目を目指しました。
スクリーンショット
