カードリーダーを使用した入退室管理アプリを作る
過去にこんなスクラップを書いていたことがあるが、道半ばで完全に放置していた。
この時は勉強の一環としてやっていたが、本格的に作って欲しい…!となってきたのでちゃんとプロジェクトとして始動することになった。ということで改めて開発を進めていく。
開発環境
今回は以下のような構成で実装を進める
基本構成
Next.js:14.0.4
Prisma:5.10.2
Vercel Postgres
その他
Node:18.19.0
TailwindCSS:3.3.0
今回は初めてPrismaというものを使ってみる。
システム概要
システムの概要はざっくりこんな感じ。よくある入退室管理のアプリだと思う。
今回はカードリーダーとしてSONYのPasori RC-S300を使用した。
このカードリーダーを選定した理由としては、今回のプロジェクト先においてすでに使用されていた・開発関連の記事も多かったなどの理由よりこのカードリーダーを選定した。
実装する機能
基本的には実装していきながらになるが、ざっくり実装する必要がある機能を並べる。
管理画面
- 新規会員登録
- 会員情報編集
- 新規カード登録
入退室管理画面
- 読み込みカードの登録・使用期限チェック
- 入退室記録のDB保存
まずは管理画面側から実装進める
最初にDBを構築する。今回はPrismaでの実装であるので、schemaもPrismaにて作成する。
テーブル構造は以下の通り(chatGPTによる要約)
テーブルとその説明
- Member(会員): 会員の基本情報を保持します。会員ごとuuid、名前、メールアドレスなどの情報が含まれます。
- Plan(プラン): 会員が選択できる月額プランの情報を保持します。プランにはプラン名(例:月額会員など)や価格などが含まれます。
- Checkin(チェックイン): 会員のチェックイン情報を記録します。チェックインとチェックアウトの時刻が含まれます。
- Card(カード): 会員に関連付けられたカード情報を保持します。カード番号などが含まれます。
リレーション
MemberとPlan: 1対Nのリレーション。各会員は一つのプランに属し、一つのプランには複数の会員が属することができます。
MemberとCheckin: 1対Nのリレーション。一人の会員は複数のチェックイン記録を持つことができます。
MemberとCard: 1対1のリレーション。一人の会員は一つのカードを持つことができます(ただし、カードを持たない会員もいます)。
今回CardテーブルをMemberテーブルと分けた理由として、購入したカードは会員登録の際に読み込ませるのではなく、事前にある程度の枚数読み込ませておく運用が想定されたためこのような構成としている。
prisma関連記事はたくさんあるため、DB構築の具体的な説明はここでは割愛