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
18
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
サーバーレスらしさを意識した AWSにおける開発手法 / Development methodologies in AWS that are serverless-like
seike460
PRO
1
55
OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI
seike460
PRO
2
180
PHP8.3の機能を振り返る / Review of PHP 8.3 features
seike460
PRO
1
120
フルサーバーレスアーキテクチャの運用を重ねた先に見える価値 / 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
86
「サーバーレス」ってなんだろう みんなでワイガヤ談義 / What is "serverless?" Wigaya discussion with everyone
seike460
PRO
0
34
とにかくHTTP3をライトニングに話す / Anyway, I'll talk to Lightning about HTTP3.
seike460
PRO
0
130
PHP Serverless Pattern
seike460
PRO
0
13
Other Decks in Programming
See All in Programming
AppRouter Panel Talk
yosuke_furukawa
PRO
1
490
Komplexe Oberflächen mit SVG und der Web Animation API
joergneumann
0
680
“Seeing Like a Programmer”—Resiliency, Limits, and Moral Hazards in Software Engineering (LambdaConf 2024)
chriskrycho
0
260
MicrosoftのPlatform Engineeringガイドを読んで実際になにかやってみた
ymd65536
1
530
PostmanでAPIの動作確認が楽になった話
h455h1
0
190
GitHub Copilotのススメ
marcy731
1
240
Fast JSX: Don't clone props object #28768
yossydev
1
200
パフォーマンスを求めてDBに機能を寄せる戦略
aoyagikouhei
0
110
Netty Chicago Java User Group 2024-04-17
sullis
0
210
Milestoner
bkuhlmann
1
420
Webアプリをできるだけコードを手書きしないで作ってみる
tomokusaba
2
190
Git Rebase
bkuhlmann
11
1.6k
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
111
6.5k
Principles of Awesome APIs and How to Build Them.
keavy
121
16k
Unsuck your backbone
ammeep
664
57k
WebSockets: Embracing the real-time Web
robhawkes
59
7k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
123
39k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
188
16k
How GitHub (no longer) Works
holman
305
140k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
20
1.8k
Code Reviewing Like a Champion
maltzj
515
39k
We Have a Design System, Now What?
morganepeng
43
6.8k
Robots, Beer and Maslow
schacon
PRO
155
7.9k
Writing Fast Ruby
sferik
622
60k
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/