Skip to content

Commit fc0c6dc

Browse files
trivikrtrivikr
authored
feat: Initial app using modular AWS SDK for JavaScript (#1)
1 parent 2cadc0f commit fc0c6dc

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+24105
-5
lines changed

‎.gitignore

+147
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
2+
# Created by https://www.gitignore.io/api/osx,node,linux,windows
3+
4+
### Linux ###
5+
*~
6+
7+
# temporary files which can be created if a process still has a handle open of a deleted file
8+
.fuse_hidden*
9+
10+
# KDE directory preferences
11+
.directory
12+
13+
# Linux trash folder which might appear on any partition or disk
14+
.Trash-*
15+
16+
# .nfs files are created when an open file is removed but is still being accessed
17+
.nfs*
18+
19+
### Node ###
20+
# Logs
21+
logs
22+
*.log
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# Runtime data
28+
pids
29+
*.pid
30+
*.seed
31+
*.pid.lock
32+
33+
# Directory for instrumented libs generated by jscoverage/JSCover
34+
lib-cov
35+
36+
# Coverage directory used by tools like istanbul
37+
coverage
38+
39+
# nyc test coverage
40+
.nyc_output
41+
42+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
43+
.grunt
44+
45+
# Bower dependency directory (https://bower.io/)
46+
bower_components
47+
48+
# node-waf configuration
49+
.lock-wscript
50+
51+
# Compiled binary addons (http://nodejs.org/api/addons.html)
52+
build/Release
53+
54+
# Dependency directories
55+
node_modules/
56+
jspm_packages/
57+
58+
# Typescript v1 declaration files
59+
typings/
60+
61+
# Optional npm cache directory
62+
.npm
63+
64+
# Optional eslint cache
65+
.eslintcache
66+
67+
# Optional REPL history
68+
.node_repl_history
69+
70+
# Output of 'npm pack'
71+
*.tgz
72+
73+
# Yarn Integrity file
74+
.yarn-integrity
75+
76+
# dotenv environment variables file
77+
.env
78+
79+
80+
### OSX ###
81+
*.DS_Store
82+
.AppleDouble
83+
.LSOverride
84+
85+
# Icon must end with two \r
86+
Icon
87+
88+
# Thumbnails
89+
._*
90+
91+
# Files that might appear in the root of a volume
92+
.DocumentRevisions-V100
93+
.fseventsd
94+
.Spotlight-V100
95+
.TemporaryItems
96+
.Trashes
97+
.VolumeIcon.icns
98+
.com.apple.timemachine.donotpresent
99+
100+
# Directories potentially created on remote AFP share
101+
.AppleDB
102+
.AppleDesktop
103+
Network Trash Folder
104+
Temporary Items
105+
.apdisk
106+
107+
### Windows ###
108+
# Windows thumbnail cache files
109+
Thumbs.db
110+
ehthumbs.db
111+
ehthumbs_vista.db
112+
113+
# Folder config file
114+
Desktop.ini
115+
116+
# Recycle Bin used on file shares
117+
$RECYCLE.BIN/
118+
119+
# Windows Installer files
120+
*.cab
121+
*.msi
122+
*.msm
123+
*.msp
124+
125+
# Windows shortcuts
126+
*.lnk
127+
128+
# End of https://www.gitignore.io/api/osx,node,linux,windows
129+
130+
dist/
131+
build/
132+
react-app-env.d.ts
133+
134+
### CDK-specific ignores ###
135+
*.swp
136+
cdk.context.json
137+
package-lock.json
138+
.cdk.staging
139+
cdk.out
140+
141+
# yarn berry with no zero installs
142+
.yarn/*
143+
!.yarn/releases
144+
!.yarn/plugins
145+
!.yarn/sdks
146+
!.yarn/versions
147+
.pnp.*

‎.yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs

+77
Large diffs are not rendered by default.

‎.yarn/releases/yarn-berry.cjs

+55
Large diffs are not rendered by default.

‎.yarnrc.yml

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
nodeLinker: node-modules
2+
3+
plugins:
4+
- path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
5+
spec: "@yarnpkg/plugin-interactive-tools"
6+
7+
yarnPath: .yarn/releases/yarn-berry.cjs

‎CODE_OF_CONDUCT.md

+1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
## Code of Conduct
2+
23
This project has adopted the [Amazon Open Source Code of Conduct](https://aws.github.io/code-of-conduct).
34
For more information see the [Code of Conduct FAQ](https://aws.github.io/code-of-conduct-faq) or contact
45
[email protected] with any additional questions or comments.

‎README.md

+82-5
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,86 @@
1-
## My Project
1+
# aws-sdk-js-todo-app
22

3-
TODO: Fill this README out!
3+
In this app, you are going to build a simple todo application using
4+
[modular AWS SDK for JavaScript][modular-aws-sdk-js-blog-post]
45

5-
Be sure to:
6+
## Table of Contents
67

7-
* Change the title in this README
8-
* Edit your repository description on GitHub
8+
- [Prerequisites](#prerequisites)
9+
- [Setup](#setup)
10+
- [Create backend API](#create-backend-api)
11+
- [Deploy infrastructure](#deploy-infrastructure)
12+
- [Prepare frontend API](#prepare-backend-api)
13+
- [Debug frontend](#debug-frontend)
14+
- [Clean up](#clean-up)
15+
- [Contributing](#contributing)
16+
- [Security](#security)
17+
- [License](#license)
18+
19+
## Prerequisites
20+
21+
To set up this todo app, complete the following tasks:
22+
23+
- Install **Node.js** by following these steps:
24+
1. Install [nvm](https://github.com/nvm-sh/nvm#installation-and-update).
25+
1. Use node v12.x.x by running `nvm use` or `nvm use 12` in a terminal window.
26+
1. Verify that node is installed by running `node -v` in a terminal window and confirm that it shows the latest version of `v10`, such as `v12.17.0`).
27+
- Install [yarn](https://yarnpkg.com/en/docs/install).
28+
- We recommend using **yarn** for its simplicity, speed and yarn workspaces.
29+
- Install dependencies by running `yarn`.
30+
- If you don't have an AWS account, [create one](https://aws.amazon.com/premiumsupport/knowledge-center/create-and-activate-aws-account/).
31+
- If you're an Amazon employee, see the internal wiki for creating an AWS account.
32+
- Install the [AWS CLI](https://aws.amazon.com/cli/).
33+
- Verify that the AWS CLI is installed by running `aws` in a terminal window.
34+
- Set up [AWS Shared Credential File](https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-files.html).
35+
- Your `~/.aws/credentials` (`%UserProfile%\.aws\credentials` on Windows) should look like the following:
36+
```
37+
[default]
38+
aws_access_key_id = <ACCESS_KEY>
39+
aws_secret_access_key = <SECRET_ACCESS_KEY>
40+
```
41+
- Your `~/.aws/config` (`%UserProfile%\.aws\config` on Windows) should look like the following:
42+
```
43+
[default]
44+
region = us-west-2
45+
```
46+
47+
## Setup
48+
49+
This exercise code uses [modular AWS SDK for JavaScript][modular-aws-sdk-js] as follows:
50+
51+
- backend performs create, delete, get, list and update operations on DynamoDB.
52+
- frontend does put, get, delete operations using an S3 browser client.
53+
54+
### Create backend API
55+
56+
- Run: `yarn build:backend`
57+
- This generates bundles to be deployed to lambda.
58+
59+
### Deploy infrastructure
60+
61+
- Run: `yarn cdk deploy`
62+
- This command:
63+
- Creates AWS infrastructure using [AWS Cloud Development Kit](https://aws.amazon.com/cdk/).
64+
- Deploys backend bundles to lambda.
65+
- Creates resources to be used in the frontend.
66+
67+
### Prepare frontend API
68+
69+
- Run: `yarn prepare:frontend`
70+
- This command copies AWS resources to the frontend config.
71+
72+
### Debug frontend
73+
74+
- Run: `yarn start:frontend`
75+
- This command starts ReactApp for testing frontend, and opens the URL in browser.
76+
77+
### Clean up
78+
79+
The Cloudformation stack can be deleted by running: `yarn cdk destroy`
80+
81+
## Contributing
82+
83+
Contributions are more than welcome. Please read the [code of conduct](CODE_OF_CONDUCT.md) and the [contributing guidelines](CONTRIBUTING.md).
984
1085
## Security
1186
@@ -15,3 +90,5 @@ See [CONTRIBUTING](CONTRIBUTING.md#security-issue-notifications) for more inform
1590
1691
This library is licensed under the MIT-0 License. See the LICENSE file.
1792
93+
[modular-aws-sdk-js-blog-post]: https://aws.amazon.com/blogs/developer/modular-aws-sdk-for-javascript-is-now-generally-available/
94+
[modular-aws-sdk-js]: https://github.com/aws/aws-sdk-js-v3/

‎package.json

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{
2+
"private": true,
3+
"workspaces": [
4+
"packages/infra",
5+
"packages/backend",
6+
"packages/frontend"
7+
],
8+
"scripts": {
9+
"cdk": "cd packages/infra && yarn cdk",
10+
"build:backend": "cd packages/backend && yarn build",
11+
"prepare:frontend": "node packages/scripts/populate-frontend-config.js",
12+
"build:frontend": "cd packages/frontend && yarn build",
13+
"start:frontend": "cd packages/frontend && yarn start",
14+
"serve:frontend": "cd packages/frontend && yarn build && yarn serve"
15+
},
16+
"devDependencies": {
17+
"husky": "^4.2.3",
18+
"lerna": "^3.20.2",
19+
"lint-staged": "^10.1.2",
20+
"prettier": "2.2.0"
21+
},
22+
"husky": {
23+
"hooks": {
24+
"pre-commit": "lint-staged"
25+
}
26+
},
27+
"lint-staged": {
28+
"*.{ts,js,md}": "prettier --write"
29+
}
30+
}

‎packages/backend/.eslintrc.json

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true
5+
},
6+
"extends": [
7+
"eslint:recommended",
8+
"plugin:@typescript-eslint/eslint-recommended",
9+
"prettier",
10+
"prettier/@typescript-eslint"
11+
],
12+
"globals": {
13+
"Atomics": "readonly",
14+
"SharedArrayBuffer": "readonly"
15+
},
16+
"parser": "@typescript-eslint/parser",
17+
"parserOptions": {
18+
"ecmaVersion": 2018,
19+
"sourceType": "module"
20+
},
21+
"plugins": ["@typescript-eslint"],
22+
"rules": {}
23+
}

‎packages/backend/README.md

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
# DynamodDB client
2+
3+
- This package contains backend code which performs create, delete, get, list and update operations on DynamoDB.
4+
- It uses webpack to build single minimized bundle for each operation, and AWS CDK to deploy those bundles.
5+
6+
## Table of Contents
7+
8+
- [Setup](#setup)
9+
- [Create backend API](#create-backend-api)
10+
- [Test backend API](#test-backend-api)
11+
- [Clean resources](#clean-resources)
12+
13+
## Setup
14+
15+
Ensure that you've followed pre-requisites from main [README](../../README.md).
16+
17+
### Create backend API
18+
19+
- `yarn build:backend` to build the package (runs ESLint and TypeScript).
20+
- `yarn cdk deploy` to deploy your application (this operation might take time based on the state of your Cloudformation stack).
21+
22+
### Test backend API
23+
24+
- Open the GatewayUrl link from CDK output from the console.
25+
- It'll be like: https://randomstring.execute-api.us-west-2.amazonaws.com/prod/
26+
- Append `notes` in the URL.
27+
- It'll be like: https://randomstring.execute-api.us-west-2.amazonaws.com/prod/notes
28+
- The contents of the notes DynamoDB table would be returned as JSON.
29+
- If you don't see anything, that's because your table is likely empty! Add data manually or wait until you run the frontend.
30+
31+
### Clean resources
32+
33+
- Note: Clean resources after you're done with all activities below, and you want to delete your cloudformation stack.
34+
- `yarn cdk destroy` to delete your CloudFormation stack.

‎packages/backend/package.json

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
{
2+
"name": "@aws-sdk-todo-app/backend",
3+
"version": "1.0.0",
4+
"private": true,
5+
"description": "Backend for todo app created using modular AWS SDK for JavaScript",
6+
"dependencies": {
7+
"@aws-sdk/client-dynamodb": "3.4.1"
8+
},
9+
"scripts": {
10+
"build": "webpack",
11+
"build:backend": "cd .. && yarn build:backend",
12+
"cdk": "cd .. && yarn cdk"
13+
},
14+
"keywords": [
15+
"modular",
16+
"aws",
17+
"JavaScript",
18+
"TypeScript",
19+
"SDK",
20+
"v3"
21+
],
22+
"author": "Kamat, Trivikram",
23+
"license": "MIT",
24+
"devDependencies": {
25+
"@types/aws-lambda": "^8.10.64",
26+
"@types/node": "^14.14.2",
27+
"@typescript-eslint/eslint-plugin": "4.8.2",
28+
"@typescript-eslint/parser": "4.8.2",
29+
"clean-webpack-plugin": "3.0.0",
30+
"eslint": "7.14.0",
31+
"eslint-config-prettier": "6.15.0",
32+
"eslint-webpack-plugin": "2.4.0",
33+
"ts-loader": "8.0.11",
34+
"typescript": "~4.1.2",
35+
"webpack": "5.2.0",
36+
"webpack-cli": "4.1.0"
37+
},
38+
"sideEffects": false
39+
}

0 commit comments

Comments
 (0)