先日からアフィサイトにチャットボットの作品検索UIを付けて売上の増大を企てている。
サーバ側の、会話と作品選択処理は一応完成して、今はTwitterの会話対応をやらせている。
twitter.com
その機能のREST APIもcurlでは意図通り動くようになった。
後はWebブラウザ上で動くRESTクライアント機能を作れば部品は全部揃うのだがあいにく私はJavaScriptの読み書きができぬ。人に頼むと金が掛かるし仕事でもないのに(いや相手にとっては仕事か…)外注とやり取りなどしたくないので、やっぱ自分で作る事にする。Javaは読み書きできるのでScriptも多分似たようなものだろう。名前も似てるし。
ネットで調べた所、最近はReact、Angular、Vue.jsというのが流行っており、中でも一番簡単なのがVue.jsだと聞く。
本屋で入門書を立ち読み比較すると、ReactとAngulerはまず最初にウィザードで雛型ファイル群をドカッと生成して以後はそれらのファイルを書き換えていく、もはやそれはホームページ作成というよりVC++のようなWindowsアプリケーション作成。これらを完成させたとして、既存のWebページの一部に入れるのはどうすれば良いのかちょっと見当がつかない。フレーム使うのかしら。その点Vue.jsというのはscript srcでCDNを指定すれば良いらしく、それなら既存のWebページに組み入れるのはできそう。うむ、Vue.jsで行こう。
Vue.jsはただいま流行中とのことで本も色々出ているが、本文のフォントが大きく、また表紙にはネコのゆるキャラっぽいイラストが書いてある本書こそが、何か一番ユルそうなのでこれを買った。何事も入門書はユルい事が肝要。格好つけていきなりオライリーとか行くのは愚の骨頂。書籍の大きさもA5サイズで大変結構。コンピュータ本は無駄に巨大なのが多くて邪魔になるからな。目次も一応ざっと見たけど知りたい事は書いてありそうだったし。
という訳で全328ページ中の40ページまでしか読んでないけど、早速サンプルで実験を。まず一番気になる点から。
nekora.main.jp
うむ。既存のWebページの一部にVue.jsの処理する領域を組み込む事は問題無く出来た。また、テキストを入力して画面の再読み込み抜きに表示を変える事もできた。大体ＯＫだ。行けそうな気がする。サンプルでは素のテキストの個所をBulmaのお洒落コンポーネントにすればきっとTwitterっぽい見た目になるだろう。
後は肝心のREST処理と、応答待ちの間に何かクルクルアニメでも表示してユーザの操作を防ぐ方法だが…これはVue.jsの解説本なので当然の事ながらJavaScriptによるソケット通信の方法などは記載されておらず、そこはまた別途調べねばなるまい…。たしか昔、Ajaxというのが流行ったのできっとその辺だろう。
まぁまずは、本書の内容を覚えているうちにBulmaのコンポーネントで作品データをお洒落表示する個所だな。多分、本書のSection10、P70～の内容を理解すれば出来ると思われる。
ただ、先ほどから、迂闊に書き換えては動かなくなり原因不明で元のバージョンに戻しても直らない、何故だーと暫く唸っていると直る、恐らくブラウザのキャッシュが関連しているのではないか？と思われる現象にしばしば遭遇しておりJavaScriptは中々難しい…。やっぱ文法ミスを実行時に検出というのは好きになれん。Javaなら実行時どころかソースコードを入力している最中にEclipseが指摘してくるというのに。やっぱJavaScript用のLint的な文法チェッカを覚えないといかんっぽいな。
シーアンドアール研究所 (2018-05-29)
売り上げランキング: 2,031
![JavaデベロッパーのためのEclipse完全攻略[4.x対応版]](https://images-fe.ssl-images-amazon.com/images/I/616I3atMQKL._SL160_.jpg)
