* この記事では、説明のためのサンプルコードを書いていますが、Githubにあるコードとは似て異なります。ご注意ください。 環境 vue-router、vuex、Firebase を使っています。 vuefire はあえて使用していません。 vuex から Firebase を呼び出しています。 vue-router@2.x. vuex@2.x. vuex-router-sync@3.0.0 babel (es2015, stage-2) webpack webpack-dev-server firebase@3.6.2 lodash@4.17.x moment@2.17.x 画面遷移 vue-router を使い、3つの画面を管理しています。 - Index(タイムライン) - Viewer(ひとつのメモを見る) - Editor(メモを追加、編集) それぞれ、URLが個別に割り当てられ
![Vue.js(v2.x.)を使ってメモアプリを作ってみた - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/8b70244b3de912db3a028d74e2624569a1d33d7b/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-f625e957b80c4bd8dd47b724be996090.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9VnVlLmpzJUVGJUJDJTg4djIueC4lRUYlQkMlODklRTMlODIlOTIlRTQlQkQlQkYlRTMlODElQTMlRTMlODElQTYlRTMlODMlQTElRTMlODMlQTIlRTMlODIlQTIlRTMlODMlOTclRTMlODMlQUElRTMlODIlOTIlRTQlQkQlOUMlRTMlODElQTMlRTMlODElQTYlRTMlODElQkYlRTMlODElOUYmdHh0LWNvbG9yPSUyMzNBM0MzQyZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtY2xpcD1lbGxpcHNpcyZ0eHQtYWxpZ249bGVmdCUyQ21pZGRsZSZzPWIxN2I4NTQyY2E5YmQ4YzMxOWQ3MjhhNjdkMjk3N2Q0%26mark-x%3D142%26mark-y%3D151%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwYWtpZm8mdHh0LWNvbG9yPSUyMzNBM0MzQyZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTgxN2MxN2I1ZGUzZTJhMzBmYWE5ODkxZTBhYjVkNTg0%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D6d0d64af3d3adccbe37294d42f3e2780)