はじめに すいません、最短は煽りですw 簡単な連絡帳みたいなものを作るサンプルを通して、Vue と Firebase / Firestore の組み合わせの開発コストが低いかを紹介したいと思います。 最初は、アクセス制御をかけずに作成し、次に Firebase の auth を使って認証をかけてみます。 最終形を以下でホスティングしてあります。適当にサインアップして試してみてもらってかまいません。 ロジックに集中するために、デザインはほぼあてていません。見た目悪いのは気にしないでください。 準備 Node.js と npm をインストールしてください。 https://nodejs.org/en/ この記事は、8.10.0 LTS で検証しています。 vue-cli をインストールしてください。 Firebase / Firestore をセッティング 公式ドキュメントにのっとればプロジェ
![Vue と Firebase / Firestore で CRUD 操作を行う Web アプリを作る最短のコード - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/76289252b1e5150a5cd8a2a1f0450761daa0c2ee/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9VnVlJTIwJUUzJTgxJUE4JTIwRmlyZWJhc2UlMjAlMkYlMjBGaXJlc3RvcmUlMjAlRTMlODElQTclMjBDUlVEJTIwJUU2JTkzJThEJUU0JUJEJTlDJUUzJTgyJTkyJUU4JUExJThDJUUzJTgxJTg2JTIwV2ViJTIwJUUzJTgyJUEyJUUzJTgzJTk3JUUzJTgzJUFBJUUzJTgyJTkyJUU0JUJEJTlDJUUzJTgyJThCJUU2JTlDJTgwJUU3JTlGJUFEJUUzJTgxJUFFJUUzJTgyJUIzJUUzJTgzJUJDJUUzJTgzJTg5JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1hYzk3NzJjYzAyMTZmM2MyMDgzZjRkMTY4NGZkNDlmOA%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwU2F0YWNoaXRvJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1mMjY2NjdlZWRmOGNjMGUzMWExYjg2N2I3YmEyMGVkNA%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D558b71d3594da32c8a9b67bd506e818c)