デモ

このページでは、Nijoを実際に動かすためのセットアップ手順を説明します。 一通りの機能がそろったデモを動作させ、自動生成されるソースコードと手動実装するコードの雰囲気をつかみます。

必要なもの

• .NET 9 SDK (Microsoft公式サイトからダウンロードしてください)
• nijo のコマンドラインツール。ダウンロードはこちら

上記だけで最低限動作しますが、ここでは業務システムとして必要な機能が一通りそろったデモで動かすことを想定しているため、以下も必要になります。

• デモサイトのソースコード。 nijoのリポジトリ をそのままダウンロードしてください。git clone でもソースコードのzipのダウンロードでも可
• Node.js (v24 LTS 以上推奨) ※上記デモで React.js を使用しているため

セットアップ

Node.js のパッケージをインストールする

cd <ダウンロードしたソースコードのルートフォルダ (nijo.code-workspace がある場所)>
npm ci

nijo のコード自動生成を実行する

ここでは nijo のコマンドラインツールを C:\temp\nijo.exe にダウンロードしたものとして例を示します。

cd <デモ101番のフォルダ。nijo.xml がある場所>
C:\temp\nijo.exe serve .

上記で nijo のGUIエディタが起動します。 「保存時にソースコードを自動生成する」チェックボックスにチェックを入れ、エディタ上部の保存アイコンをクリックして保存してください。 これで、nijo.xml の定義に基づいて C# と TypeScript のソースコードが自動生成されます。

デモサイトを起動する

デモサイトは

• クライアント側: React.js (TypeScript)
• サーバー側: ASP.NET Core Web API

で構成されています。

前者は npm run dev、後者は dotnet watch で起動できますが、 両方を同時に起動するため、ターミナルやコマンドプロンプトを2つ同時に開いてください。

1つめ:

cd <デモ101番のフォルダ>/client
npm run dev

2つめ:

cd <デモ101番のフォルダ>/WebApi
dotnet watch --launch-profile http

テストデータを投入して画面を動かす

• ブラウザで npm run dev で起動したサイトにアクセスしてください。 （既定では http://localhost:5173 です）
• ログイン画面上部にある「データベース再作成」ボタンでデータを作成してください。 既定では nijo.xml と同じフォルダに SQLite のデータベースファイルが作成されます。
• ファイアウォールの警告が出た場合は、ドメインネットワークとプライベートネットワークの両方でアクセスを許可してください。
• ログイン画面で、最初から入っているユーザーIDとパスワードでログインしてください。

編集

• nijo のGUIエディタで nijo.xml を編集し、ソースコードの自動生成をかけなおすとサイトにも反映されます。
• Node.js 側はホットリロードが効いているため、即座に変更が反映されます。
• ASP.NET Core Web API 側は軽微な変更なら watch で自動反映、自動的に反映されないなら Ctrl + R で再起動。
• データベース定義が変更になった場合はマイグレーションが必要です。
  • <デモ101番のフォルダ>/Task/ADD_MIGRATION.sh を実行して、マイグレーションとDB定義変更用SQLを作成してください。
  • マイグレーションIDはファイル名昇順になるように既存のマイグレーションの名前に注意してつけてください。
  • この手順の実行には dotnet-ef コマンドが必要になります。
  • Windows の場合は sh ファイルを実行できないので、同等のコマンドを手動で実行してください。