12.10 g0v JS Workshop: Serverless React

HSIN H筆記未完待補

 

1. repo: https://github.com/hsin421/g0v-coding-workshop
2. install https://nodejs.org/en/
3. download zip
4. unzip
5. open terminal
6. cd 'Downloads'
7. cd 'g0v-coding-workshop-master'
8. npm install
9. npm run dev
10. open browser
11. go to localhost:8080
12. YEN-TING L

 

HSIN HAWS Lambda

Choose Microservice from blueprints

 

In security: choose 'open', and next

 

type your lambda function name and 'create a new role.' Enter a role name.

 

Create lambda functino

 

Needed headers in lambda code:

 

'Access-Control-Allow-Headers': 'Content-Type,X-Amz-Date,Authorization',

'Access-Control-Allow-Methods': 'GET,POST,PUT,DELETE',

'Access-Control-Allow-Origin': '*'

 

 

AWS API GATEWAY

To solve 'access-control-allow-origin problem'

'Enable CORS'

and add the above "access-control..." to your lambda code

 

AWS DynamoDB

create Table: choose a primary key (like userId) and a sort key

 

AWS S3

To deploy your site, use webpack to build your bundle by either 'node_modules/.bin/webpack' or 'npm run build'

 

Then upload your two files in ./build folder: index.html and bundle.js to a S3 bucket.

 

In the bucket settings, choose 'Enable static website hosting' and type index.html into the index document box.

 

Also, choose the two uploaded files, and in 'Actions' choose 'Make Public'

 

Results

 

Deployed address

http://g0v-example-workshop.s3-website-us-east-1.amazonaws.com/

 

Workshop Github source

https://github.com/hsin421/g0v-workshop-example-2