These are the files my bro and I used for our test project
All of your static web content will be managed by AWS Amplify Console. Your end users will then access your site using the public website URL exposed by AWS Amplify Console, no web server or other services are required.
-
Select a Region, will be used for all the services used in this application
-
Create a Git repository, in AWS CodeCommit console
-
set the repo name
-
set up an IAM user with GIt credentials
-
select clone HTTPS
-
-
Populate the Git repository, copy the website content from an existing publicly accessible S3 Bucket
-
change directory into your repo and copy the static files from S3
cd <web-site-name>
aws s3 cp s3://<aws-name>-<region>/WebApplication/1_StaticWebHosting/ website ./ --recursive
-
commit the files to your Git service
-
-
Enable web hosting with AWS Amplify Console
-
create a New App and choose Host web app
-
select the repository service provide and commit code
-
-
Setup AWS Amplify to automatically deploy all files hosted
You'll deploy pages that enable customers to register as a new user, verify their email address and sign into the site, using Amazon Cognito.
-
Create Cognito user pool, configure sign-in experience
-
Configure security requirements / sign-up experience / message delivery
-
Take note of PoolID, AppClient ID and Pool details
Pool name | PoolID |
---|---|
Users | us-east-1_AcsQ2NJvp |
App name | AppClient ID |
---|---|
User | 1mn8agsd9pdgr27t5damb62bhr |
-
Update website config
Modify the
/js/config.js
file with the setting from user pool and app you created in the previous steps and upload the file back to your bucket.window._config = { cognito: { userPoolId: 'us-east-1_AcsQ2NJvp', userPoolClientId: '3k79leh7v8ouv4ga9l5prtqf1r', region: 'us-east-1' }, api: { invokeUrl: '' // e.g. https://rc7nyt4tql.execute-api.us-east-1.amazonaws.com/prod', } };
-
Push changes into your Git repo
-
Validate your implementation, Module 2: User Management
Use AWS Lambda and DynamoDB to build a backend process for handling requests for your web application.
-
Create a DynamoDB table
-
Setup table name and partition key
-
Get the ARN, from Overview - Additional info
arn:aws:dynamodb:us-east-1:121119844086:table/Users
-
Create an IAM role for the Lambda function
-
go to IAM service
-
create a service role with Lambda use case (under "Trusted entity type)
-
check the box for the role AWSLambdaBasiceExecutionRole
-
-
Setup role name
-
Add the Create inline policy permission for DynamoDB
-
Operation -> PutItem for ARN of the created table
-
Create a Lambda function
-
default Author from scratch
-
using RequestUnicorns as name for Node.js 16.x
- modify the js file!
-
select the existing role
-
replace the existing code from the "RequestUnicorns"
-
-
Configure test event
-
create a new event
-
{ "path": "/user", "httpMethod": "POST", "headers": { "Accept": "*/*", "Authorization": "eyJraWQiOiJLTzRVMWZs", "content-type": "application/json; charset=UTF-8" }, "queryStringParameters": null, "pathParameters": null, "requestContext": { "authorizer": { "claims": { "cognito:username": "the_username" } } }, "body": "{\"PickupLocation\":{\"Latitude\":47.6174755835663,\"Longitude\":-122.28837066650185}}" }
-
-
Check if StatusCode==201
Use Amazon API Gateway to expose the Lambda function you built in the previous module.
-
Create REST API using API Gateway service
-
Choose Edge optimized
-
Create a new resource
-
Set the resource path == path described in the test event above
-
Enable the API Gateway CORS
-
-
Create a new method
-
Set the method == httpmethod described in the test event above
-
Select Lambda function and select Use Lambda proxy integration
-
Use the created Lambda function
-
-
Setup a new authorization
- From method request modify the Authorization field and select cognito user pool created above
-
Deploy your API using Deployment stage == prod
-
Update the
js/config.js
file- setup invokeUrl ==
https://idog8vpc82.execute-api.us-east-1.amazonaws.com/prod
- setup invokeUrl ==
-
AWS amplify - delete app
-
Cognito - delete pool
-
Lambda function - delete function and delete pool
-
IAM Role - delete role
-
DynamoDB Table - delete table and delete all CloudWatch alarms
-
API Gateway - delete API
-
CloudWatch Log - delete log group
Author: Riccardo Ruberto