Web development tool<\/h3>\n\n\n\n
I went with WordPress as it is quite a classic by now and used by people of all skills. With all the templates that comes with WordPress you can get a very nice layout with little to none understanding of the customization. All you need to do is post your content and update a few titles or upload media. I ended up finding free templates on Google instead of using one of the boring ones half-free ones that comes by default with WordPress.<\/p>\n\n\n\n
When it came to development itself and designing my website I setup a local WordPress on my laptop. First you need to pick a server for your web development that suits you. I went with WAMP but you might as well pick something like a linux-based LAMP. This is the guide I went with to setup WordPress locally using WAMP<\/a>. One that is done you can download and install a WordPress-plugin called “Simply Static” that can generate your static content as a Zipfile that you want to extract and upload to S3.<\/p>\n\n\n\n Once you have everything in your S3-bucket you can share it as public and call it a day. But there are several reasons why you want to take this further.<\/p>\n\n\n\n I found this video to be very helpful<\/a>. You setup your domain (either through AWS or import one), customize CloudFront, requests a certificate in AWS, wait a few minutes, observe CNAME to show up as a record in your Route53 Hosted Zone and connect the CloudFront domain name with a A record in your Hosted Zone. Boom, its done!<\/p>\n\n\n\n There are a few tricky things regarding how you connect S3 and CloudFront, you can either make your S3 bucket public and connect it, but then anyone can access that content directly through the S3 URL so the point of CloudFront becomes less useful. Instead what you want to do is make the S3 bucket private and add a Bucket Policy that only allows access from CloudFront. I tried this but ended up with issues to access subpages running index.html. You can read more about how to restrict this access only to CloudFront<\/a> and maybe you figure out how to work around the issue I experienced.<\/p>\n\n\n\n The more I work with this blog I realise a few things I would like to add later on.<\/p>\n\n\n\n One thing for sure is the possibility of adding some kind of CI\/CD pipeline to this blog. Adding any posts such as this one or making a small bug fix requires me to download a zip over all content and manually dump it in S3. While this only takes a few minutes to complete it’s still a very mundane process. I know that there are a few plugins for this but I prefer to make my own setup if its a small project that doesn’t do that much. Perhaps I can find a way to push commits to a GitHub repository which then could automatically pull any changes and deploy them to S3 using AWS CodePipeline.<\/p>\n\n\n\n Another is to find a better way of publishing new posts on my social feeds such as LinkedIn. I believe this can be done with something like AWS SNS or SQS. Will look into it later!<\/p>\n","protected":false},"excerpt":{"rendered":" When I first started out with making a blog the first thing on my mind was to make use of the static webhosting-feature on AWS S3, meaning that we can basically put a index.html file under a root folder and tell S3 to display the content under a URL. The result is quite good once… Read More »How I elevated my AWS-hosted blog<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":474,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","_themeisle_gutenberg_block_has_review":false,"_ti_tpc_template_sync":false,"_ti_tpc_template_id":""},"categories":[5],"tags":[3,4],"_links":{"self":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/posts\/484"}],"collection":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/comments?post=484"}],"version-history":[{"count":5,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/posts\/484\/revisions"}],"predecessor-version":[{"id":492,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/posts\/484\/revisions\/492"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/media\/474"}],"wp:attachment":[{"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/media?parent=484"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/categories?post=484"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/localhost\/wordpress\/wp-json\/wp\/v2\/tags?post=484"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}Register your own domain<\/h3>\n\n\n\n
\n
While hosting your website content on S3 is in itself quite cheap. With a cost of $0.023 per GB \/ Month while also supported by the Free tier-trial period of your first year, I would say this is close to free for your common private website. Thats why this is preferable to using a virtual server with a storage or other third-party solutions outside AWS.<\/li>\n\n\n\n
By making use of CloudFront we can not only cache content to reduce the latency, but we also save money on frequent traffic to our S3 content using consolidated requests. Another great thing about CloudFront is that it will help us out with some security aspects such as traffic encryption.<\/li>\n\n\n\n
And last but not least we will leverage Route53 to register our own domain. This will give it more of a professional look and it will only cost us around 9-14$ \/ Year.<\/li>\n<\/ol>\n\n\n![\"\"](\"http:\/\/localhost\/wordpress\/wp-content\/uploads\/2023\/05\/image-2.png\")
Improvements<\/h3>\n\n\n\n