Nuxt.jsを用いたTodoリスト管理のサンプルアプリケーション
デモ: https://nuxt-todo-demo.netlify.app/
- Todoエントリの追加と削除、完了フラグの制御
- 削除時の確認モーダルの実装を含む
Vuexを用いたステート管理LocalStorageへの値の永続化
Nuxt.jsのサンプルとしての立ち位置を重視しTypeScriptは導入せず、Vanilla Next.jsでの実装とした。- スタイル定義にBulmaを利用している
TodoListコンポーネントではbulmaの定義を@importしてbulmaの変数を利用している
- デモサイトのデプロイにnowを利用している
- CI/CDにCircleCIを利用している
git clone git@github.com:nemolize/nuxt-todo.git && cd nuxt-todo# 依存関係のインストール
$ yarn install
# localhost:3000でのサーバー起動
$ yarn run dev
# staticファイルとしてビルド
$ yarn run generatenpx now dist