Vue.js周りの情報を整理していきたい

Vue.js

はじめに — Vue.js
これがないと始まらない

チートシート GitHub - vuejs-tips/cheatsheet: Vue.js 2.2 complete API cheatsheet

Vuex

Vuex とは何か? · Vuex
コンポーネント間を渡り歩くには必要(なんだと思う今のところ)

チートシート GitHub - vuejs-tips/vuex-cheatsheet: Vuex Complete API CheatSheet

Bootstrap

※脱出しようとしたりしなかったり・・・

Element-UI

Element

コンポーネントライブラリ
テンプレートに宣言することなく次のようにメッセージ表示できる

          this.$message({
            type: 'success',
            message: 'Delete completed'
          });

455.86KBと重い Ver 1.4.6
コンポーネントはモバイル向けではない

Vue Material

Vue Material - Material Design for Vue.js
マテリアルコンポーネントフレームワーク
2017.10.26 Ver.0.81
Date Pickerがなくて残念。実装予定はありそう。

Vuetify

Vue.js 2 Material Component Framework | Vuetify.js
マテリアルコンポーネントフレームワーク Vue Materialとよく似ている
Date Pickerもありチラ見の感触はよい。
Vue Materialから乗り換えるかも。

Firebase

Firebase
mBaaS(mobile backend as a Service)。
スマートフォンアプリでよく利用される汎用的な機能をクラウドから提供するサービス。
パブリックなサービスを簡単に展開できる。

  • 認証まかせられるのは心強い(Google, Facebook, Twitter, GitHub, 匿名, パスワード)
  • ストレージの同期が強み
  • オフラインでも動作し、オンラインになったら同期される
  • 無料枠も試用には十分ある
  • Hostingも使いやすい。コマンド1つ。
  • Functionsでサーバサイドも処理できる(無料プランではgoogle外通信はできない)
  • ドキュメントページが重い。少し残念。
  • 無料プランでも年間5回まで技術サポートが受けられる。ありがたい。

VueFire

GitHub - vuejs/vuefire: Firebase bindings for Vue.js

  • Firebase database referenceをvm.$dataにバインドできる
  • コンポーネントで完結できる場合のみでしか利用しなさそう

VuexFire

GitHub - posva/vuexfire: 🔥Firebase bindings for Vuex (Vue.js)

  • Firebase database referenceをstateにバインドできる
  • refを操作するとstateに反映してくれる

Nuxt.js

Nuxt.js - Universal Vue.js Applications

  • Webpack/Babelの設定書く必要なし
  • node.jsサーバを準備する必要なし
  • *.vueファイルを書くだけでOK
  • pagesディレクトリにファイル追加すると自動ルーティング
  • ルートコンポーネント内のサーバデータに簡単アクセス

Nuxt.js 入門 - Qiita

electron-vue

https://github.com/SimulatedGREG/electron-vue

f:id:yoko0180:20171108083841p:plain

vue-cliのテンプレート。

npm install -g vue-cli
vue init simulatedgreg/electron-vue my-project

pugとstylusを加えて今のところ基本セット。

yarn add --dev pug pug-loader stylus stylus-loader

こちらもよく使う(だろう)(かもしれない)

yarn add lodash mkdirp moment rmdir