学校管理システム (School Admin)
React + Node.js によるフルスタック開発のケーススタディ
プロジェクトの概要
このプロジェクトは、学校やスクールにおける「出欠管理」「成績管理」「ユーザー管理」を一元化するフルスタックWebアプリケーションです。 単なるWebサイト制作ではなく、複雑なビジネスロジックとデータベース設計を伴う「システム」としての品質を追求しました。
解決した課題
従来の管理フローでは、情報の分散や権限制御の不備が課題となっていました。本システムでは以下の解決策を提示しました。
- ロールベースアクセス制御 (RBAC): 管理者、講師、生徒の各ロールに応じた権限を厳密に管理。
- データの一貫性: MariaDBを用いたリレーショナル設計により、成績や出席データの整合性を確保。
- 直感的なUI: 複雑なデータを整理し、多忙な教育現場でもミスが起きにくいUX/UIを設計。
技術的な工夫とこだわり
フルスタック構成の最適化
FrontendはReact(TypeScript)を採用し、型安全な開発を実現。BackendはExpressを使用し、セッション管理やバリデーションを堅牢に実装しました。
Dockerによる環境の隠蔽
開発環境と本番環境の差異をなくすため、Dockerを利用してコンテナ化。DBの環境構築も容易にし、開発の俊敏性を高めました。
保守性の高い設計
将来的な機能拡張を見据え、コンポーネントの再利用性やディレクトリ構成を整理し、後から開発に参加するエンジニアにも優しいコードを目指しました。
制作ストーリー
最も苦労した点は、セッション管理とロールベースの出し分けロジックの両立でした。 セキュリティを確保しつつ、ユーザー体験を損なわないリダイレクト処理を実装するため、認証プロバイダーの設計を何度も見直しました。 その結果、ログインユーザーの状態に応じたシームレスな画面遷移を実現でき、非常に高い完成度となりました。