Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
AWS Amplifyを始めよう / Getting Started with AWS Amplify
Search
shiro seike
PRO
November 17, 2023
Programming
0
20
AWS Amplifyを始めよう / Getting Started with AWS Amplify
フロントエンドカンファレンス沖縄2023前夜祭リジェクトコン
https://front-okinawa.connpass.com/event/299741/
shiro seike
PRO
November 17, 2023
Tweet
Share
More Decks by shiro seike
See All by shiro seike
事例から見るサーバーレスの効果 / Serverless Effectiveness as Seen in Case Studies
seike460
PRO
1
53
Secure Serverless Architecture
seike460
PRO
2
420
地方こそサーバーレス、その意義に迫るサーバーレスPHP / Serverless PHP: The Rural Areas, and Why Serverless PHP Matters
seike460
PRO
2
140
サーバーレスらしさを意識した AWSにおける開発手法 / Development methodologies in AWS that are serverless-like
seike460
PRO
1
62
OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI
seike460
PRO
2
220
PHP8.3の機能を振り返る / Review of PHP 8.3 features
seike460
PRO
1
130
フルサーバーレスアーキテクチャの運用を重ねた先に見える価値 / The value that can be seen beyond the operation of a full serverless architecture
seike460
PRO
0
24
決断するための勇気、そのためのBacklog / Courage to make decisions, Backlog for that.
seike460
PRO
4
2.9k
Backlog API x Generative AI
seike460
PRO
0
94
Other Decks in Programming
See All in Programming
Module Harmony について
yosuke_furukawa
PRO
3
1k
DevTools と デバッグ と 私
kozy4324
1
110
Google Analytics でサイト速度を計測する / Measure site speed with Google Analytics
forrep
2
110
How to implement a RubyVM with PHP?
memory1994
PRO
3
1.4k
Containerization Tips and Tricks for PHP apps
dunglas
2
3.6k
JRuby 10: Ruby 3.3 on the Modern JVM
headius
0
210
EduBlocksでPythonのブロックプログラミング体験!
ueponx
0
190
Androidで不安定なPlatform Viewsとの闘い
temoki
0
130
Why Spring Matters to Jakarta EE - And Vice Versa
ivargrimstad
0
600
[RubyKaigi 2024] Ruby Mixology 101: adding shots of PHP, Elixir, and more
palkan
1
400
RuboCop: LSP and Prism
koic
3
2k
1BRC – Nerd Sniping the Java Community (Keynote JCon Slovenia)
gunnarmorling
1
110
Featured
See All Featured
The Mythical Team-Month
searls
217
42k
GraphQLの誤解/rethinking-graphql
sonatard
56
9.4k
Designing for humans not robots
tammielis
247
25k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
275
13k
Building Your Own Lightsaber
phodgson
100
5.8k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
12
1.1k
Side Projects
sachag
451
41k
Done Done
chrislema
178
15k
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
41
4.5k
What the flash - Photography Introduction
edds
64
11k
In The Pink: A Labor of Love
frogandcode
138
21k
Transcript
AWS Amplify 2023 2 0 23 . 11 . 17
@seike 4 60 1
自己 @seike 46 0 - - @seike 46 0 -
AWS Community Builder Serverless - Fusic - / 門 - / - - PHP Japan - - - 大 工 子工 055538A - 生 B 2 2
3 日 15:40 日 AWS Amplify
Agenda 1 .AWS Amplify 2 . 一 3 . 4
01 AWS Amplify
AWS Amplify AWS Amplify Amazon Web Services っ API
(GraphQL) っ React Angular Vue iOS Android っ SPA 自 6
AWS Amplify AWS Amplify っ 高 っ AWS Amplify
っ AWS 7
AWS Authentication Amazon Cognito 用 API (GraphQL) AWS
AppSync API (REST) Amazon API Gateway Storage Amazon S 3 Functions AWS Lambda Server-Side Rendering Amazon CloudFront 用 SSR Utilities Amazon CloudWatch 8
02 一
React AWS 用 URL https://aws.amazon.com/jp/getting-started/hands-on/build-react-app-amplify-graphql/ 10
面 11 GitHub Build 面 API (GraphQL) Storage
create-react-app React React AWS Amplify 12 $ npx create-react-app amplifyapp
Happy hacking! $ cd amplifyapp $ npm start
Git AWS Amplify Git Git AWS Amplify 13
AWS Amplify AWS Amplify -> -> GitHub GitHub 14
build AWS Amplify React Build Build 15
16
URL 赤 URL 17
-> Get started 18
AWS Amplify GitHub Push AWS Amplify AWS Amplify Pull 行
aws-exports.js 入 19
amplify pull 子 20
21 $ npm install aws-amplify @aws-amplify/ui-react npm install AWS Amplify
用 22 $ npm install aws-amplify @aws-amplify/ui-react $ amplify add
auth npm install AWS Amplify amplify add auth 用
amplify push Amazon Cognito AWS Lambda aws-exports.js 23 $ amplify
push y
aws-exports.js 24
用 用 src/index.js 生 aws-exports.js Amplify.configure 用 25
面 src/App.js 示 面 -> withAuthenticator AWS Amplify 面 26
面 面 示 src/App.js 示 27
Point
03
AWS Amplify バ プ 30 AWS Amplify 用 - Authentication
- API (GraphQL) - API (REST) - Storage - Functions
DB Stripe 31 AWS Amplify Authentication API (REST) 用
AWS Amplify
Thank You We are Hiring ! https://recruit.fusic.co.jp/