DEV Community

Host a serverless static website with free SSL in 15 minutes.

Arswaw on February 20, 2019

In this guide, I will show you how to host a static website using AWS in a serverless manner. The following AWS services will be used: Simple St...
Collapse
 
mazyvan profile image
Iván Sánchez

I think this post missed an important point. So for some people here talking about other solutions or alternatives. Using cloudfront brings you a really great feature that is CDN. Your site is hosted on many locations over the world, this means less latency. The Cloudfront page even says that the amazon prime movies are stored using Cloudfront. So IMHO this provides a great architectural design to your project

Collapse
 
arswaw profile image
Arswaw

It's possible that those alternatives provide global deployments.

Collapse
 
mazyvan profile image
Iván Sánchez

I mean yeah. But it is probably not as good as the replication aws cloudfront provides you. In my opinion the reason to go for this approach is just that. Cloudfront charges for that.

Collapse
 
jjdelc profile image
Jj

Is there a way to do it without hosting the full zone on route53?

Having only a subdomain served through ssl hosted on s3, while the zone is managed by another DNS manager where there are currently several rules already in place.

Collapse
 
arswaw profile image
Arswaw

Does your DNS manager allow you to create CNAME records? Try adding one of those and point it to your Cloudfront URL. Cloudfront has a space for you to pass in alternate domain names. Type the outside domain in that field.

If you try, would you mind letting me know if it worked?

Collapse
 
jjdelc profile image
Jj

Yup, it worked using the alternate names and a CNAME redirecting. Thanks!

Collapse
 
pabloc profile image
PabloC

Netlify includes almost all of this and it's free.

Collapse
 
arswaw profile image
Arswaw • Edited

A friend of mine uses it. He seems to like it. If a person wants to use Netlify, then they have this option. If a person wants to use AWS, then this guide may prove beneficial.

Collapse
 
oluwoleilesanmi profile image
oluwole ilesanmi

Hi thanks for this post i intend to use this to learn more about server-less and aws services, how much will it cost deploying a static site using this approach with let say 12000 visitors per month.Thanks

Collapse
 
arswaw profile image
Arswaw

Pennies

Collapse
 
arswaw profile image
Arswaw

The other commenters mentioned other hosting providers that would work. This is how you might do it on AWS.

Interesting that you're hosting 100 websites in one S3 bucket. I think I'd call that an antipattern.

Collapse
 
nndevstudio profile image
Nemanja Novicic

Good article. I would add "Default Root Object: index.html" to CloudFront distribution since you do not use the "Use this bucket to host a website" approach so there is no "Index document" field then.

Collapse
 
arswaw profile image
Arswaw

Yeah I should outline both approaches in the article. Thank you.

Collapse
 
darthwalsh profile image
Carl Walsh

Would I need to renew my cert to keep HTTPS working? Maybe it would be worth adding a section for that.

I've used GitHub pages for creating a static site, and they handle the cert renewal.

Collapse
 
arswaw profile image
Arswaw • Edited

AWS Certificate Manager handles renewals. I will make a note of that in the post.

I use Github pages for my personal site. I didn't always realize how convenient it was to have the cert renewal. Your reminder may help people who are concerned.

Thank you.

Collapse
 
stojano profile image
Dejan Stojanović

I do this with 3 commands:
firebase init
firebase deploy
and "Add Domain" in the hosting section

Collapse
 
arswaw profile image
Arswaw

There are many excellent hosting solutions for static websites. Firebase is one of them. My guide can help those who wish to host theirs on AWS.

Collapse
 
bayuangora profile image
Bayu Angora

How to use free AWS without credit card?

Collapse
 
arswaw profile image
Arswaw • Edited

I've tried, but according to the documentation, you cannot use AWS without a bank card.

If you're a student then AWS Educate may be usable without a card.

EDIT: I now see an option to add a bank to my account. Maybe that could work too.

Collapse
 
arswaw profile image
Arswaw

Yes, that's right. You can go to the origin tab on your distribution. Then you can and select "Yes, update bucket policy."

Collapse
 
theswaminator profile image
Nikhil Swaminathan

AWS Amplify Console provides a simplified experience for doing all of the above with continuous deployment - console.amplify.aws

Collapse
 
arswaw profile image
Arswaw

If a user chooses to use Amplify, I hope it works for them. If a user chooses to use my guide, I wish them the best.