My History of Scoutingプロジェクト

この記事は約4分で読めます。

技術選定の経緯

開発当初は、PythonのWebフレームワークであるFlaskとCSSフレームワークのBootstrapを利用していました。
Flaskを用いたサーバーサイドレンダリングにより、HTMLを生成して返すシンプルな構成です。
この段階ではUIも軽量で、スマートフォン表示にも対応できていました。

しかし、開発を進めるうちに問題が発生しました。
ユーザーの操作に応じて画面の一部だけを更新したい場合、
Flaskの構成ではJavaScriptとサーバー側テンプレートの制御が複雑化してしまいました。
さらに、ユーザー認証やリアルタイムデータ反映といった機能拡張を考えると、
この構成では限界が見えてきました。

そこで、技術スタックを全面的に見直すことにしました。
結果として採用したのが React と Firebase の組み合わせです。

React + Firebase を採用した理由

React はコンポーネント単位でUIを分割できるライブラリです。
これにより、画面を小さな部品として再利用しやすく、保守性を大幅に向上できます。
また、SPA(シングルページアプリケーション)として動作するため、
ページ遷移が滑らかで、ネイティブアプリに近い操作体験を提供できます。

Firebase は Google が提供する BaaS(Backend as a Service)であり、
次の特徴が採用の決め手となりました。

  • Authentication:安全なユーザー認証を短時間で実装可能。
  • Firestore:柔軟なNoSQLデータベース。リアルタイム更新に対応。
  • Hosting:ビルド後のアプリを簡単にデプロイできる。
  • 費用:無料枠が広く、個人開発でも運用可能。

この構成により、アプリ全体をサーバーレスで運用でき、
サーバー管理の手間をほぼゼロに抑えられました。

認証システムの設計と課題

スカウトの個人情報を扱う以上、認証とアクセス制御は最も重要な要素です。
初期設計では、団体IDと招待コードを組み合わせてユーザーを登録する仕組みを採用しました。
これにより、登録者が必ず特定の団体に紐づく構造を作ろうとしました。

しかし、実際の運用ではこの手順が複雑で、利用者に混乱を招きました。
また、Firebase Authenticationの設計上、
カスタムクレームを多用することでデータベース構造が冗長になり、
結果的に一部の機能が正常に動作しなくなる問題が生じました。

この経験から、認証の仕組みは「正確さ」だけでなく「直感的な使いやすさ」も重要であると分かりました。

React 開発で直面した問題

React の理解不足により、初期のコードではコンポーネントのネストが過剰になりました。
ロジックが分散し、状態管理も適切に整理されていなかったため、
後から修正する際にコード全体の追跡が困難になりました。

また、開発中にドキュメントを十分に残していなかったため、
自分自身でも意図を思い出せない箇所が多く存在しました。
この結果、機能追加や修正に無駄な時間が発生することになりました。

この反省から、ドキュメント化の重要性を強く実感しました。

今後の改善計画 ― 「リライト」という選択

部分的な修正では根本的な課題が解決できないと判断し、
既存コードを全て書き直す「リライト」を行う方針を決定しました。

リライトでは以下の改善を実施します。

  1. TypeScriptの導入
    JavaScriptからTypeScriptに移行することで、静的型付けを導入します。
    コンパイル段階で多くのエラーを検出できるようになり、バグの早期発見が可能になります。
  2. 認証フローの簡略化
    複雑だった招待ID方式を廃止し、招待メール経由でアカウント登録する方式に変更します。
    これにより、ユーザーの手順が分かりやすくなり、誤操作も防止できます。
  3. ドキュメント管理の徹底
    設計上の判断理由をリポジトリにテキストとして記録し、
    実装レベルの補足はコードコメントに明示する運用に切り替えます。

これらにより、開発の透明性と保守性を大きく向上させる予定です。

学びと今後の展望

このプロジェクトを通して得た最大の学びは、
「ソフトウェア開発は課題解決の手段であり、目的ではない」ということです。

アプリを完成させることよりも、現場の課題を正しく理解し、
それに適した技術を選択することが本質的な価値になります。

また、一度完成させたシステムを自ら批判的に見直し、
再構築を決断できたことはエンジニアとして重要な経験でした。
技術的な知識だけでなく、開発思想の面でも大きな成長を実感しています。

現在、リライト版の開発を進めています。
完成後はスカウト自身が自分の進歩を振り返れる仕組みを実装する予定です。
データを「残す」だけでなく、「成長を可視化する」ためのプラットフォームへと発展させます。

まとめ

My History of Scouting は、ボーイスカウト活動の現場で発生していた情報管理の問題を、
Web技術によって解決することを目的とした個人開発プロジェクトです。

技術的にはまだ途上ですが、現場からのフィードバックを取り入れながら改善を続けています。
コードはGitHubで公開しています。

GitHub: Kihamda/sinpo-bs

このプロジェクトを通して、身近な課題を技術で解決することの難しさと面白さを学びました。
今後も現場の声をもとに改良を重ね、より良い仕組みへと発展させていきます。

タイトルとURLをコピーしました