by Nader Dabit, Developer Advocate AWS You’ve got an awesome startup idea – Wild Rydes! The next generation in transportation will be driven by a willing unicorn population and your new startup will produce the worlds first unicorn hailing services. It’s just seven days to launch, and your designers have delivered the final designs for your website, but your idea depends on the mobile economy! Can you build out your web and mobile infrastructure in time for your launch? Across three days, AWS experts will guide you through all the pieces that are needed to produce an awesome mobile experience for both your unicorns and your riders.

1. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
Building Mobile Apps with AWS
Amplify
Nader Dabit
Developer Advocate, AWS Mobile
Pop-up Loft

2. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
A JavaScript library for application
development using cloud services.

3. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
• Secure Authentication & Authorization
• APIs & serverless logic
• Realtime Data access
• Analytics & targeted messaging
• Streaming over lossy networks
• Push Notifications
• Storage / S3

4. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
Authentication & Authorization
Federation
Amazon Cognito

5. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
Fully managed APIs
”Front Door” for many apps
Amazon API Gateway

6. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
Business Logic
Run code on demand & in response to events
Easily spin up microservices
AWS Lambda

7. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
• Analytics
• Engagement
• SMS, Email, Push
Amazon Pinpoint

8. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
• Managed GraphQL
• Real-time data
• Offline & synchronization
AWS AppSync

9. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
Front-end Support – Framework integrations
React React Native Angular

10. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Mobile CLI
Command line interface for developers to seamlessly
create, enable, & configure AWS services.

11. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Mobile CLI
AWS Mobile CLI
+
AWS Amplify

12. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
Getting Started with AWS Amplify
1. Add AWS Amplify to project
yarn add aws-amplify

13. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
Getting Started with AWS Amplify
2. Configure project with AWS resources
import Amplify from 'aws-amplify’
import config from './aws-exports’
Amplify.configure(config)

14. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
AWS Amplify
API Deep Dive

15. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Authentication / User Identity
• Declarative APIs for Sign-Up, Sign-In, MFA, & Credential status
• React Higher Order Components
• Angular Services & View Components
• Pre-built UI or build a custom UI

16. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Auth class
import { Auth } from 'aws-amplify'
Auth.signUp({ …credentials })
Auth.signIn(username, password)
Base API

17. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Auth class methods
confirmSignIn
confirmSignUp
currentAuthenticatedUser
enableSMS
disableSMS
resendSignUp
forgotPassword
forgotPasswordSubmit
34 available methods

18. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Authentication
React / React Native support
import { withAuthenticator } from 'aws-amplify-react-native’
export default withAuthenticator(App)

19. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Analytics
• Automatic session metrics from configuration
• Capture custom tracking events
• Capture custom tracking events with attributes
• Capture custom tracking events with metrics
• Record authentication events

20. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Analytics
Base API
import { Analytics } from 'aws-amplify-react-native’
Analytics.record(‘Button Pressed')

21. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Analytics class methods
record
enable
disable
startSession
stopSession

22. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Storage
• Store application content
• Public: all users of an app can access
• Private: individual user content
• Automatically track storage events through Pinpoint
• React / React Native Components

23. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Storage
Base API
import { Storage } from 'aws-amplify-react-native’
Storage.get(‘welcome.png')

24. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Storage class methods
get
put
remove
list
configure

25. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
Storage
React Components
import { S3Image, S3Album } from 'aws-amplify-react-
native’
render() {
return <S3Image imgKey={'myImage.png'} />
}

26. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
API Module
• Automatically sign requests using AWS Signature 4
• Very useful with Amazon API Gateway
• HTTP verbs & options
• Use multiple endpoints
• GraphQL Support

27. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
API Deep Dive
API
Base API
import { API } from 'aws-amplify’
let apiName = 'MyApiName'
let path = '/mypath'
API.get(apiName, path)
.then(response => // do something with response)

28. © 2018, Amazon Web Services, Inc. or its Affiliates. All rights reserved.
Thank you
Building Mobile Apps with AWS Amplify
aws.amazon.com/mobile
@AWSforMobile