本サイトについて

概要/要件

技術・実績・キャッチアップを伝えるポートフォリオサイト

  • 本サイトの目的と想定ユーザーを明確化し、短時間で価値が伝わる情報設計を行います。
  • 主要ページ構成と開発プロセスを公開し、実装方針と運用方針を追跡できるようにします。
  • 技術選定はカテゴリ別に整理し、採用理由と将来の見直し余地を明記します。
  • ページ要件更新時はスクリーンショット差分を確認し、仕様と実装の不整合を防ぎます。

関連ページ:

ドキュメント（GitHub Pages）:

※各ドキュメントは GitHub Pages 上にまとめています。
※セキュリティ要件や管理画面、管理APIの要件については、別途プライベートリポジトリで管理しています。

使用技術

フロント

  • Astro

    採用理由: 静的生成を中心にしつつ必要箇所のみ動的化でき、表示性能と保守性を両立しやすいため。

  • TypeScript

    採用理由: 型でデータ構造を明示し、改修時の影響範囲を把握しやすくするため。

  • Vue.js

    採用理由: フォームなどのインタラクティブ要素を小さな単位で実装しやすいため。

  • Tailwind CSS

    採用理由: ユーティリティ中心で画面調整を素早く反映でき、UIの一貫性を保ちやすいため。

バックエンド

  • PHP

    採用理由: 既存のAPI資産と運用知見があり、機能追加を段階的に進めやすいため。

    補足: 一部機能は将来の負荷要件に応じて別実装方式への移行を検討します。

  • MySQL

    採用理由: 更新履歴や管理データを安定して扱えるリレーショナル設計と運用実績があるため。

ツール

  • GitHub

    採用理由: ソース管理とレビュー導線を一元化し、変更履歴の追跡性を高めるため。

  • Playwright

    採用理由: 主要ページの表示崩れを自動検知し、リリース前の品質確認を標準化するため。

  • IntelliJ IDEA

    採用理由: AstroとTypeScriptの編集支援を活用し、実装とリファクタリングの速度を上げるため。

開発プロセス

要件整理から改善までを時系列で回し、最終工程の改善内容を次の要件整理へ接続します。

  1. 要件整理

    目的: 伝える内容と利用者像を明確化する。

    成果物: 要件メモ・優先度一覧。

  2. 設計

    目的: 情報構造と画面遷移を整理する。

    成果物: ページ構成案・設計メモ。

  3. 実装

    目的: 設計に沿って機能とUIを形にする。

    成果物: Astroコンポーネントとスタイル。

  4. 検証

    目的: 表示品質と操作性を確認する。

    成果物: テスト結果・修正チケット。

  5. 改善

    目的: 反省点を次サイクルへ反映する。

    成果物: 改善方針・次回要件。

← 作品一覧に戻る