vue.jsとamplifyで、ユーザ認証のページ(ログイン・ログアウト)を作って、Web公開する。

vue.jsとamplifyで、ユーザ認証のページ(ログイン・ログアウト)を作って、Web公開する。

最初のvue createで Manually select features を選んで、vue-routerとvuexを選択
あとは、ひたすらENTER連打でOK!

1, vueプロジェクト生成(フロント用)

2, amplifyプロジェクト作成

3, vue.jsでフロントまわり(ログイン画面)を作る。
以下の5つのファイルをイジる。
main.js //amplifyパッケージを読み込む
src/route/index.js // urlのルーティング
src/store/index.js // ログインユーザ情報を保持
App.vue // ヘッダにログアウトボタン
views/Login.vue // ログイン画面(新規作成)

main.js //amplifyパッケージを読み込む

src/route/index.js // urlのルーティング

src/store/index.js // ログインユーザ情報を保持

App.vue // ヘッダにログアウトボタン

views/Login.vue // ログイン画面(新規作成)

4, ローカルで修正して、公開Webサーバへ修正内容をpublishする