MaterialDesignLite とVue.Jsを触る

最近のWEB事情にはあまりついっていけてないなーと感じたので
使ったこのない技術で、軽量で安いサーバー(できれば無料)で動作する
小さなWEBシステムを作ってみた。

使用したライブラリ

フロント

MaterialDesignLite+Vue.Js+axios.js
理由
・Jqueryは使わない縛り。
・マテリアルデザインに触れたい。

サーバーサイド

Slim(Php)+SqLite
理由
・必要なのはデータのインアウトとルーティングのみ
・故にできるだけシンプルに。

上記のうちSqLiteについては、特に新しいものでもなんでもない。
個人的今まで機会がなかったのと、PHP(DB無)だけなら無料で使えるサーバーがあり
そこで動かせればという理由から採用。

結果

サーバーサイドは快適に作れたが、問題だったのはフロント。
今時の新しい技術なので、いまさらブラウザのこととか意識せんでいいのかと思っていたら、結構いろいろ罠あり。

1.MaterialDesignLiteのダイアログがIphoneで動作しない。
 ライブラリのロジックまでたどってないけど、とりあえず使えなかった。
2.URLSearchParamsが使えない
 Juqueryを使わない縛りのため、ajaxを使用できないので、代わりにaxios.jsを使用。
このライブラリのドキュメントで、のパラメータ渡しサンプルのところで普通に使ってたのでなんの疑いもなく使用してたが、IeとEdgeで落ちるところあり。
何で?としらべるとURLSearchParamsで落ちてる。
URLSearchParamsの対応状況を調べると、IeとEdge対応なし!
おい!
他にも、公式じゃないけど、サンプルみてたら結構letを使用してるものもあったり。
なんやろ、Ieはほっとくとしても最近の風潮はブラウザ全対応はしない感じなんかな・・。
3.assign
別の仕事でassignを使用している仕組みがあって
(恐らくPC限定だったんでしょうが)、便利なので何も考えずつかってたらIphone未対応・・

結論

Good

・Vue自体は、簡単軽量で優秀、端末対応もほぼ問題はなくかなり気に入っている!
・Vueの値のバイディングと、MDLの動的部分が重なるとソースが劇的に少なくなる。
・なのでMaterialDesignLiteとVueは親和性が非常に高いと思う。
・SqlLiteは、単なるファイルで、本来複数の同時更新には対応してないわけだけど、テストしてみた結果、数十人くらいののオペレーション(単一行)ならまったく問題なさそう。システムが厳密なものではないなら問題なし。
・バックアップもコピーでいいし、メンテナンスも「DB Browser for SQLite」を使えばめちゃ快適。
・Slimは、ルーティングしか使ってないので多くは語れないけど、導入しやすく軽量で気に入ってる。今後もつかってみたい。

Bad

・MDlは、動的なコンポーネントについはブラウザの対応状況を確認する必要がある(IPhoneには冷たそう)。
・サンプルを探すためググった際、でてくるのは具体的にシステムを運用したサンプルではなく、ただ動くのを試した的なブログが多い(もちろん情報としてはありがたいですが・・)。なのでフレームワークと関係のないjsの記述には公的ドキュメントでも注意が必要。

所感

なんか最近のサーバー早いし、bootstrapとかPureみたいなCSSだけのフレームワークとサーバーサイドだけ(昔っぽく毎動作毎にページを繰る)で作っちゃうのもありなような気がしました。
あと、SQLiteってトランザクションもちゃんとあるの知らんかった(簡易なDBなのでないものと思い込んでた・・)。意外とやるのね。

0 件のコメント :

コメントを投稿