Day 15 - 12/15

受験xDay - 高校受験の日程・手続き管理アプリ

ReactTypeScriptTailwindCSSVercelExpo
Claude CodeGenSpark
受験xDay - 高校受験の日程・手続き管理アプリ

概要

概要


高校受験の複雑な日程管理を一元化し、試験日の重複や入金締切のリスクを自動で検出するPWAアプリです。保護者の「受験ロジスティクス」をサポートします。

主な機能


  • タスク管理: 出願・試験・入金などの期限をカウントダウン表示し、重要度に応じて色分け

  • 戦略ボード: 複数校の日程を横並びで可視化し、試験日被りや捨て金リスクを⚡💸マークで警告

  • 予算管理: 受験費用の最小〜最大シミュレーションと、必要書類の自動カウント

  • PWA対応: ホーム画面に追加すれば、アプリのようにワンタップで起動可能

  • オフライン動作: データは端末内に保存され、インターネット接続なしでも利用可能


こんな悩みを解決


  • 「複数校の出願・試験・入金締切が頭の中で整理できない」

  • 「第1志望の合格発表前に他校の入金締切が来て、捨て金になるかも…」

  • 「試験日が重なっていることに直前まで気づかなかった」


使い方


1. 受験する学校を登録
2. 出願期間・試験日・合格発表日・入金締切などのイベントを追加
3. 自動で警告が表示され、リスクを事前に把握できる

初回起動時はサンプルデータで機能を体験でき、すぐに自分のデータに切り替えられます。

リンク

制作時間

8.5時間

学んだこと・振り返り

技術的な学び


  • PWAの実装: manifest.json、apple-touch-icon、スタンドアロンモード検出など、スマホアプリ化のための設定を一通り学べた

  • Expo Webの制約: React Native向けのExpoをWeb展開する際の落とし穴(node_modulesがVercelで無視される、パス解決の問題)を体験

  • AsyncStorageの使い方: ローカルデータの初期化・保存・削除のフロー設計と、サンプルデータと本番データの切り替えロジック

  • デプロイ戦略: サブパス(/app/)ではなくサブドメイン(app.juken-xday.com)に分離する方が確実だと実感


AIとの協働で気づいたこと


  • ユーザー視点の指摘が的確: 「アイコンのXマークが不合格を連想させる」という指摘は自分では気づかなかった。一般ユーザー目線でのフィードバックがAIから得られるのは大きな価値

  • 段階的な改善が効果的: 一度に完璧を目指さず、「まず動くものを作る→問題が出たら修正」を繰り返すアプローチで、最終的に安定した構成にたどり着けた

  • エラー解決の速さ: Web環境でAlert.alertが使えない、スクロール位置がおかしいなど、細かいバグを即座に検出・修正してくれるので、開発リズムが途切れなかった


次に活かしたいこと


  • 通知機能の追加: 試験日や締切の前日にプッシュ通知を送る機能があれば、さらに実用的になる

  • データ共有: 家族間で受験スケジュールを共有できる機能(QRコードやリンク共有)

  • カレンダー連携: Googleカレンダーやスマホの標準カレンダーにイベントを自動登録

  • ネイティブアプリ化: App StoreやGoogle Playでの配信も視野に、Expo EASを使った本格的なアプリ化に挑戦したい


感想


「受験は情報戦」と言われるが、保護者にとっては「日程管理戦」でもある。このアプリで、少しでも保護者の負担を減らし、安心して受験に臨める環境を作れたら嬉しい。

メインAIツールの評価

Claude Code

⭐⭐⭐⭐⭐

良かった点

- 複雑な状態管理(AsyncStorage、サンプルデータ制御)を一発で実装してくれた - UI/UXの細かい改善提案(ウェルカムモーダル、サンプルバナー)が的確だった - Web特有の制約(Alert.alert非対応、スクロール位置)を自動で検出・修正してくれた - アイコンデザインの問題(Xマークが不合格を連想)を指摘し、即座に新デザインを生成 - Vercelデプロイの複雑なパス問題(node_modules無視、/app/サブパス)を根本から解決

改善してほしい点

初回はパス問題で何度かデプロイし直す必要があったが、最終的にはサブドメイン分離で解決できた。最初から「Vercelの制約」を教えてくれるとさらに良かった。

総合コメント

React Native Webの複雑な環境(Expo + Cloudflare制約 + Vercel制約)でも、トラブルシューティングが非常に速く、原因特定→修正→デプロイまでの流れがスムーズだった。特に「ユーザー視点での問題指摘」(アイコンが不合格を連想、初回画面の使い方がわからない)を即座に理解し、具体的な改善案を出してくれた点が素晴らしい。

公開日: 2025/12/15