Kojirer

• AR会謹製豚そば「こうじろう」の食券管理システム

How to Start Develop

０. 前提

以下のインストールおよびセットアップをすること．

• VSCode
• Docker
• Git

また，VSCode内に以下の拡張機能のインストールが必要．

• Dev Containers

1. リポジトリのクローン

Workingディレクトリにおいて，GitHubからソースファイルをクローンする．

git clone "git@github.com:ARCircle/Kojirer.git"

クローンしたディレクトリに移動し，.envファイルをコピーする．

cd Kojirer
cp example.env .env

VSCodeでクローンしたディレクトリを開く．

code .

2. devcontainerの起動

VSCodeの画面左の「><」のようなマークから， 「コンテナーで再度開く（Reopen in Container）」という欄をクリック．

初めてビルドする際は，右下にダイアログが出現するので 「コンテナーで再度開く」を実行しても可能．

3. マイグレーションの実行

開発中のDBとスキーマ定義を合わせるため， 開発開始時には必ずマイグレーションを実行する．

npm run migrate:dev

TARGET=devでは，ホットリロードの恩恵を受けるため，フロントエンドサーバ (port: 52800) とバックエンドサーバ (port: 52600) の両方が起動する． なお，バックエンドのコンソール表示が2重になっているが，これは仕様である (原因探し中)．

How to Start Production

sudo docker-compose up -d --build

開発環境ではバックエンドサーバ (port: 52600) のみ起動する．

ディレクトリ構成

pakages

Kojirerのコア部分．基本的にここをいじくることになる．

pakages/backend

Feature	Package
HTTPサーバフレームワーク	Express.js
ORM/マイグレーションツール	Prisma.js
データベース	PostgreSQL

Routeの追加

tsファイルをsrc/routesに追加すると，そのファイル名のパスが作られる．

DBマイグレーション

データベースへのテーブルの追加や編集といったスキーマへの操作を記録し，それらを逐次実行することで，開発者間で環境を揃えることをマイグレーションという．

このリポジトリにおけるマイグレーションの手順は以下のとおりです．

1. prisma/schema.prismaにおいて，スキーマを編集する
2. npm run migrate:createを実行し，sqlファイルをprismaディレクトリ以下に作成される
3. 作成されたsqlファイルを確認し，既存のスキーマを壊すことがないか確認
4. npm run migrate:devでsqlを実行する

開発用データのInsert

.devcontainerの外，すなわちWSL上のKojirerディレクトリにおいて，以下のコマンドを実行．

 docker exec -i kojirer_devcontainer-db-1 psql -U kojirer -d kojirer < packages/backend/examples/devdata.sql 

pakages/frontend

Feature	Package
UIライブラリ	React
ルーティングライブラリ	@generouted/react-router
UIコンポーネント	Chakra UI