AWS AppSync & Amplify with React & GraphQL - Complete Guide

11h 11m 36s
English
Paid

Course description

Deploy a Serverless GraphQL & React JS based Javascript application in the AWS Cloud using AWS AppSync and AWS Amplify. AWS AppSync & AWS Amplify is the BEST way to get started with deploying GraphQL based applications in the AWS Cloud, all without deploying any servers, that infinitely scale. Welcome to the great world of Serverless computing!


Read more about the course

This course is fully hands-on, in which you'll get the chance to practice and learn:

  • GraphQL crash-course

  • How to deploy GraphQL based backends in AWS

  • How to develop your next-gen web application using the AWS Amplify framework & AWS AppSync

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 90 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing

Watch Online AWS AppSync & Amplify with React & GraphQL - Complete Guide

0:00
/
#1: Instructors Introductions

All Course Lessons (90)

#Lesson TitleDurationAccess
1
Instructors Introductions Demo
01:55
2
What You'll Build in This Course - Blop App Demo
08:25
3
What You'll Learn in This Course
02:10
4
Course Structure
02:31
5
What's AWS AppSync
07:45
6
What's Amplify (CLI)
04:05
7
Installing Development Tools
07:05
8
VSCode Basics
04:32
9
Creating Your AWS Account
01:50
10
Installing and Configuring AWS Amplify CLI
04:25
11
Why GraphQL - Motivation
07:09
12
Who Created GraphQL and Why
03:48
13
GraphQL Overview and Graph Theory
07:53
14
GraphiQL Demo
08:09
15
Setting Up Our First GraphQL Project - Part 1
08:51
16
Importing Express and Creating the App
04:52
17
Installing GraphQL Express Modules and Setup
09:47
18
Creating and Understanding GraphQL Schemas
10:29
19
RootQuery - Running Queries in GraphiQL
15:26
20
Returning Data in the Resolver Function
10:00
21
Adding a Hobby Type and RootType Field
08:15
22
Finish Adding a Post Type
08:26
23
Adding Relationships Between our Types
05:05
24
Showing a User Related to a Post
10:31
25
Showing User Related to a Hobby
05:28
26
Adding the Fields Posts Query
07:24
27
Adding the Hobbies Field Query
04:05
28
Introduction to Mutations - Presentation
01:24
29
Creating User Mutation
11:29
30
Creating Post Mutation
06:24
31
Create Hobby Mutation
07:39
32
Adding Posts Query
05:50
33
Posts and Hobbies Queries
04:41
34
Scalar Types
10:44
35
Scalar Types and Object Types
08:30
36
Non Nullable Field Types
03:48
37
Intro to Mongo DB VS RDBMS
09:03
38
Creating MLab Account
05:40
39
Installing Mongoose Package and Connecting to Remote Database
06:05
40
Creating Mongoose Models - User
08:59
41
Finalizing the Creation of Models and Requiring Them
04:16
42
Saving a User
11:39
43
Storing Data to Our Database - Final
09:05
44
Getting a User By ID
09:27
45
Post and Retrieving data - Final
13:23
46
CORS and Adding NonNulls to Required Field
08:21
47
Updating User
14:27
48
Updating Post and Hobby
12:02
49
Removing a User
05:19
50
Remove Operation - Final
06:17
51
Deploying to Remove Server - Heroku
02:08
52
Deploying Our Node.Js App to Heroku - Complete Guide
18:44
53
Using Prisma Playground
06:31
54
AWS AppSync API Console - Creating an API - Introduction
10:50
55
AWS AppSync API Console - DynamoDb and AddPost Mutation
10:39
56
AWS AppSync API Console - Update and Delete
06:13
57
AWS AppSync API Console - Docs and Root Types
03:59
58
System Overview Architecture - Presentation
04:58
59
AWS AppSync API Console - Resolvers Overview
04:33
60
Final Thoughts on AWS AppSync API Console
03:22
61
Creating Our React App
06:54
62
Setting Up Our API with Amplify Init
08:57
63
Creating Amplify CLI and Creating Backend API
10:34
64
Adding Amplify Modules and Configuring our Frontend App
04:13
65
Logging Data From AppSync
10:55
66
Showing Posts on Our Page ( User Interface )
10:38
67
Finalizing Our Post User Interface
08:55
68
App Form
09:36
69
Sending Posts to Backend AWS DynamoDb
11:04
70
Adding onCreate Subscription and Refreshing UI with Posts Automatically
10:44
71
Adding Auth Module to Our App
07:13
72
Amazong Cognito - User Pool
03:13
73
Creating New Users and Login With Auth
06:42
74
Deleting Posts Using onDeleteListener Subscription
09:11
75
Updating a Post - Part 1
10:15
76
Updating Post Without Subscription - Part 2
05:50
77
Update Post With Subscription
05:13
78
Create Post Comments - Introduction
10:17
79
Setting Up Comment Post to be Shown
11:10
80
Updating the ListPost Query and Showing Comments
07:51
81
FIX - Expired API and How to Fix it
06:09
82
Setup Like Post Logic
10:36
83
Liking and Showing the Like
06:30
84
Monitoring Who Can Like, Delete and Edit a Post
06:25
85
Showing Users Who Liked a Post - Part 1
09:46
86
Showing Users Who Liked a Post in a Popup Window
12:24
87
Testing the Like Feature in Our App
03:19
88
Publishing Our App to S3 Bucket
06:51
89
Next Steps
01:48
90
THANK YOU!
01:33

Unlock unlimited learning

Get instant access to all 89 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

The Modern GraphQL Bootcamp (with Node.js and Apollo)

The Modern GraphQL Bootcamp (with Node.js and Apollo)

Sources: udemy
GraphQL is quickly changing how Node.js developers write their APIs and backend applications. It offers a much-needed replacement to the traditional REST HTTP A
23 hours 26 minutes 42 seconds
Microfrontends with React: A Complete Developer's Guide

Microfrontends with React: A Complete Developer's Guide

Sources: udemy, Stephen Grider
Congratulations! You've found the most popular, most complete, and most up-to-date resource online for learning how to use microfrontends! Thousands of other en
9 hours 2 minutes 34 seconds
React Chrome Extension boilerplate | Shipped

React Chrome Extension boilerplate | Shipped

Sources: Luca Restagno (shipped.club)
Launch your Chrome Extension in hours, not weeks. The boilerplate for busy makers, to launch your React Chrome Extensions fast. ou don't need to reinvent the wheel and code ever...
Responsive LLM Applications with Server-Sent Events

Responsive LLM Applications with Server-Sent Events

Sources: fullstack.io
Large Language Models (LLMs) are transforming entire industries, but their integration into user interfaces with real-time data streaming...
1 hour 18 minutes 18 seconds