サーバレスシングルページアプリケーションって？
まだ完全にわかっていないけど、動的なWebページをサーバアクセスを行わずに表示しようというアプリケーションらしい。上手く言えないけど、ページを一度読んだだけであとはブラウザ側でJavaScriptを動かして動的な表示を行うようだ。
もちろん全く静的なWebページなんて今時ないし、なんらかのデータアクセスをバックエンドに対して行うことにはなるんだけど、それをサーバ側でhtmlを生成せずにデータだけとってきてhtmlは最初にロードしたものをJavaScriptで書き直したりして表示を変える。それでシングルページってことなんだろう。
勉強している開発の仕方
いわゆるテストファースト。なのでテスト環境を整え、先にテストコードを書いてからそれが動くように実装を進めていく。
とはいえアプリケーションが動く最初のページだけは作っておく必要がある。それをロードすることでアプリケーションのJavaScriptが動き始めるようにする必要があるからだ。基本的には使ういろいろなスクリプトのロードと、なにか文字でも表示するようなものでいい。デザインができていればその最初のページだけを作っておくといいかもしれない。
テストファーストで開発したことはずいぶん昔にある。Rubyで四元数のライブラリを書いたときだった。内部関数ごとにテストを書いておくことで仕様が明確になるし、テストをすることで実装がどこまで進んだか数値化できるのも良かった。もちろんテストは何度も走らせるので実装に対する自信もついてくる。
今回はこの開発方法をするためにJasmineというライブラリを使う。まだどんなものか詳細にはわかっていないが、テストページを開くとテストが実行されてエラーが見られるし、全体の進捗状況もわかるのだ。
もう一つ。ブラウザでテストを行うときには、ページのリロードが必要になる。書き換えたスクリプトをちゃんと読み込み直さなければいけないのだ。
そのためには「ライブページ」というのを使う。
そうだ。テスト環境のもう一つの要素を忘れていた。ブラウザだ。ブラウザはChromeを使っている。その拡張機能として「ライブページ」というのがあるのだ。これを起動しておくと自動的にリロードを繰り返してくれる。
もう一つ。サーバーレストはいえ、httpサーバは必要だ。Pythonでローカルで動くhttpサーバがあるので、それを起動しておく。
これだけ用意しておけばほぼパソコンの中で開発ができる。
ただしインターネットは必須だ。なぜならjQueryとか使うでしょ？
しかしハマることがある
Jasmineのテスト画面は、ライブページでリロードされ続けているので裏のJavaScriptを書き直すと即座にテスト結果を表示してくれる。はずだ。
はずだというのは、そうならなかったことがよくあったということである。別にJasmineが悪いわけではなく、自分で書いたJavaScriptが間違っているときだ。
コンパイルとかするわけではないのでほんのちょっとした間違いでスクリプトが止まってしまい、うんともすんとも言わないのである。カッコの組み合わせを間違えたとか、カンマを書き忘れたとか、いろいろあるが、老眼の目にはこれを見つけるのが結構辛い。
世の中には構文チェッカーと言うものがあるようである。それはまた今度。
まとめ
というわけで、じわじわと開発の仕方を覚えていっているところである。JavaScriptはなかなか面白い言語である。まだ開発環境を整えている段階だが、画面が動くようになってきたらさらにおもしろくなってくるだろう。クラウドサービスを利用するのも楽しみである。
やっぱりプログラミングは楽しいのだ。
Follow me!
