While studying for my Amazon Certified Developer certification, I learned that Amazon S3 buckets have the ability to be ran as a static website. The cost for the user breaks down to this:

From a development standpoint I really need to only be concerned with PUT/COPY/POST requests based on how often changes are made and the number of files. Overall storage costs are not a concern because a site like this would only be 50 mbs if most images are hosted offsite.

Now this brings us back to Ghost. It runs off of Nodejs which is a server-side execution engine. Which means in its pure form, it cannot be run as a static website.

Then... I found HTTrack (https://www.httrack.com/). HTTrack is a free software that allows one to download a copy of a website to be viewed offline. This means all I need to do is to initialize the site locally, run HTTrack against it and then upload the resulting files to the S3 Bucket.

Some New Problems:

1. S3 is not optimized for sending its content throughout the US/Europe.
2. There would be many requests against the S3 when someone views the websites on initial load.
3. There are now extra steps when deploying the website. (This will be addressed on Part 3)

Solution:

Cloudfront does some amazing things here. Cloudfront is an AWS CDN service that specializes in caching your files at certain end nodes of the AWS network with the result being that the requests to view the site does not have to go all the way to the S3 Bucket but rather to one of the end nodes. Cloudfront also only pulls the files from the S3 Bucket based on a user configured TTL. This means one request of files from S3 can be used to serve files to all visitors for the next few hours.

What's next?

A proper CI/CD implementation. Which you can read about in Part 3.

I dislike CSS, I am not going to lie about it. I'd rather be mowing the lawn or cleaning dishes at a busy restaurant. It's not my strong point and I feel that in most cases unnecessary development time tends to be lost designing even more unnecessary UIs. When a friend advised I should start a site to display my work, I died a little inside. I powered through it and the result is what you see before you. Initially it was an html site, nothing too fancy. The result was... less than ideal. So I scrapped it, sat down and wrote out what I wanted for my site.

Wishlist:
1. It to work.
2. It to be as low cost as possible.
3. It to do all the heavy lifting while I do the heavy writing.

Now #1 is easier said than done, you could spend hours on something and then realize it doesn't work or doesn't do what you want to. To anyone who has worked in the IT field either on a personal or professional level, rabbit holes just come with the experience.

So I began my search hoping that I wouldn't end up in a rabbit hole. (Who knows, when I post this I might realize I am missing something) That's when I stumbled on Ghost (https://ghost.org/), an open source blogging platform that allows creators to share their content.

Great now most of the backend is handled, but now I just need to make my site stand out, but I can't use one of their suggested templates because everyone else is using that. I wanted sleek, responsive and light-weight (no one wants to load a website that then loads 300 scripts).

That's when I stumbled upon the template Uno-Zen (https://github.com/Kikobeats/uno-zen).

New problem: It hasn't been updated in over two years.

I mean it worked but it wouldn't compile which would deadlock me into minimal configuration changes if not resolved. Soooo I forked it, and you can see the results below:

GitHub - MrGiga/uno-zen-revised: Revised Minimalist and Elegant theme for Ghost. Demo @ https://johncurcio.com

Revised Minimalist and Elegant theme for Ghost. Demo @ https://johncurcio.com - GitHub - MrGiga/uno-zen-revised: Revised Minimalist and Elegant theme for Ghost. Demo @ https://johncurcio.com

GitHubMrGiga

What did I do?

1. Implemented a dockerized development environment which displays a Ghost blog with the custom template and auto-reloads when changes are detected.
2. Refactored the Gulp (https://gulpjs.com/) implementation to the latest version which allowed me to compile it.3. Refactored the template to work with the latest version of Ghost.
3. Refactored the template to work with the latest version of Ghost.

What still needs to be done?

1. Dockerfile needs to be minimized.
2. Documentation needs to be updated.
3. Mobile site seems to be having some minor issues.

What's next?

Keeping the site as low cost as possible. Which you can read about in Part 2.