Businesses around the world are running their websites and applications in the cloud to lower costs, improve time-to-market, and enable rapid scalability. Regardless of your use case or industry it is crucial that your website and applications are always available, auto-scale up and down according to demand and operate at a low cost. Join this webinar to learn about Amazon's S3 which provides highly durable and available cloud storage for a variety of content, ranging from web applications to media files and allows you to distribute your content directly from Amazon S3. In this session we will showcase the AWS SDKs for JavaScript for Node.js and JavaScript for the Browser.

1. AWS$201$
Delivering$Apps$and$Websites$
Without$Servers$
Markku$Lepistö$=$Technology$Evangelist$
@markkulepisto$

2. Housekeeping$
• Q&A$using$the$quesHons$panel$during$the$presentaHon$
• Reminder$–$Fill$in$the$survey!$

3. JavaScript!
is everywhere.!

4. AWS SDK for!
JavaScript in Node.js!

5. AWS SDK for!
JavaScript in the Browser!
Desktop or mobile devices!

6. Let’s use them.!

7. Goals!
1. Learn about AWS SDK for Node.js!
2. Introduce AWS SDK for JavaScript
in the Browser!
3. Write a two-tiered web application
using JavaScript, HTML, and CSS!

8. AWS SDK for !
Node.js!

9. Full Service Coverage!
Support for over 30 AWS services!

10. Extensible Clients!
Customize any part of the request cycle!

11. Standard Node.js Idioms!
Streams, EventEmitter, Domains!

12. Open Source!
Apache License, Version 2.0!
http://github.com/aws/aws-sdk-js!

13. AWS SDK!
for Node.js!
30+ Services!
Extensible!
Idiomatic!
Open Source!

14. Getting Started!
AWS SDK for Node.js!

15. $ npm install aws-sdk
Bash!
Installing!

16. var AWS = require(‘aws-sdk’);
JS!
Loading!

17. Configuring!
the SDK!
AWS.config!
Credentials *!
Region *!
Extras!
* Required by the SDK!

18. Configuring
Credentials!
IAM roles for EC2
Instances"
Environment Variables!
File System (outside
source control)!

19. Do Not Hardcode
Credentials!
Unless they are read-only and scoped to specific resources.!

20. IAM Roles for EC2 Instances!
=!
Zero Configuration!

21. Environment Variables!
AWS_ACCESS_KEY_ID!
AWS_SECRET_ACCESS_KEY!
AWS_REGION*!

22. Configuring!
Region and Extras!

23. JS!
AWS.config.update({
region: ‘ap-southeast-1’, // AWS_REGION
maxRetries: 10, // default: 3
logger: process.stdout,
// ... more options ...
});

24. Config From a File!
AWS.config.loadFromPath(‘./config.json’);
JS!
If this file contains credentials, keep it out of source control!

25. Working with
Services!

26. Service
Objects!
AWS.S3!
AWS.EC2!
AWS.DynamoDB!
AWS.SQS!
AWS.SNS!
...!

27. var ec2 = new AWS.EC2([config]);
JS!
Constructing a Service Object!

28. ec2.describeInstances(params, callback);
JS!
Calling an Operation!

29. function (err, data) { ... }
JS!
The Callback!

30. var req = ec2.describeInstances(params);
JS!
Getting a Request Object!

31. var resp = req.send(callback);
JS!
Sending the Request Object!

32. req.on(‘complete’, function(resp) { ... });
JS!
Adding Listeners!
to the Request Object!

33. The Request Cycle!

34. Send AWS.Request!
Get AWS.Response!

35. Operation"
AWS.Request"
AWS.Response"
Request Lifecycle!
Emitted Lifecycle Events"
complete!
success!
build! sign! send!
error!
... ... ...
send()!callback!

36. AWS.Request!
.send(callback)!
.on(event, callback)!
.httpRequest!
...!

37. AWS.Response!
.error!
.data!
.retryCount!
.httpResponse!
...!

38. Request!
Lifecycle!
Recap!
Send AWS.Request!
Emits Lifecycle Events!
Callback with AWS.Response!

39. Features!
of the SDK!

40. SDK
Features!
Global Configuration Object!
Bound Parameters!
Response Pagination!
Event Listeners (Per-Service and Global)!
API Version Locking!
Secure Credential Management!

41. Demo!

42. AWS SDK!
for JavaScript!
in the Browser!

43. Getting the SDK!
language!
<script src=”https://sdk.amazonaws.com/js/aws-sdk-2.0.18.min.js” />

44. 7 Supported
Services!
S3!
DynamoDB!
SQS!
SNS!
STS!
Kinesis!
CloudWatch!

45. All Modern Browsers!
28.0+! 23.0+! 10+! 17.0+! 5.1+!

46. Usage is the same.!
But in your browser or mobile device!

47. Configuration!
is Different!

48. Why is it different?!
Two-Tier Web
Applications!

49. Traditional Application Architecture!
Your Services!
Node.js Backend!Other Services!

50. Two-Tier Application Architecture!
Your Services!
SDK on the Device!

51. Benefits!
Fewer moving parts!
Easy prototyping!
Deploying as simple as
copying files to Amazon S3!
Fully dynamic app for
pennies a month!

52. Next Level!
Web Apps!

53. App!
Ideas!
Forum Software!
Blog Commenting Service!
Blogging Platform!
Firefox/Chrome Extensions!
WinRT (Metro Style) Apps!
Any Mobile App!!

54. Let’s Look at a!
Web Application!
Using nothing but!
HTML, CSS, and JavaScript!

55. A Simple Blog!
Content stored in Amazon DynamoDB!
Assets in Amazon S3!

56. Demo!

57. Key
Differences!
Three-Tier to Two-Tier!
Browser Security!
CORS in the browser
Credentials on device!

58. Cross-Origin
Resource Sharing!

59. CORS!
Browser sends pre-flight request
to external host.!
Host acknowledges browser.!
Browser sends XHR request.!

60. CORS!
+ S3!
CORS needs special
configuration on Amazon S3.!
Configure CORS with bucket
policy.!

61. Configuring CORS on Amazon S3!

62. Getting Credentials!
Onto Your Device!

63. Getting!
Credentials!
Onto Your
Device!
Never hardcode
credentials"
Use Web Identity
Federation!

64. Web Identity Federation!
Use Facebook, Google, or log in with
Amazon as third-party identity providers!

65. Web Identity Federation!
Set up IAM roles for!
these identity providers!

66. 1
2
3

67. Web Identity Federation!
Set up permissions for IAM role!

68. AWS.WebIdentityCredentials!
JS!
AWS.config.credentials = new AWS.WebIdentityCredentials({
RoleArn: ‘arn:aws:iam::<ACCOUNT_ID>:role/<ROLE_NAME>’,
ProviderId: ‘graph.facebook.com’,
WebIdentityToken: fbAccessToken
});

69. Get a Facebook Access Token!
JS!
// 1. Load the FB JS SDK
// 2. Call FB.login()
FB.login(function (response) {
if (response.authResponse) {
fbAccessToken = response.authResponse.accessToken;
AWS.config.credentials = new AWS.WebIdentityCredentials({...});
});

70. Same Concept!
For other identity providers!

71. Amazon Cognito support in!
AWS SDKs for JavaScript in !
Node.js & the Browser!
Easy Identity Management & Content Sync!

72. Our Community!

73. We ♥!
Open Source!

74. https://github.com/!
aws/aws-sdk-js!

75. Contributing!
to the SDK!
Improve Documentation!
Report Issues!
Submit Pull Requests!
Third-Party Plugins!

76. Third Party Plugins!
A great way to add features!

77. Node.js!

78. Write More!!

79. Thank$you$
Markku$Lepistö$=$Technology$Evangelist$
@markkulepisto$

80. Your$feedback$is$important$
Please$complete$the$
Survey!$
What’s'good,'what’s'not'
What'you'want'to'see'at'these'events'
What'you'want'AWS'to'deliver'for'you'