An Introduction to Static Sites and AWS

Slide 1

Slide 1 text

An Introduction to Static Sites and AWS @rdegges

Slide 2

Slide 2 text

I’m Randall Degges Developer Evangelist at Stormpath Python / Node / Go Hacker

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

What’s a Static Site? Server Show me the site! Ok, here’s some HTML.

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

What’s a Dynamic Site? Server Show m e the site! Ok, here’s some HTML. Node.js Hey, give me the website! Someone wants it! Ok dude! Here’s the website.

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

What Should I Do?

Slide 9

Slide 9 text

FAST

Slide 10

Slide 10 text

Slide 11

Slide 11 text

FUCK!

Slide 12

Slide 12 text

Server Wow this site is so fast! I’m going to tell all my friends about it.

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Server Wow. This site is slow. I hate this website. I hate all websites. I hate the internet.

Slide 15

Slide 15 text

● How to host static websites on Amazon S3. ● How to make really REALLY fast websites with Amazon Cloudfront. ● How to buy and manage domain names and DNS. ● How to deploy real sites like a boss with DNS. ● Whatever else ya wanna know =)

Slide 16

Slide 16 text

Let’s Build a Resume Site

Slide 17

Slide 17 text

http://themeforest.net

Slide 18

Slide 18 text

What is AWS?

Slide 19

Slide 19 text

What is S3?

Slide 20

Slide 20 text

SO FAST AND CHEAP *3 cents per GB

Slide 21

Slide 21 text

www.mywebsite.com

Slide 22

Slide 22 text

Set it Up aws.amazon.com

Slide 23

Slide 23 text

https://github.com/rdegges/resume.rdegges.com OR Make your own Git repository and add some html.

Slide 24

Slide 24 text

< IAM User Creation Demo >

Slide 25

Slide 25 text

Setup the AWS CLI Tool $ brew install python $ sudo pip install awscli $ aws configure default region: us-east-1

Slide 26

Slide 26 text

Create an S3 Bucket

Slide 27

Slide 27 text

$ aws s3 mb s3://resume.rdegges.com $ aws s3 website s3://resume.rdegges.com --index-document index.html $ aws s3 sync . s3://resume.rdegges.com --exclude '.git/*' --exclude 'Makefile' --acl public-read --delete

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

Cool site. Lame URL.

Slide 31

Slide 31 text

DNS! http://domai.nr

Slide 32

Slide 32 text

DNSimple

Slide 33

Slide 33 text

https://dnsimple.com/r/d9a8f0b92dfb78 Make an Account

Slide 34

Slide 34 text

Buy a Domain

Slide 35

Slide 35 text

Setup DNS to Point to S3

Slide 36

Slide 36 text

Cool site! Cool URL! Not as fast as Google tho :(

Slide 37

Slide 37 text

What’s a CDN? www.mywebsite.com (Website is in China)

Slide 38

Slide 38 text

In Depth www.mywebsite.com I’m in Los Angeles! DNS California Ireland China UK Hmm. This guy is in California. Let’s send him to the California servers!

Slide 39

Slide 39 text

Introducing Cloudfront!

Slide 40

Slide 40 text

California Ireland China UK etc

Slide 41

Slide 41 text

< Setup Cloudfront Distribution >

Slide 42

Slide 42 text

Cool site! Cool URL! So fast!

Slide 43

Slide 43 text

Automating Deployments S3_BUCKET=s3://resume.rdegges.com/ all: aws s3 sync . $(S3_BUCKET) --exclude '.git/*' --exclude 'Makefile' --acl public-read --delete