文法

【Nuxt.js】アプリ開発基礎編:Nuxt + Vuex + firebaseでシンプルToDoリスト

前置き

画像8

本格的なTODOリストを作っていきます!
すっごく簡単なTODOリストは以前やりましたが、
一時的な物なのでリロードしたら消えます💥😲
【Nuxt.js】ちょ〜簡単!TODOリスト

今回はfirebaseとVuexで
本格的TODOリストを作成します✨🎈

・firebaseでデータ管理
・Vuexで状態を保持

内容が濃いのでお知らせした通り、
有料記事となります💰
まずは基本のTODOリスト、
次回以降のカスタマイズとして
・ログイン機能の追加
・リストに画像機能の追加

も公開していきますよ!
CSSも追加したりして
自分好みのリストにしてみてください💕🥤☺️

https://note.com/aliz/n/n8411db2c9a20


Stepについて

いつも通り超簡単なところから
だんだんと肉付けをしていきます。
初心者にも分かりやすく書きました💕
分からなくても基礎的な記事を
確認しながらやってみてください🍀

【流れ】
・index.vueでTODOリストを作成
・Vuexに置き換える
・Firebaseに置き換える

【基礎】
こちらはずっと無料です!
firebase導入編
Vuex基礎編
Vuexまとめ編

【心構え】
・丁寧に1つずつ
・分かる所は飛ばしてもOK🌱
 分からなくなったら戻ってもOK🌱
・一気に全部やろうとしない
・記事を参考に公式の見方が
 分かるようにしましょう👀
 https://firebase.google.com/docs/firestore
 https://ja.nuxtjs.org/guide/vuex-store/


Step1: リストの作成

【解説/index.vue】

予めdataにリスト項目を入れて
Mustacheで表示させるだけ🌟

【コード/index.vue】

続きはこちら
https://note.com/aliz/n/n8411db2c9a20

-文法

© 2020 aLiz Nuxt