https://jumilla.me/riotjs-good-vibes
こんにちは、フミリアです。
超軽量Webコンポーネントライブラリ Riot.js を使って自分用のWebアプリを書き始めています。
Webページをモジュール化して構築できるのと、node上でのビルドなしでさくっとUIが確認できる2点がとても楽です。
テキストエディタでHTMLページをコツコツ書いていた1990年代を思い出します。 ファイル拡張子はもちろん
.html
です。
PHPは「HTMLにスクリプトを埋め込む」という発想で作られたもので include文 や require 文を使うとHTMLの中身をモジュール化できますが、CSSが担当している「見た目」をモジュールに内包することはできませんでした。
HTMLベースのWebコンポーネントは、Scoped CSSも埋め込めるし、スクリプトはWebブラウザがエンジンを積んでいるJavaScriptです。 CSSとJavaScriptがHTMLのタグの中に書けるので、UIモックにガシガシ動きをつけられます。 サーバーサイドの実装なしでページ遷移、ページ内画面遷移を書けてます。 開発効率が格段に良いですし、画面のレスポンスも速い速い。 クライアントサイドの実装を100%終えてからデータベースを考えることもできそうです。
Webフレームワークを探し始めて2年半、ようやく自分用のWebアプリを書く気になれました。
Laravelはとても使い勝手のよいPHPフレームワークですので、サーバーサイドの実装に引き続き利用していきます。 LaravelのBladeテンプレートエンジンは、HTMLのガワに初期データを埋め込むくらいしか使わなくなりました。 プログラミング志向(同じことを2回書きたくない思考)でWebページを書く時代の到来です。 バックエンドエンジニアもJavaScriptやりましょう!
・・・とはいえ、Riot関連のパッケージはまだまだ少なく、「便利な道具」が足りなかったので作ったら、3つできました。 npmで配信設定済み。 ドキュメント、テストは順次整備していきます。
- riot-dispatcher
- Laravelライク、Expressライクな記法でルーティングが書けます。
- ページハッシュ (#/xx/yy/zz) のルーティングライブラリです。
- https://github.com/jumilla/riot-dispatcher
- riot-booster
- Bootstrap4(alpha) をRiot向けにコンポーネント化してるもの。
- https://github.com/jumilla/riot-booster
- pasiri
- HTTPリクエストをfetch()してくれるヤツ。モックを注入すればfakeオブジェクトを返せます。
- https://github.com/jumilla/pasiri
0 件のコメント:
コメントを投稿