【ローコードのSKE】１０００項目のプロトタイプを作る

## 背景
お客様から500の項目を含む画面を作りたいという要望がありました。しかしSKEでそのように大量の項目を含んだ画面を作成しても性能に問題は無いでしょうか？そこで2倍の1000項目の画面を作って測ってみましょう。テスト用データベースはPostgreSQLです。

## DDLを準備する
Excelのずらす機能を活用して大量の項目を一括作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/2843ecba-766d-46fc-9490-4b906e77c36d.png)
全選択して、サクラエディターに貼り付けて、タブキーを置換で削除するようにします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/6d23e8e9-491f-4b6d-8444-aa4b446660d0.png)
後、SQLの開始終了を追記します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/5aca9e29-ea99-4043-ab99-99dd4af5c868.png)
pgAdminで実行して、テーブルを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/ab12fe4c-114e-465d-ba1d-d2ad2ad09490.png)

## リポジトリ定義作成
adminでログインして、管理者メニューのリポジトリ定義をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/ff3652fd-bad1-4575-85d2-48ac9758881a.png)

リポジトリ定義一覧画面を開きます。新規ボタンを押して、リポジトリ新規画面にIDと名称を登録します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/59c5aff3-4857-4d5a-af5b-0449f6fb7a68.png)
### 共通設定
保存後、リポジトリ定義画面に遷移します。初期表示として共通設定タブが表示されています。まずさきほど作成したテスト用テーブルの名称を登録します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/bb7c7fb3-9d61-4806-acec-1a82da2c0c2f.png)
ExcelのD列をコピーして、項目一覧に貼り付けます。また、項目１を主キーとして設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/f3db0e85-1efb-482d-9070-ae558247cb81.png)
### 一覧画面
一覧画面タブにて、基本情報に名称を登録します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/25f36577-011a-40bd-bd36-df6e20db86fc.png)

結果エリアに５つの検索結果列を追加します。また、列１の初期ソート順を設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/00b79c8d-0d6d-44a9-b9cb-8a414d5abbd0.png)

フッターに入力画面に遷移するように設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/5fa7282c-4276-4b32-b690-ab27c87f54c9.png)
### 入力画面
入力画面タブにて、基本情報に画面名と基本情報に並び方向を上下優先に設定します。（入力エリアの）高さ550を設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/11043aec-0d90-434b-b390-e1408c6af371.png)

ヘッダーに画面名を登録します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/1a6e8eb0-77ac-4766-9856-d26512d55211.png)
入力エリアに、タイトルとSQLSelectに１０００項目の項目名を登録します。Excelの貼り付けてよいです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/e67d0ce7-419c-4b86-aa62-7db8c594de1b.png)
保存後、自動的に必要な項目を補います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/b8de2eed-0bcd-423e-8bdc-71730423942a.png)

## メニュー定義作成
管理者メニューのメニュー定義をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/ca811316-010f-4d1d-a1c8-efc253af26b4.png)
メニュー一覧画面に千項目テスト用メニューを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/5eb624fb-2aed-4cb6-aa1b-599cfa1436d2.png)

リンク先の記載は、FIELDS1000のリポジトリ定義の一覧画面の意味です。
```
listPage.jsp?defId=FIELDS1000
```

## ロール定義の登録
管理者メニューのロール定義をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/05e7be82-28f9-4217-8da1-8652f416b116.png)
adminのロールを選択して、編集します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/c8504bda-b5e1-4669-99f4-bdde4b1a1746.png)
メニュータブに、千項目テストのメニューを閲覧可に追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/8b742cc4-c801-4a0d-bd51-31e4f2bc9226.png)
メイン画面に、千項目テストの一覧画面と入力画面を閲覧可に追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/e1943ba4-2996-496f-9819-43886b91620c.png)
最後保存ボタンを押します。

## 動作確認
管理者メニューではなく、 メインメニュー画面を更新して、千項目テストのメニューがみえることを確認します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/1fa6c12b-d051-45e6-8a80-de9feaf7c5b2.png)
それをクリックして、一覧画面が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/ff64d626-77e6-450e-938f-b32858e32fdd.png)
新規ボタンを押して、千項目の入力画面が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476221/f516d128-083b-4e23-a0a4-1b109a3e5335.png)
項目のサイズ制限をまだ設定していないので、適切に入力したり保存したりCRUDを確認できます。

## 感想
サクサク動いています。性能は大丈夫です。

https://github.com/efwGrp/ske