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
19
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
地方こそサーバーレス、その意義に迫るサーバーレスPHP / Serverless PHP: The Rural Areas, and Why Serverless PHP Matters
seike460
PRO
2
110
サーバーレスらしさを意識した AWSにおける開発手法 / Development methodologies in AWS that are serverless-like
seike460
PRO
1
57
OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI
seike460
PRO
2
200
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
23
決断するための勇気、そのためのBacklog / Courage to make decisions, Backlog for that.
seike460
PRO
4
2.1k
Backlog API x Generative AI
seike460
PRO
0
90
「サーバーレス」ってなんだろう みんなでワイガヤ談義 / What is "serverless?" Wigaya discussion with everyone
seike460
PRO
0
37
とにかくHTTP3をライトニングに話す / Anyway, I'll talk to Lightning about HTTP3.
seike460
PRO
0
140
Other Decks in Programming
See All in Programming
How to improve maintainability and readability of your automated tests? ( #scrumniigata )
teyamagu
PRO
1
130
スタックトレース始めてみた
kuro_kurorrr
5
1.2k
GoでParserを書く
karupanerura
3
430
CREってこういうこと? 体験入社 - 提案資料 - / what-is-cre-trial-employment
shinden
1
620
Powerfully Typed TypeScript
euxn23
4
1.7k
Criando a Woovi em uma semana
daniloab
0
120
JS RPCを理解する
yusukebe
5
300
Deep Dive into React Stream/Serialize
mugi_uno
4
870
“Seeing Like a Programmer”—Resiliency, Limits, and Moral Hazards in Software Engineering (LambdaConf 2024)
chriskrycho
0
430
Productivity is Messing Around and Having Fun
hollycummins
1
180
slow types ってなんだろう?
karad
0
210
The grand strategy of Ruby Parser
yui_knk
5
340
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
29
4.1k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
26
2.3k
Bash Introduction
62gerente
605
210k
Infographics Made Easy
chrislema
238
18k
Practical Orchestrator
shlominoach
183
9.8k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
501
140k
Visualization
eitanlees
137
14k
Become a Pro
speakerdeck
PRO
13
4.6k
Typedesign – Prime Four
hannesfritz
36
2.1k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
22
1.6k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3.1k
Designing for humans not robots
tammielis
247
25k
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/