![見出し画像](https://assets.st-note.com/production/uploads/images/85712010/rectangle_large_type_2_30eb06e6b4d46f825bfe493994426375.png?width=800)
師匠と私-Season1_ch.4☆HELLO WORLD!ふたたび。イカルくん🐬登場!
ー前回までのあらすじー
kintoneアプリプラグインを作る「イカル☆プラグイン」プロジェクト
こんどこそJavaScriptのコーディングをスタート!
※cybozu developer networkのことはCDNと略してます。
イカルプラグインのコンセプト。
kintoneレコード詳細画面を開くと、イルカのポップアップを出します。そのため、イカル(イルカの画)を用意する必要があります。
![](https://assets.st-note.com/production/uploads/images/86089079/picture_pc_65d1607cc23264a12f80c0f91d8088eb.gif)
本家にならってドット絵で作成したいな。と思ってたら、無料のお絵描きソフトがあり、すぐに作成できました。
イカルくんの用意はバッチリです。
![](https://assets.st-note.com/img/1662189795253-gFnOQYBClU.png)
さて、VSCodeを立ち上げて、コードを書いていきます。
(ここまでJavaScriptのコーディングなしなんて、師匠に怒られます)
いきなり全部は無理なのでいったん実装したいことを考えます。
①イベント:レコード詳細画面を開くとき
②ふるまい:ポップアップが表示される
※文字入力機能がある
文字入力フォームがある画面をだす。ここまでにします。
なんだか分解して書けそうです。
①書き出しとkintoneアプリイベントはCDNサイトにあります。
例文もあったのでこのとおりにすればいいはずです。
(() => {
'use strict';
kintone.events.on('app.record.detail.show',(event) => {
//レコード詳細画面を表示したときのイベント
});
②JavaScriptの機能で、フォームがありました。
これは使えそう。
ところで文字入力フォームを作るのは、いくつか方法があるみたいでどれが最適かわかりません。全部そろってそうなのでこちらの記述にしました。
//文字入力ポップアップ表示させる
prompt('検索ワードを入力してください');
作成したJavaScriptファイルをアプリに取り込みます。
…うごかない。なにも。反応なし。
いろいろ試して
()}が足りない、そしてイベントリターンがなかったためと判明。
return event;
});
})();
※後で師匠に「かっこが足りなかったために動かなかった」と報告したところ「JavaScriptなんかだと、最初 "{" と最後の "}" が離れすぎてるから、よくあることじゃよ」と言ってました。プロでもそうなんだ、と安心。
…なんとか実装できました!
![](https://assets.st-note.com/img/1662545098928-yRxukaFXcH.png)
ここで、なつかしい思い出がよみがえります。
初めてHTMLをメモ帳で書いてブラウザで表示した時のこと。
指定した背景色や文字がでてきたときのうれしい気持ち!
HELLO WORLD!
コーディングは楽しい!
とりあえずの成果を見せるか悩んだ挙句、
師匠に現状を報告することにしました。
・イカルの画できました。
・レコード詳細画面を開いたらポップアップできました。
・入力フォームついてます。
(文字を入力しても何も起きません)
・HTMLでイカルの表示はつくってみました。
(ほんとはこっちを表示させたい)
たった数行書いただけのシロモノです。
ちょっと調べれば誰でもかけます。
(ぶわっかもーん、入力フォームあるのに何も起きないとは何事じゃ?)
怒られると思ったのですが。
「すごいぞ。よくできとるのう!」
めちゃくちゃ褒めてくれました。まるで小学生がはじめてできたみたいに喜んでくれたのです。
「全然作りこみできてないですよ、入力フォームが、フォームの機能ないんですよ?完成度低いですよ?」
「ここまで作れたことがすごいんじゃ!準備して、コードを書くまでに手間があるので、途中でやめてしまう人がおる。(完成度はおいといて)ともかく何かを完成させるのが大事なのじゃ。」
師匠の教えは、
理屈より手を動かせ、細かいことはおいといてとりあえず完成する、でした。
やっぱり現役プログラマーだと、気安く「ちょっと教えてよ」と言われるのでしょうね。いままで何も完成させずに終わった人を見てきたのでしょうね。
教えを乞うには、本気でやらないと、と思いました。
(プロジェクト自体は遊びですけどね)
このプロジェクトのおかげで、完成した時のうれしさ、コーディングの楽しさを取り戻したのですから。
最後まで作り上げようと誓いました。
さて、つぎの課題を話してたところ、矢継ぎ早に情報を投げられました。
「これで解決するかもしれないぞ、この記事、あ、これも、これも見ておくのじゃ」
う、言っている意味が、わからない。。
夏休みも終わりなのに、宿題をどっさりだされた小学生の気分です。
…ch.5へ続く
この記事が気に入ったらサポートをしてみませんか?