kintone アプリの検討・作成・変更を行う Gem rex0220 アプリマイスター・レイを公開しました。
開発環境で、動作検証の上お試しください。
概要
rex0220 アプリマイスター・レイは、kintone アプリ要件を入れてアプリ作成・変更を行うことが出来ます。
実際に顧客管理アプリを作成・変更して動作を検証します。
さらに、案件管理アプリで顧客管理アプリをルックアップしてみます。
実行エラーもレイに教えると、対策してくれます。
関連記事
- rex0220 アプリマイスター・レイ アプリ作成後に関連レコードを追加
- rex0220 アプリマイスター・レイ 既存アプリのフィールドコード変更
- rex0220 アプリマイスター・レイ 項目の多いアプリ作成
- rex0220 アプリマイスター・レイ テストデータの生成
- rex0220 アプリマイスター・レイ アプリ情報の取得
- rex0220 アプリマイスター・レイ 画面からアプリ作成
- rex0220 アプリマイスター・レイ Garoon画面 から予定表アプリ作成
- rex0220 アプリマイスター・レイ 見積書からアプリ作成
レイのイメージキャラ
kintone アプリ構築と整備のスペシャリストである**「狐(キツネ)」**
レイに出来ること
- アプリ作成・変更
- 項目追加・変更
- ラベル変更、フィールドコード変更、各種制約変更
- 一覧追加・変更
- 項目追加・変更
アプリ作成・変更手順
- レイにアプリ要件を入力
- アプリ作成・変更の JavaScript コードを生成
- kintone 画面を開いたブラウザーの console 画面で実行
顧客管理アプリ作成例
顧客管理アプリに必要な項目や一覧などを入力します。
kintone プラグインの顧客管理アプリを作成したい
spaceId: 333 thread: 376
顧客コード、顧客名、顧客ランクが必要
顧客ランクに合わせて、文字列項目に説明文をセットする
サブスク顧客かどうかの区分をつけて
あと契約変更履歴のテーブルも必要
一覧画面"顧客Aランク"を追加
顧客ランクが"A" のみを表示
顧客管理アプリ作成の回答
お任せください!
スペース(ID: 333)のスレッド(ID: 376)の中に、ご要望の**「顧客管理アプリ」**を構築しましょう。
ご希望の機能、バッチリ設計しましたよ!
特に「顧客ランク」を選ぶだけで「ランク説明」が自動で表示されるよう、計算式も仕込んでおきますね。メンテナンス性を考えて、計算結果は文字列フィールドに保存される形にします。
以下のコードを、kintoneのブラウザコンソール画面で実行してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 顧客管理アプリ(スペース内作成)
* Target: Space ID 333, Thread ID 376
*/
(async () => {
try {
console.log('🦊 レイ: スペース内への「顧客管理アプリ」構築を開始します!');
// -------------------------------------------------------
// 1. 新規アプリの作成(スペース指定)
// -------------------------------------------------------
const createAppBody = {
name: '顧客管理アプリ',
space: 333,
thread: 376
};
const createResp = await kintone.api(kintone.api.url('/k/v1/preview/app', true), 'POST', createAppBody);
const appId = createResp.app;
console.log(`Step 1: アプリの枠を作成しました... App ID: ${appId}`);
// -------------------------------------------------------
// 2. フィールドの追加
// -------------------------------------------------------
const fieldsBody = {
app: appId,
properties: {
// --- 基本情報 ---
'顧客コード': {
type: 'SINGLE_LINE_TEXT',
label: '顧客コード',
code: '顧客コード',
unique: true, // 重複禁止
required: true
},
'顧客名': {
type: 'SINGLE_LINE_TEXT',
label: '顧客名',
code: '顧客名',
required: true
},
// --- ランク・説明(自動計算) ---
'顧客ランク': {
type: 'DROP_DOWN',
label: '顧客ランク',
code: '顧客ランク',
options: {
'A': { label: 'A', index: 0 },
'B': { label: 'B', index: 1 },
'C': { label: 'C', index: 2 }
},
defaultValue: 'C',
required: true
},
'ランク説明': {
type: 'SINGLE_LINE_TEXT',
label: 'ランク説明',
code: 'ランク説明',
// 標準機能のIF関数で、ランクに応じた文言を表示します
expression: 'IF(顧客ランク="A", "最優先対応(VIP)", IF(顧客ランク="B", "通常対応", "新規・見込み"))',
hideExpression: false
},
// --- サブスク区分 ---
'サブスク区分': {
type: 'RADIO_BUTTON',
label: 'サブスク区分',
code: 'サブスク区分',
options: {
'サブスク契約': { label: 'サブスク契約', index: 0 },
'スポット契約': { label: 'スポット契約', index: 1 }
},
defaultValue: 'サブスク契約'
},
// --- 契約変更履歴テーブル ---
'契約変更履歴': {
type: 'SUBTABLE',
code: '契約変更履歴',
label: '契約変更履歴',
fields: {
'履歴_変更日': {
type: 'DATE',
label: '変更日',
code: '履歴_変更日'
},
'履歴_変更内容': {
type: 'SINGLE_LINE_TEXT',
label: '変更内容',
code: '履歴_変更内容'
},
'履歴_金額': {
type: 'NUMBER',
label: '金額',
code: '履歴_金額',
digit: true, // 桁区切りあり
unit: '円', // 単位
unitPosition: 'AFTER'
}
}
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', fieldsBody);
console.log('Step 2: フィールド設定完了。ランク説明の計算式も設定済みです。');
// -------------------------------------------------------
// 3. アプリのレイアウト設定
// -------------------------------------------------------
const layoutBody = {
app: appId,
layout: [
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: '顧客コード' },
{ type: 'SINGLE_LINE_TEXT', code: '顧客名' }
]
},
{
type: 'ROW',
fields: [
{ type: 'DROP_DOWN', code: '顧客ランク' },
{ type: 'SINGLE_LINE_TEXT', code: 'ランク説明' } // ランクの横に説明を配置
]
},
{
type: 'ROW',
fields: [
{ type: 'RADIO_BUTTON', code: 'サブスク区分' }
]
},
{ type: 'ROW', fields: [{ type: 'HR', size: { width: 600 } }] },
{ type: 'ROW', fields: [{ type: 'LABEL', label: '▼ 契約変更履歴' }] },
{
type: 'SUBTABLE',
code: '契約変更履歴',
fields: [
{ type: 'DATE', code: '履歴_変更日' },
{ type: 'SINGLE_LINE_TEXT', code: '履歴_変更内容' },
{ type: 'NUMBER', code: '履歴_金額' }
]
}
]
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/layout', true), 'PUT', layoutBody);
console.log('Step 3: レイアウト設定完了');
// -------------------------------------------------------
// 4. 一覧設定(顧客Aランク)
// -------------------------------------------------------
const viewsBody = {
app: appId,
views: {
'顧客Aランク': {
type: 'LIST',
name: '顧客Aランク',
index: 0, // 一番左に表示
// クエリの書き方ドキュメントに基づき記述
filterCond: '顧客ランク in ("A")',
sort: '顧客コード asc',
fields: ['顧客コード', '顧客名', '顧客ランク', 'ランク説明', 'サブスク区分']
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/views', true), 'PUT', viewsBody);
console.log('Step 4: 一覧「顧客Aランク」設定完了');
// -------------------------------------------------------
// 5. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 5: アプリの公開処理を実行中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: appId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: 作成完了です!`);
console.log(`新規作成されたアプリID: ${appId}`);
console.log('作成されたアプリを開いて確認してみてください。');
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: むむっ、エラーが出ますか?', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイのこだわりポイント 🦊
-
ランク説明の自動化:
expressionプロパティを使って、ランクAなら「最優先対応(VIP)」などが自動で入るようにしました。これでマニュアルを見なくても対応レベルが分かります。 - テーブルの単位: 金額フィールドには「円」をつけて、入力ミスを防ぐようにしています。
- 一覧設定: ご指定通り「顧客Aランク」のみを表示する一覧を、アプリを開いた時のデフォルト(一番左)に設定しました。
作成されたアプリIDを確認して、うまく動いているか教えてくださいね!次の改修もいつでもお待ちしています。
ブラウザーでの実行
JavaScriptコードをブラウザーの console にコピペして、「enter」で実行します。
「作成完了!」のメッセージが表示されれば、成功です。
作成された顧客管理アプリ
編集画面は、少し見やすいようにレイアウトされています。
レコード追加、一覧画面表示も問題ないですね。
顧客管理アプリの変更(ドロップダウンに選択肢を追加)
顧客ランクに"S" を追加してみます。
顧客ランクに"S" を追加して
回答
承知しました!
顧客ランクに最上位の**「S」**を追加ですね。
単に選択肢を増やすだけでなく、先ほど設定した**「ランク説明」の自動計算式**もアップデートして、Sランクを選んだ時に特別なメッセージ(例:「特別VIP(役員対応)」)が表示されるように調整しましょう。
今作成したアプリの画面を開いたまま、以下のコードを実行してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 顧客管理アプリ(ランクS追加改修)
*/
(async () => {
try {
// 現在開いているアプリのIDを取得
const appId = kintone.app.getId();
if (!appId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
console.log(`🦊 レイ: 顧客ランクに「S」を追加し、説明文の自動計算もアップデートします!`);
// -------------------------------------------------------
// 1. フィールド設定の更新(ランクS追加 & 計算式修正)
// -------------------------------------------------------
const updateFieldsBody = {
app: appId,
properties: {
'顧客ランク': {
type: 'DROP_DOWN',
options: {
// Sを一番上(index: 0)に追加し、他をずらします
'S': { label: 'S', index: 0 },
'A': { label: 'A', index: 1 },
'B': { label: 'B', index: 2 },
'C': { label: 'C', index: 3 }
}
},
'ランク説明': {
type: 'SINGLE_LINE_TEXT',
// Sランク用の分岐をIF関数の先頭に追加した新しい計算式
expression: 'IF(顧客ランク="S", "特別VIP(役員対応)", IF(顧客ランク="A", "最優先対応(VIP)", IF(顧客ランク="B", "通常対応", "新規・見込み")))'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'PUT', updateFieldsBody);
console.log('Step 1: 顧客ランクの選択肢と、ランク説明の計算式を更新しました。');
// -------------------------------------------------------
// 2. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 2: アプリの公開処理を実行中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: appId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: 改修完了です!`);
console.log(`顧客ランクのドロップダウンに「S」が増えているはずです。`);
console.log(`「S」を選ぶと「特別VIP(役員対応)」と表示されるよう調整しましたよ!`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: おっと、エラーが発生しました。', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイの改修ポイント 🦊
- ドロップダウンの更新: 既存のA, B, Cを残しつつ、先頭に「S」を追加しました。
-
計算式の連動:
ランク説明のIF関数を書き換えて、「S」なら「特別VIP(役員対応)」と表示されるようにしました。
画面をリロードして、レコード追加画面でランク「S」を選んでみてください。説明文がパッと切り替わるはずですよ!
アプリ変更の実行
コードを console にコピペして実行します。
変更結果
顧客ランクに"S" を追加して、ランク説明の計算式も変更されました。
フィールドコードの変更
ラベルと同じ値になっているフィールドコードを英単語に変更してみます。
フィールドコードを小文字の英単語に変更
回答
承知しました!
フィールドコードを**小文字の英語(スネークケース)**に変更して、開発者フレンドリーな構成にリファクタリングしましょう。
こうしておくと、後からAPIでデータ連携をする際にとても扱いやすくなりますよ。
前回の「Sランク追加」の状態を引き継いで、一気にフィールドコードと一覧設定を更新するコードを作成しました。
アプリの画面を開いた状態で、コンソールで実行してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 顧客管理アプリ(フィールドコード英語化リファクタリング)
*/
(async () => {
try {
const appId = kintone.app.getId();
if (!appId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
console.log(`🦊 レイ: アプリ(ID: ${appId}) のフィールドコードを英語名に変更します...`);
// -------------------------------------------------------
// 1. フィールドコードの変更 (日本語 -> 英語)
// -------------------------------------------------------
// キーに「現在のフィールドコード」、値のcodeに「新しいフィールドコード」を指定します
const updateFieldsBody = {
app: appId,
properties: {
// --- 基本情報 ---
'顧客コード': {
type: 'SINGLE_LINE_TEXT',
code: 'customer_code'
},
'顧客名': {
type: 'SINGLE_LINE_TEXT',
code: 'customer_name'
},
// --- ランク・説明 ---
'顧客ランク': {
type: 'DROP_DOWN',
code: 'rank'
},
'ランク説明': {
type: 'SINGLE_LINE_TEXT',
code: 'rank_description',
// 計算式内のフィールドコードも自動で追従しますが、念のため新しいコードで上書き定義します
expression: 'IF(rank="S", "特別VIP(役員対応)", IF(rank="A", "最優先対応(VIP)", IF(rank="B", "通常対応", "新規・見込み")))'
},
// --- サブスク区分 ---
'サブスク区分': {
type: 'RADIO_BUTTON',
code: 'subscription'
},
// --- 契約変更履歴テーブル ---
'契約変更履歴': {
type: 'SUBTABLE',
code: 'contract_history',
fields: {
'履歴_変更日': {
type: 'DATE',
code: 'history_date'
},
'履歴_変更内容': {
type: 'SINGLE_LINE_TEXT',
code: 'history_content'
},
'履歴_金額': {
type: 'NUMBER',
code: 'history_amount'
}
}
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'PUT', updateFieldsBody);
console.log('Step 1: フィールドコードの英語化完了!');
// -------------------------------------------------------
// 2. 一覧設定の更新 (新しいフィールドコードを反映)
// -------------------------------------------------------
const viewsBody = {
app: appId,
views: {
'顧客Aランク': {
type: 'LIST',
name: '顧客Aランク',
index: 0,
// フィルタ条件とソート条件も新しいコードで書き換えます
filterCond: 'rank in ("A")',
sort: 'customer_code asc',
fields: ['customer_code', 'customer_name', 'rank', 'rank_description', 'subscription']
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/views', true), 'PUT', viewsBody);
console.log('Step 2: 一覧設定の参照コードも更新しました。');
// -------------------------------------------------------
// 3. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 3: アプリの公開処理を実行中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: appId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: リファクタリング完了です!`);
console.log(`フィールドコードが以下のように生まれ変わりました。`);
console.log(`・顧客コード -> customer_code`);
console.log(`・顧客ランク -> rank`);
console.log(`・契約変更履歴 -> contract_history`);
console.log(`など... 設定画面で確認してみてくださいね!`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: おっと、エラーですね。詳細を確認しましょう。', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイのこだわりポイント 🦊
-
命名規則の統一: 全て小文字の「スネークケース(例:
customer_code)」で統一しました。JavaScriptなどから操作する際に直感的に書けるようになります。 -
計算式の再定義: フィールドコード変更時、kintoneは自動で計算式内のコードも追従してくれますが、今回はコード内で明示的に新しい式(
rank="S"など)を送信することで、設定の整合性を確実に担保しています。 -
一覧のメンテナンス: 一覧の絞り込み条件(
filterCond)は自動追従しないことがあるため、スクリプト内で確実に新しいコード(rank)を使った条件式に書き換えています。
これでシステム連携もバッチリな、プロ仕様のアプリ構成になりましたよ!
実行
コードをコピペして実行します。
結果
フィールドコードが英単語に変更されました。
顧客名を重複不可に設定
制約の変更を行ってみます。
顧客名を重複不可に設定
回答
承知しました!
**「顧客名(customer_name)」**を重複登録できないように設定変更ですね。
これで同名の顧客が誤って二重登録されるのを防ぐことができます。データの品質を守る大切な設定です!
以下のコードをコンソールで実行してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 顧客管理アプリ(顧客名の重複禁止設定)
*/
(async () => {
try {
const appId = kintone.app.getId();
if (!appId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
console.log(`🦊 レイ: アプリ(ID: ${appId}) の「顧客名」を重複禁止に設定します...`);
// -------------------------------------------------------
// 1. フィールド設定の更新 (重複禁止をON)
// -------------------------------------------------------
const updateFieldsBody = {
app: appId,
properties: {
'customer_name': { // 英語化したフィールドコードを指定
type: 'SINGLE_LINE_TEXT', // 設定変更時もフィールドタイプの指定は必須です
unique: true // 重複を禁止する設定
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'PUT', updateFieldsBody);
console.log('Step 1: 「顧客名」の重複禁止設定を反映しました。');
// -------------------------------------------------------
// 2. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 2: アプリの公開処理を実行中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: appId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: 設定完了です!`);
console.log(`これで同じ「顧客名」は登録できなくなりました。`);
console.log(`試しに同じ名前で保存しようとするとエラーが出るはずですよ!`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: おっと、エラーが発生しました。', error);
// 既存データに既に重複がある場合、このエラーが出ることがあります
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイの解説 🦊
-
unique: true: これが「値の重複を禁止する」という設定です。 - 注意点: もし既に登録されているデータの中に「同じ顧客名」が存在する場合、このAPIを実行するとエラーになります。その場合は、先に重複データを修正してから再度実行してくださいね。
画面をリロードして確認してみてください!
実行
コードをコピペして実行します。
結果
顧客名が重複禁止に設定されました。
案件管理アプリ作成
案件管理アプリを作成して
顧客管理アプリをルックアップして、顧客名と顧客ランクをコピー
顧客管理アプリの画面で、実行します
回答
承知しました!
今開いている**「顧客管理アプリ」をマスタとして参照(ルックアップ)し、顧客情報とランクを自動で引き出せる「案件管理アプリ」**を新規作成します。
ルックアップ機能を使うことで、案件を入力する際に顧客名を選ぶだけで「ランク」も自動的にコピーされるようになります。これで入力ミスも減らせますね!
以下のコードを顧客管理アプリの画面で実行してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 案件管理アプリ(顧客管理連携・ルックアップ実装)
*/
(async () => {
// 1. 現在のアプリ(顧客管理)のIDを取得
const sourceAppId = kintone.app.getId();
if (!sourceAppId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
try {
console.log(`🦊 レイ: 顧客管理アプリ(ID: ${sourceAppId}) と連携する「案件管理アプリ」を構築します...`);
// -------------------------------------------------------
// 2. 案件管理アプリの新規作成
// -------------------------------------------------------
const createAppBody = { name: '案件管理アプリ' };
const createResp = await kintone.api(kintone.api.url('/k/v1/preview/app', true), 'POST', createAppBody);
const targetAppId = createResp.app;
console.log(`Step 1: 案件管理アプリの枠を作成しました... App ID: ${targetAppId}`);
// -------------------------------------------------------
// 3. フィールド設定(ルックアップ実装)
// -------------------------------------------------------
const fieldsBody = {
app: targetAppId,
properties: {
// --- 案件基本情報 ---
'案件名': {
type: 'SINGLE_LINE_TEXT',
label: '案件名',
code: 'project_name',
required: true
},
// --- ルックアップ設定 (ここが重要!) ---
'顧客名': {
type: 'SINGLE_LINE_TEXT', // コピー元(customer_name)と同じ型
label: '顧客名(ルックアップ)',
code: 'customer_name',
required: true,
lookup: {
relatedApp: { app: sourceAppId }, // 連携先のアプリID
relatedKeyField: 'customer_name', // キーにするフィールド(重複禁止必須)
lookupPickerFields: ['customer_name', 'rank'], // 選択時に表示する項目
fieldMappings: [
{ field: 'rank', relatedField: 'rank' } // コピー設定 (こちらのrank <- 向こうのrank)
]
}
},
// --- コピー先フィールド ---
'顧客ランク': {
type: 'SINGLE_LINE_TEXT', // ドロップダウンの値を受け取るため文字列1行で作成
label: '顧客ランク',
code: 'rank'
},
// --- その他 案件情報 ---
'受注予定日': {
type: 'DATE',
label: '受注予定日',
code: 'target_date'
},
'受注金額': {
type: 'NUMBER',
label: '受注金額',
code: 'amount',
digit: true,
unit: '円',
unitPosition: 'AFTER'
},
'詳細': {
type: 'MULTI_LINE_TEXT',
label: '詳細',
code: 'description'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', fieldsBody);
console.log('Step 2: フィールド設定完了(ルックアップ連携済み)');
// -------------------------------------------------------
// 4. レイアウト設定
// -------------------------------------------------------
const layoutBody = {
app: targetAppId,
layout: [
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'project_name' }
]
},
{ type: 'ROW', fields: [{ type: 'LABEL', label: '▼ 顧客情報(取得ボタンで自動入力)' }] },
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'customer_name' }, // [取得]ボタンが付きます
{ type: 'SINGLE_LINE_TEXT', code: 'rank' } // 自動で値が入ります
]
},
{ type: 'ROW', fields: [{ type: 'HR', size: { width: 600 } }] },
{
type: 'ROW',
fields: [
{ type: 'DATE', code: 'target_date' },
{ type: 'NUMBER', code: 'amount' }
]
},
{
type: 'ROW',
fields: [
{ type: 'MULTI_LINE_TEXT', code: 'description', size: { innerHeight: 100 } }
]
}
]
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/layout', true), 'PUT', layoutBody);
console.log('Step 3: レイアウト設定完了');
// -------------------------------------------------------
// 5. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 4: 案件管理アプリを公開処理中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: targetAppId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: 連携アプリの完成です!`);
console.log(`新規作成された案件管理アプリID: ${targetAppId}`);
console.log(`\n【使い方】`);
console.log(`1. 作成された「案件管理アプリ」を開く`);
console.log(`2. レコード追加画面で「顧客名」の[取得]ボタンを押す`);
console.log(`3. 顧客管理アプリのデータを選択すると、ランクも自動入力されます!`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: おっと、エラーが発生しました。', error);
// ルックアップ元の重複禁止設定が漏れている場合によくエラーになります
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイの解説 🦊
-
ルックアップの設定 (
lookup): ここが肝です!relatedAppで今のアプリを指定し、fieldMappingsで「こちらのランク」に「向こうのランク」をコピーするように指示しています。 - 型の整合性: コピー元の「顧客名」と同じフィールドタイプ(文字列1行)で受け皿を作っています。
-
前提条件: このコードが成功するには、前回の作業で顧客管理アプリの「顧客名(
customer_name)」が重複禁止になっていることが必須条件です。もしエラーが出たら、そこをチェックしましょう!
作成されたアプリで「取得」ボタンを押す瞬間、気持ちいいですよ!ぜひ試してみてください。
実行(エラー)
アプリ作成がエラーになりました。
エラー解析
エラーメッセージをコピペして、対策を依頼します。
{
"code": "CB_VA01",
"id": "rLVtnIRS7DXFCGlmVkWu",
"message": "入力内容が正しくありません。",
"errors": {
"properties[受注金額].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
},
"properties[顧客ランク].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
},
"properties[顧客名].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
},
"properties[詳細].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
},
"properties[案件名].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
},
"properties[受注予定日].code": {
"messages": [
"JSONオブジェクトのキーに指定したフィールドコードと一致しません。"
]
}
}
}
エラー解析・対策
おっと、申し訳ありません!
kintone APIの厳密なルールに引っかかってしまいました。
エラーメッセージ JSONオブジェクトのキーに指定したフィールドコードと一致しません の通り、フィールドを追加する際(POST)は、「プロパティのキー名」と「中の code」を完全に一致させる必要があります。
先ほどのコードでは、キーを日本語('案件名')、コードを英語('project_name')にしていたため、ここで整合性エラーが発生しました。
修正版のコードを用意しました!
キーをすべて英語のフィールドコードに統一しています。こちらを**「顧客管理アプリ」の画面**で実行してください。
※ さきほどのエラーで「中身が空っぽの案件管理アプリ」が作成されてしまっている可能性があります。もしアプリ一覧に空のアプリがあれば、後で削除してください。
/**
* 🦊 kintone App Meister Ray's Work
* Project: 案件管理アプリ(顧客管理連携・修正版)
* Description: キーとフィールドコードを一致させ、確実に作成します
*/
(async () => {
// 1. 現在のアプリ(顧客管理)のIDを取得
const sourceAppId = kintone.app.getId();
if (!sourceAppId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
try {
console.log(`🦊 レイ: リカバリー実行!顧客管理アプリ(ID: ${sourceAppId}) と連携する「案件管理アプリ」を再構築します...`);
// -------------------------------------------------------
// 2. 案件管理アプリの新規作成
// -------------------------------------------------------
const createAppBody = { name: '案件管理アプリ' };
const createResp = await kintone.api(kintone.api.url('/k/v1/preview/app', true), 'POST', createAppBody);
const targetAppId = createResp.app;
console.log(`Step 1: 案件管理アプリの枠を作成しました... App ID: ${targetAppId}`);
// -------------------------------------------------------
// 3. フィールド設定(修正版:キーとcodeを統一)
// -------------------------------------------------------
const fieldsBody = {
app: targetAppId,
properties: {
// --- 案件基本情報 ---
'project_name': { // キーを code と同じ 'project_name' に修正
type: 'SINGLE_LINE_TEXT',
label: '案件名',
code: 'project_name',
required: true
},
// --- ルックアップ設定 ---
'customer_name': { // キーを code と同じ 'customer_name' に修正
type: 'SINGLE_LINE_TEXT',
label: '顧客名(ルックアップ)',
code: 'customer_name',
required: true,
lookup: {
relatedApp: { app: sourceAppId }, // 連携先のアプリID
relatedKeyField: 'customer_name', // キーにするフィールド
lookupPickerFields: ['customer_name', 'rank'],
fieldMappings: [
{ field: 'rank', relatedField: 'rank' }
]
}
},
// --- コピー先フィールド ---
'rank': { // キーを code と同じ 'rank' に修正
type: 'SINGLE_LINE_TEXT',
label: '顧客ランク',
code: 'rank',
noLabel: false
},
// --- その他 案件情報 ---
'target_date': { // キーを code と同じ 'target_date' に修正
type: 'DATE',
label: '受注予定日',
code: 'target_date'
},
'amount': { // キーを code と同じ 'amount' に修正
type: 'NUMBER',
label: '受注金額',
code: 'amount',
digit: true,
unit: '円',
unitPosition: 'AFTER'
},
'description': { // キーを code と同じ 'description' に修正
type: 'MULTI_LINE_TEXT',
label: '詳細',
code: 'description'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', fieldsBody);
console.log('Step 2: フィールド設定完了(整合性チェックOK)');
// -------------------------------------------------------
// 4. レイアウト設定
// -------------------------------------------------------
const layoutBody = {
app: targetAppId,
layout: [
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'project_name' }
]
},
{ type: 'ROW', fields: [{ type: 'LABEL', label: '▼ 顧客情報(取得ボタンで自動入力)' }] },
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'customer_name' },
{ type: 'SINGLE_LINE_TEXT', code: 'rank' }
]
},
{ type: 'ROW', fields: [{ type: 'HR', size: { width: 600 } }] },
{
type: 'ROW',
fields: [
{ type: 'DATE', code: 'target_date' },
{ type: 'NUMBER', code: 'amount' }
]
},
{
type: 'ROW',
fields: [
{ type: 'MULTI_LINE_TEXT', code: 'description', size: { innerHeight: 100 } }
]
}
]
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/layout', true), 'PUT', layoutBody);
console.log('Step 3: レイアウト設定完了');
// -------------------------------------------------------
// 5. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 4: 案件管理アプリを公開処理中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: targetAppId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: お待たせしました!今度こそ完成です。`);
console.log(`新規作成された案件管理アプリID: ${targetAppId}`);
console.log(`画面をリロードして、新しいアプリを確認してくださいね。`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: まだエラーが出ますか?詳細を教えてください!', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイの修正ポイント 🦊
-
キーとコードの一致:
properties内の定義を'project_name': { ... code: 'project_name' }のように完全に一致させました。これでAPIのバリデーションを通過します。
今度こそ大丈夫です!実行してみてください。
実行(成功だがスペース未設定)
今度は大丈夫そうですが、スペース位置未指定でした。
案件管理アプリは、作成されましたがスペース未設定でした。
先ほど作成失敗した案件管理アプリも運用前の状態で残っています。
- アプリ一覧
アプリのスペース移動
作成は成功しましたが、スペースを未設定でした。
下記のスペースに移動して
案件管理アプリ app: 3859
space:333
thread:376
申し訳ありません!
実は kintone REST API の仕様上、「一度作成したアプリを後からAPIでスペースに移動すること」はできないのです(GUIの設定画面からなら可能な場合もありますが、APIでは提供されていません)。
ですので、ご指定のスペース(ID: 333)の中に、正しい設定で「案件管理アプリ」を作り直しましょう!
作成済みのアプリ(ID: 3859)は、後ほど手動で削除をお願いします。
以下のコードを、先ほどと同じく**「顧客管理アプリ」の画面**で実行してください。
※ 今度は確実にスペースの中に作成します!
/**
* 🦊 kintone App Meister Ray's Work
* Project: 案件管理アプリ(スペース指定・再構築版)
* Target: Space ID 333, Thread ID 376
*/
(async () => {
// 1. 現在のアプリ(顧客管理)のIDを取得
const sourceAppId = kintone.app.getId();
if (!sourceAppId) {
console.error('🦊 レイ: 必ず「顧客管理アプリ」の画面で実行してください!');
return;
}
try {
console.log(`🦊 レイ: スペース(333)内に、顧客管理アプリ(ID: ${sourceAppId}) と連携する「案件管理アプリ」を新規作成します...`);
// -------------------------------------------------------
// 2. 案件管理アプリの新規作成(スペース指定)
// -------------------------------------------------------
const createAppBody = {
name: '案件管理アプリ',
space: 333,
thread: 376
};
const createResp = await kintone.api(kintone.api.url('/k/v1/preview/app', true), 'POST', createAppBody);
const targetAppId = createResp.app;
console.log(`Step 1: スペース内にアプリを作成しました... App ID: ${targetAppId}`);
// -------------------------------------------------------
// 3. フィールド設定
// -------------------------------------------------------
const fieldsBody = {
app: targetAppId,
properties: {
// --- 案件基本情報 ---
'project_name': {
type: 'SINGLE_LINE_TEXT',
label: '案件名',
code: 'project_name',
required: true
},
// --- ルックアップ設定 ---
'customer_name': {
type: 'SINGLE_LINE_TEXT',
label: '顧客名(ルックアップ)',
code: 'customer_name',
required: true,
lookup: {
relatedApp: { app: sourceAppId }, // 連携先のアプリID
relatedKeyField: 'customer_name', // キーにするフィールド
lookupPickerFields: ['customer_name', 'rank'],
fieldMappings: [
{ field: 'rank', relatedField: 'rank' }
]
}
},
// --- コピー先フィールド ---
'rank': {
type: 'SINGLE_LINE_TEXT',
label: '顧客ランク',
code: 'rank',
noLabel: false
},
// --- その他 案件情報 ---
'target_date': {
type: 'DATE',
label: '受注予定日',
code: 'target_date'
},
'amount': {
type: 'NUMBER',
label: '受注金額',
code: 'amount',
digit: true,
unit: '円',
unitPosition: 'AFTER'
},
'description': {
type: 'MULTI_LINE_TEXT',
label: '詳細',
code: 'description'
}
}
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/fields', true), 'POST', fieldsBody);
console.log('Step 2: フィールド設定完了');
// -------------------------------------------------------
// 4. レイアウト設定
// -------------------------------------------------------
const layoutBody = {
app: targetAppId,
layout: [
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'project_name' }
]
},
{ type: 'ROW', fields: [{ type: 'LABEL', label: '▼ 顧客情報(取得ボタンで自動入力)' }] },
{
type: 'ROW',
fields: [
{ type: 'SINGLE_LINE_TEXT', code: 'customer_name' },
{ type: 'SINGLE_LINE_TEXT', code: 'rank' }
]
},
{ type: 'ROW', fields: [{ type: 'HR', size: { width: 600 } }] },
{
type: 'ROW',
fields: [
{ type: 'DATE', code: 'target_date' },
{ type: 'NUMBER', code: 'amount' }
]
},
{
type: 'ROW',
fields: [
{ type: 'MULTI_LINE_TEXT', code: 'description', size: { innerHeight: 100 } }
]
}
]
};
await kintone.api(kintone.api.url('/k/v1/preview/app/form/layout', true), 'PUT', layoutBody);
console.log('Step 3: レイアウト設定完了');
// -------------------------------------------------------
// 5. アプリの公開 (Deploy)
// -------------------------------------------------------
console.log('Step 4: 案件管理アプリを公開処理中...');
await kintone.api(kintone.api.url('/k/v1/preview/app/deploy', true), 'POST', { apps: [{ app: targetAppId }] });
// -------------------------------------------------------
// 完了メッセージ
// -------------------------------------------------------
console.log('-------------------------------------------------------');
console.log(`🎉 レイ: リカバリー完了です!`);
console.log(`指定のスペース内に、新しい案件管理アプリ(ID: ${targetAppId})を作成しました。`);
console.log(`※ 古いアプリ(ID: 3859) は不要であれば手動で削除をお願いします。`);
console.log('-------------------------------------------------------');
} catch (error) {
console.error('🦊 レイ: エラーが発生しました。詳細を確認しましょう。', error);
if (error.error) console.error(JSON.stringify(error.error, null, 2));
}
})();
レイのリカバリーポイント 🦊
-
spaceとthreadパラメータ: アプリ作成時のパラメータにこれらを追加することで、指定されたスペース(ID: 333)のスレッド(ID: 376)内にアプリを配置しました。 - 完全な再構築: 一度アプリを作り直す形になりますが、フィールド設定やレイアウトは前回成功した設定をそのまま引き継いでいるので安心してください。
これでスペース内にアプリが出来上がります!確認をお願いします。
スペース内アプリ作成実行
案件管理アプリ
ルックアップを顧客名で行ってしまった。
「顧客コードでルックアップ」という要件を指定しましょう。

















