vue.js、vuex、nuxt、firebaseの入門本でおすすめはどれでしょう。おすすめ本だけではなく、動画講座やサンプルコードも紹介していきます。
現在、個人的にはvue.jsを使ってさらにnuxt.jsにステップアップしています。若干、個人的な覚書もかねているためお役立ち記事にしていきたいです。
目次
- 1 【入門本全まとめ】vue.js/vuex/nuxt/firebaseの書籍でおすすめはどれ？
- 1.1 【入門本】基礎から学ぶ Vue.js
- 1.2 【初心者向け】Vue JS 入門決定版！jQuery を使わない Web 開発 (中村祐太)
- 1.3 【初心者向け】nuxt.jsのおすすめ本
- 1.4 【vuexでおすすめ】mapState, mapMutations, mapGetters, mapAcitonsなども解説
- 1.5 【フレームワーク】bootstamp、Quasar Framewor
- 1.6 firebaseとvuejsのおすすめ動画
- 1.7 typescriptとvuejsおすすめ本
- 1.8 laravelとvuejsのおすすめ本
- 1.9 vue.jsのキンドルアンリミテッドの読み放題
- 1.10 vue.jsの本一覧
- 2 vue.jsののサンプルソースコード
- 3 vue.jsの環境構築
- 4 vue.jsのエラー
【入門本全まとめ】vue.js/vuex/nuxt/firebaseの書籍でおすすめはどれ？
【入門本】基礎から学ぶ Vue.js
図解が多くわかりやすいです。多くのプログラマははじめにこの本を買っているようです。
書籍だけではなくサポートサイトが充実しています.書籍では未掲載のfirebaseでチャットアプリを作ろうみたいなものもあります。
ただ、個人的に最初にみたのはudemyの動画でした。
【初心者向け】Vue JS 入門決定版！jQuery を使わない Web 開発 (中村祐太)
udemyの講座がおすすめです。中村祐太さんのものは特に初心者向けにうまく構成されている気がします。
「Vue JS 入門決定版！jQuery を使わない Web 開発 – 導入からアプリケーション開発まで体系的に動画で学ぶ」です。todoアプリなどを作ります。
vuexは続編の「Nuxt JS入門決定版！Vue.jsのフレームワークNuxt JSの基本からFirebaseと連携したSPAの開発まで」で扱っています。
【初心者向け】nuxt.jsのおすすめ本
Nuxt JSは本も出版されていますが、初心者はudemyの「Nuxt JS入門決定版！Vue.jsのフレームワークNuxt JSの基本からFirebaseと連携したSPAの開発まで(中村祐太)」の方が理解が早いでしょう。vuexやfirebaseの基礎も勉強できます。
書籍は次のようなものがでています。
- Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシングルページアプリケーション開発
- Vue.js & Nuxt.js超入門
- NuxtとGoではじめるWebアプリ開発 (技術の泉シリーズ（NextPublishing）)
ただ、本やでパラパラとめくったところ、経験者向けの感じがしました。動画をみたあと、一冊もっておいてもいいかもしれません。
【vuexでおすすめ】mapState, mapMutations, mapGetters, mapAcitonsなども解説
よし ぴーさんの「超Vue JS 2 入門 完全パック – もう他の教材は買わなくてOK！ (Vue Router, Vuex含む)」はvuexまで解説してくれています。
mapState, mapMutations, mapGetters, mapAcitonsなども含みます。書籍ではここまで解説してくれないものが多いです。しかも、かなりわかりやすく初心者向けです
【フレームワーク】bootstamp、Quasar Framewor
フレームワークはbootstampなども有名ですが、何でもできるQuasar Frameworも注目されています。
「Quasar Framework: Cross-Platform Vue JS Vuex & Firebase Apps」はどうやら開発者本人が解説しているようです。検索やマルチプラットフォームの対応まで対応しています。英語ですが動画なので問題ないでしょう。
udemyではbootstampの動画の取り扱いもあります。
「増補改訂版『Bootstrap4入門』〜Webデザインに対して苦手意識を持つエンジニアのための〜」あたりがおすすめかも。
firebaseとvuejsのおすすめ動画
vue.jsはfirebaseと組み合わせて使う紹介が非常に多いです。firebaseはgoogleが買収したmobile Backend as a Service（mBaaS)です。バックエンドエンジニア不要でもアプリが作れるだろうと言われ、ゲームのunityなどでも使われています。
udemyで「Vue.js + Firebaseで作るシングルページアプリケーション」をfirebase用に一応ゲットしました。この動画はわりと説明があっさりとしているため、慣れている向けという気がしました。
nuxtまでインストールしてしまうなら、「Nuxt JS入門決定版！Vue.jsのフレームワークNuxt JSの基本からFirebaseと連携したSPAの開発まで」の方がおすすめです。
typescriptとvuejsおすすめ本
個人的に読んでいないため、情報提供のみです。
基本プログラミングは型がありで書いた方がよいとも言われます。typescriptはマイクロソフトの言語ですね。
laravelとvuejsのおすすめ本
「Laravel and Vue.js: Learn By Coding」などが出版されています。キンドルアンリミテッドで無料でてていました。個人的に読んでいないため、情報提供のみです。
vue.jsのキンドルアンリミテッドの読み放題
vue.jsでキンドルアンリミテッドの読み放題同人誌がたくさん出回っています。「速習Vue.js 速習シリーズ」は無料で見れます。
vue.jsの本一覧
他にも以下のような書籍が出版されています。
- Vue.js入門 基礎から実践アプリケーション開発まで
- 動かして学ぶ！Vue.js開発入門 (NEXT ONE)
- 改訂新版 Vue.jsとFirebaseで作るミニWebサービス (技術の泉シリーズ)
- 現場で使えるVue.js tips集 (技術の泉シリーズ（NextPublishing）)
- 後悔しないためのVueコンポーネント設計 (技術の泉シリーズ)
vue.jsののサンプルソースコード
codepen、jsfiddle、githubなどで探してみましょう。以前、少し探したものをシェアしておきますね。
vue.jsのcheckbox(チェックボックス)ですべて選択・非選択のサンプル
こちらの記事がとても参考になりました。
少しコードが違います。英語ですが。
別のやり方もあるようです。
Vue-Multiselect
選択ライブラリもあるのですね。
selectコンポーネント比較です。
vue.jsのto doリストのサンプル
定番のtodoアプリです。サンプルがいろいろとありました。
vue.jsの環境構築
めも程度に残しておきます。
node.jsをインストール
node.jsをインストールします。npmも一緒にインストールされます。
vue CLIをインストール
vue CLIとはVue.jsの開発を手早く進めるための便利システムです。
npm install -g @vue/cli
確認します。
vue --version
vue.jsのエラー
エラーも覚書程度に残しておきます。
Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field xxx)
うっかりりミスでした。
text: this.taskList → taskList: this.taskList
[vuex] unknown getter:
ブラウザのConsoalに出ていたエラーです。
namespacesの指定がされていなかっただけでした。。名前空間を引数に渡すように修正して解決。
ご参考になれば幸いです。
コメント