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
【第6回】フロントエンド× ビアバッシュ[React Native, React] × AWS...
Search
hiroyuki8103
January 26, 2019
Programming
0
710
【第6回】フロントエンド× ビアバッシュ[React Native, React] × AWS Amplify
認証認可をAWS Cognitoにまかせる際に、提供されているJavascriptライブラリを使えば超簡単に認証付きページが完成する話
hiroyuki8103
January 26, 2019
Tweet
Share
More Decks by hiroyuki8103
See All by hiroyuki8103
【第7回】フロントエンド× ビアバッシュ初心者勉強会 酒がナイト in 神保町
hiroyuki8103
1
410
第6回フロントエンド× ビアバッシュ 初心者勉強会_ご案内
hiroyuki8103
0
340
第二回React勉強会.pdf
hiroyuki8103
0
270
第一回 酒がないとReact勉強会_初心者がReactで学ぶのに役立ったサイト/勉強方法を紹介
hiroyuki8103
1
340
Other Decks in Programming
See All in Programming
Protocol Buffersの型を超えて拡張性を得る / Beyond Protocol Buffers Types Achieving Extensibility
linyows
0
110
JSONataを使ってみよう Step Functionsが楽しくなる実践テクニック #devio2025
dafujii
0
410
Laravel Boost 超入門
fire_arlo
2
210
Putting The Genie in the Bottle - A Crash Course on running LLMs on Android
iurysza
0
120
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
200
機能追加とリーダー業務の類似性
rinchoku
2
1.1k
go test -json そして testing.T.Attr / Kyoto.go #63
utgwkk
3
260
AIを活用し、今後に備えるための技術知識 / Basic Knowledge to Utilize AI
kishida
20
5.1k
1から理解するWeb Push
dora1998
7
1.7k
Introducing ReActionView: A new ActionView-compatible ERB Engine @ Rails World 2025, Amsterdam
marcoroth
0
560
Ruby×iOSアプリ開発 ~共に歩んだエコシステムの物語~
temoki
0
250
コンテキストエンジニアリング Cursor編
kinopeee
1
760
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Testing 201, or: Great Expectations
jmmastey
45
7.6k
Building Adaptive Systems
keathley
43
2.7k
Producing Creativity
orderedlist
PRO
347
40k
Thoughts on Productivity
jonyablonski
70
4.8k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
How to Ace a Technical Interview
jacobian
279
23k
4 Signs Your Business is Dying
shpigford
184
22k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.2k
Documentation Writing (for coders)
carmenintech
74
5k
Transcript
[React Native, React, Vuejs] AWS Amplify SMS
@hiromb1804
Jehb u hiro ##! u /(?@4%'C-9$ u RubyGUVQ 3AY PKRa#
u OSier=B1)6PKW\c! u DIM[ =B1)6/+;."NF Z SX^H <BC6'C7:2)'C7_`"idjT React Native LaravelAWS 'C-9$UI/UX5,&8>*0fLg]E
! "#"$ % &
6;6@!$" :A JS%*' + .? (&()< CFE u 6;6@# 9-07D
8 =,> (Outh2.0, Open ID Connect…) u AWSFirebaseAuth0 31 Javascript( &()< FE 429 u B AWS5/%*'+ < (&() 31 React React Native VueAngularIonic
2BReact?AC)! @101H5 ReactIG@ Amplify+'+, ."%- AWS Amplify CLI ."%->9;4 create-react-app
amplify configure amplify init amplify add auth amplify push amplify add hosting ?AED *"$.ED073: React &</F= WEB %86 amplify publish "$#( "$#( "$#( "$#( WEB
React u React
u create-react-app project-name u cd project-name u npm install aws-amplify aws-amplify-react u npm start
AWS Amplify CLI "(- '#+)!$ u amplify-cli amplify congigure
'# u npm install -g @aws-amplify/cli u amplify configure &ap-northeast-1 *# accessKeyIDsecretAccessKey %, . !$
AWS ID
amplify init u $ #"! u javascript
→ react % OK
amplify init 3 u AWS ←AWS CloudFormation
amplify init / 3 u ;:9? >@0)%! +3 u
amplify status" 72amplify add 28-4$"&<1 amplify publish #,*'. 6(%! =5
amplify add auth Cognito amplify add hosting S3 u
aws-exports.js src$ %!#" u amplify push amplify publish
amplify auth amplify push
React index.js App.js 3
1 1
amplify add publish URL http://2reactcognito-20190126130822-hostingbucket.s3-website-ap-northeast-
1.amazonaws.com/
SMS"!$# u
u SMS
JWT (WEB )
AWS Cognito
!
React Native Vue % (' u WEB
S3 publish % "# &!(' $
u How to Build Cloud-Powered Mobile Apps with Expo
& AWS Amplify https://blog.expo.io/how-to-build-cloud-powered-mobile-apps-with-expo-aws- amplify-2fddc898f9a2 u AWS Amplify + React.js https://qiita.com/monamu/items/f40836cd4b1b14a13c68 u AWS Amplify React https://dev.classmethod.jp/client-side/javascript/amplify-custom-signup/