Full Stack Photobook App - Vue, GraphQL, AWS Amplify

Overview

Build and deploy a full stack Photobook application using Vue.js, GraphQL, and AWS Amplify in this comprehensive tutorial. Learn to set up the development environment, configure AWS services, and implement authentication with AWS Cognito. Explore GraphQL integration, storage management, and Lambda functions. Create a responsive user interface with Vue components, implement Vuex for state management, and set up route guards. Dive into AWS AppSync, mock GraphQL APIs, and update schemas. Develop album features, integrate photo processing capabilities, and perform end-to-end testing. Access the provided GitHub repository for code samples and follow along with the detailed timestamps to master each aspect of this modern web application development process.

Syllabus

Overview of Application.
Setup .
Overview of AWS Services.
Install Tools.
Amplify Configuration.
Configure Vue App With Amplify.
Authentication.
Adding AWS Cognito To App.
Add Authentication To Vue.
Setting up Auth Vuex Store.
Creating Login Component.
Setup Routes.
Create Signup Page.
Creating Nav Component.
Adding Route Guards.
GraphQL and Storage.
Add AWS Storage.
Add AWS App Sync.
Updating GraphQL Schema.
Mocking GraphQL API with Playground.
Adding Album Vuex store.
Update Albums page.
Update AlbumsDetails page.
Testing out album feature.
Lambda Function.
Adding Lambda in AWS Amplify.
Update Amplify Photo Processor.
Update amplify storage.
Update cloud formation template.
Testing App E2E.