AWS Tutorial - How To Host A Static Website With Namecheap, Route 53, Cloudfront, S3 and SSL

AWS Tutorial - How To Host A Static Website With Namecheap, Route 53, Cloudfront, S3 and SSL
In this video we learn how to buy your domain, deploy your static website on aws using s3, cloudfront, route53 and the certificate manager.
Basically everything you need to know to deploy your website in a proper way.

Пікірлер: 81

  • @chaitanyaprabuddha7657
    @chaitanyaprabuddha76572 жыл бұрын

    BEST TUTORIAL ON INTERNET. I was crying for last 3 hours.

  • @ProjectGreenfieldSolutions
    @ProjectGreenfieldSolutions4 ай бұрын

    Thank you, was struggling with the NameCheap Host entry part. (Just as you mentioned, everyone does this wrong. haha!) Also other parts of this tutorial got me over the finish line! Had done this process before entirely in AWS but new to using external domains.

  • @jay3108
    @jay31083 жыл бұрын

    Great! It worked! However, I made a few mistakes along the way (that cost me so much time) because I had previously defined buckets and distributions that I applied earlier by following other articles/tutorials. My advice to anyone who struggled with different methods from other tutorials before applying this tutorial: 1. DO NOT MODIFY your pre-defined buckets, distributions, records, etc. in case you tried different tutorials from articles or elsewhere. 2. DELETE any pre-defined buckets, distributions, route 53 hosted zones you had before getting started with this tutorial. 3. APPLY each step along the way CAREFULLY to avoid time-wasting errors. Good luck and thanks Vlad!

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Glad it worked for you :)

  • @camiedecovich7854
    @camiedecovich78542 жыл бұрын

    Thank you! I was completely stuck and could not find a clear explanation of the problem to deploy my site. With your help, my website is live!

  • @SerottaPDX
    @SerottaPDX3 жыл бұрын

    thanks for this and thanks for showing the part about the A records. I think a lot of people forget to set those. Much appreciated.

  • @ProgrammingWithPax
    @ProgrammingWithPax3 жыл бұрын

    Great video Vlad! Thanks for all of this knowledge. As a frontend developer who hasn't dug into AWS as much yet, this video was really helpful. Subscribed!

  • @spencerknight1730
    @spencerknight17302 жыл бұрын

    i spent 2 days fiddling around not able to deploy my own site. your video cleared everything up. thanks so much!

  • @awildcow17
    @awildcow172 жыл бұрын

    This is an absolutely amazing guide! Thank you so much! Well done and easy to digest, you saved me SO much time ♥

  • @Javoke
    @Javoke3 жыл бұрын

    OMG!!! You are such a genius!!! Love your explanation, thanks for sharing your knowledge with the world!! It really helped me a lot!! You earned a new follower!!!

  • @thewonderonesie782
    @thewonderonesie782 Жыл бұрын

    You are my hero.... after I spend tons of time googling, looking for what I was doing wrong, you, like an angel from heaven, had everything I needed in this video. Thank you, thank you, thank you!

  • @chriiisle
    @chriiisle2 жыл бұрын

    Super solid video, extremely coherent and well explained!

  • @99mconn
    @99mconn3 жыл бұрын

    Very well done tutorial - thanks Vlad! One thing to note - at around 14:00 in the CloudFront section when configuring Distribution Settings you may find that the 'Custom SSL Certificate' option is greyed-out. I looked around in the AWS forums and many users had the same issue. I didn't find a definitive answer on why this occurs, but the consensus seems to be that you may need to wait a while for this to become available after you create your certificate - something about the time it takes for your certificate to propagate. I found this to be true - I waited overnight and when I logged back in the next morning this option was no longer greyed out and I was able to proceed with the configuration. Hope this is helpful if anyone else runs into this issue.

  • @angelaquijeobando7844

    @angelaquijeobando7844

    3 жыл бұрын

    thank you very much for your comment, it helped me a lot

  • @nmastroianni
    @nmastroianni3 жыл бұрын

    Hi Vlad. I know some views have been critical about the "back and forth" aspect of this video. However, when push comes to shove, this video covered just about everything I was looking for. I too run a small YT channel, and I can attest to the time it takes to make a video (let alone edit them). Often times, it's just better to just get the content out rather than polish it up. *Here comes a 👍and a sub.*

  • @091Cash

    @091Cash

    2 жыл бұрын

    I agree! This helped me understand what I was doing at every step of the process, and I just took some notes to organize the info in my head. Awesome tutorial imo

  • @dekcode2824
    @dekcode28243 жыл бұрын

    Thank you! Making the tutorials in Thai. This is very helpful!!

  • @noblesingh9466
    @noblesingh94663 жыл бұрын

    Thanks Vlad bro, you are taking time out and trying to help us out here. I"ve been following this video and setting up a static site. Having all sort's of issues

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Glad to help

  • @licutricu
    @licutricu2 жыл бұрын

    Thank you so much! Almost an year and still so accurate :)

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Great to hear!

  • @Qronk
    @Qronk3 жыл бұрын

    Great video Vlad, thank you.

  • @VincentLabStudio
    @VincentLabStudio3 жыл бұрын

    Great video. Keep up the good work.

  • @themonkaffiliate
    @themonkaffiliate2 жыл бұрын

    Awesome insights. Exactly what I needed. Thanks a million

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    You're so welcome!

  • @ToMyHe4rT
    @ToMyHe4rT2 жыл бұрын

    Hello BROOOOO, Thank you a lot, your video is very well made, you have a nice voice and flow, and my website is running like hell, thanks again!

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Glad it helped :)

  • @hectorhernandez-wk8jc
    @hectorhernandez-wk8jc3 жыл бұрын

    excellent video thank you very much, keep it up

  • @ekramsyed
    @ekramsyed3 жыл бұрын

    Very helpful video. also has additional suggestions that actually save your time.

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Glad it was helpful!

  • @shamsunnabitaqib6180
    @shamsunnabitaqib61802 жыл бұрын

    great video dude. Keep up this good works..

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Thanks, will do!

  • @josefslezak1432
    @josefslezak14322 жыл бұрын

    Thank you very much!

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    You're welcome!

  • @aliaksandrsavitski1468
    @aliaksandrsavitski1468 Жыл бұрын

    Great tutorial! Thank you! One note: I don't think you need to add the certificate to the namecheap, at least not anymore, as namecheap allows you to add custom CNAME only if you use the namecheap standard DNS, and when you switch to custom DNS - it will wipe out all your settings for this. Instead, you need to add certificate to the CloudFront distribution

  • @CodeWithVlad

    @CodeWithVlad

    Жыл бұрын

    Thanks for the info!

  • @aliaksandrsavitski1468

    @aliaksandrsavitski1468

    Жыл бұрын

    @@CodeWithVlad no problem. I actually figured out that you need to add certificate first, and then add nameservers to apply domain. It’s just counter intuitive if you have domain attached to AWS already and need to add the certificate

  • @justthismango4177

    @justthismango4177

    Жыл бұрын

    @@aliaksandrsavitski1468 Hi, I am having the same problem with the new namecheap update. How should I add the certificate to CloudFront? Are you saying to first validate the certificates through the Advanced DNS section on namecheap, and then switch to custom DNS and add the nameservers? Or is there another method I am missing? Thanks

  • @Nu1zzz
    @Nu1zzz3 жыл бұрын

    Thank you soo much.. it is very help full

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Glad it helped :)

  • @alibaba-ez9un
    @alibaba-ez9un2 жыл бұрын

    thank you very much

  • @CatalystReaction
    @CatalystReaction3 жыл бұрын

    I FUXING LOVE YOU, THERE IS SO MUCH WRONG INFORMATION ON HOW TO PROPERLY DEPLOY SSL CERTS, AND YOURS IS THE ONYL ONE THAT ACTUALLY WORKS, 10000000X THANK YOU'S!

  • @giodefreitas
    @giodefreitas11 ай бұрын

    Awesome guide Vlad! Finally a tutorial that works. I just didn't need to add CNAME record in namecheap for DNS validation. I already have done that with another certificate for the same domain. Would it be because of that?

  • @Madmaniac639
    @Madmaniac6392 жыл бұрын

    Hello Vlad, any video on how to host a NestJS Backend? Thanks, great teaching style.

  • @green-coder
    @green-coder2 жыл бұрын

    very useful

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Thank you!

  • @alejandrochavez4170
    @alejandrochavez41703 жыл бұрын

    Thanks broth!

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Any time!

  • @lono7732
    @lono77323 жыл бұрын

    Thanks for the video, much appreciated! Question: at 30:55 should the Price Class be as you set or same as for www that is US, Canada, Europe?

  • @qone5489
    @qone54893 жыл бұрын

    Great tutorial Vlad! You really nailed in allowing both www and https, as these were the conditions that I wanted to fulfill. Question: When you go to change NAMESERVERS to Custom DNS at namecheap, the host record we inputted before (following your instructions) disappears. Would that matter?

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Yeah that is intended :)

  • @zakariya6829
    @zakariya6829 Жыл бұрын

    Hey, I understood everything you walked us though. I had a doubt, why do we use 2 S3 buckets, can't we just have 1S3 bucket and we can redirect url in route53? I have watched videos in case of ec2 instances domain mapping. I did to do that myself but I wasn't getting any option in the case of Alias to records in route53 which I thought to be our parent website with the www. in it. Btw really appreciate your work.

  • @rogerkent7450
    @rogerkent74503 жыл бұрын

    Great video! Can you tell me how I can modify the website afterward?? Thanks :)

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Sorry, what do you mean?

  • @rochesu
    @rochesu Жыл бұрын

    Two questions... 1. Can we buy and associate SSL to domain from namecheap itself... 2. In case of an angular app - final build produces static files - so what is the advantages of using cloudfront+s3 compared to using hosting from namecheap directly

  • @CodeWithVlad
    @CodeWithVlad2 жыл бұрын

    I hope you loved this video! 🙂 📮Consider subscribing to my newsletter: codewithvlad.substack.com 🔥 And follow me on Twitter: twitter.com/vladimir_agaev

  • @nelsonnjoku4117
    @nelsonnjoku4117 Жыл бұрын

    Please can you make another video since this one is fairly old or does this procedure still work?

  • @mindas22
    @mindas223 жыл бұрын

    It worked for base url, but when cliked on pretty url like www.example.com/aboutus I get 403 error: This XML file does not appear to have any style information associated with it. The document tree is shown below.

  • @donatello4456

    @donatello4456

    3 жыл бұрын

    Same problem

  • @haganlife

    @haganlife

    3 жыл бұрын

    Add “/“ after .com?

  • @liam8469

    @liam8469

    3 жыл бұрын

    same problem

  • @mhmadtohme9856

    @mhmadtohme9856

    Жыл бұрын

    anyone find the solution of it?

  • @Gigabyteserviceofficial
    @Gigabyteserviceofficial2 жыл бұрын

    if we add AWS's NS record into our domain name provider then whatever A name recorder that we had added in our Domain provider's dashboard will not work correct?

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Yes, you basically tell namecheap that aws will handle the records.

  • @plbader3714
    @plbader37143 жыл бұрын

    does sometime means for ever in english ???

  • @yadusolparterre
    @yadusolparterre3 жыл бұрын

    would this work for websites coded in rails, angular or react?

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    Rails not but angular and react yes

  • @yadusolparterre

    @yadusolparterre

    3 жыл бұрын

    @@CodeWithVlad thanks! But why does it work with one framework and not with another one?

  • @CodeWithVlad

    @CodeWithVlad

    3 жыл бұрын

    @@yadusolparterre It's because RoR requires a server. Static websites are just html/css/js files that do not require a server to work. As opposed to a dynamic website with dynamic content, authentication, etc.

  • @Layput
    @Layput Жыл бұрын

    The interface of the Cloudfront has changed and I can't follow it. Could you please update?

  • @CodeWithVlad

    @CodeWithVlad

    Жыл бұрын

    Hey, this video is indeed old now. I would recommend using aws amplify to deploy your website. Or use other tools like Vercel

  • @yadusolparterre
    @yadusolparterre3 жыл бұрын

    good video but you do not say what you are trying to do, so it's difficult to follow you

  • @Diabolica843
    @Diabolica8432 жыл бұрын

    Dude why did you make it all confusing towards the end? Could you not have edited your mistakes out? I went thru halfway only to make changes to everything smh

  • @fantabarack
    @fantabarack3 жыл бұрын

    Yeah, sorry, but I need to agree with others. Super confusing, I'm an IT guy, but these jumping back and forth is a wrong teaching method. DON'T do that.

  • @haganlife

    @haganlife

    3 жыл бұрын

    Looking forward to your excellent tutorial on SSL, AWS very soon! Thank you!

  • @josefslezak6644
    @josefslezak66443 жыл бұрын

    Thank you very much!

  • @CodeWithVlad

    @CodeWithVlad

    2 жыл бұрын

    Welcome!