My blog for fun

tech

One fine day I found my personal website all boring and nothing ecstatic - just plain. It has been up since 2016 and it has been reskinned couple of times as I used to work as a UI Designer / Developer and you got to - show it off! So I decided to do some housekeeping and grooming for fun.


I am going to break down the tools and how I go about using them and how I have piece all these amazing tools together.

What are the tools I use for fun

My Blog Architecture

I am going to break this down into three parts as illustrated above.

First, I will talk about the blog. My blogsite is built using Next.js and TailwindCss and consuming from a graphQL endpoint. I am consuming the graphQL queries using Apollo Client at the time of writing however I am looking at switching with graphql-request. I am using github actions to do the orchestration of my workflow where my SSG is being cooked up.

Second, my blog won't be how it works now without its backbone that is hosted in Railway which manages both my postgreSQL database and CMS. I have gone through a lot of CMS where I wanted it free(almost) and Strapi mostly ticked the boxes for me. I was basically looking for a CMS that I can self host as I also want it to be cost-efficient and be able to extend it however I want.

Third, piecing my first and second parts together as they get deployed in my AWS S3 bucket and optimized with Cloudfront. This is a pretty common setup nothing fancy.

Why this than that

I have a few questions to myself along the way as to why I choose a tool to be in my line-up and for sure are up for debate.

  • Why graphQL instead of consuming RESTful api? I wanted different though not my first time.
  • Why Apollo Client and not use native fetch for graphql? Its no fun, I realize as I was optimising my builds, I realise I don't need data caching and state management where Apollo Client is a clear winner so I thought of switching to graphql-request as I mentioned earlier.
  • Why railway when most of the stacks are in AWS? I started railway as a hobbyist with just $5 and I can spin up my environments at a breeze and so far nothing more. Strapi needs to run on an instance higher than a T2 micro in EC2 and maintain it which may cost me more. But it doesn't end there, I am still considering moving it in AWS on a cost-efficient setup - maybe a future write up too when I get it up and running.

Ooops! I am on SSG how do I push my updates out

Building an SSG comes with its pros and cons however, its PROs on performance outweighs the CONs. So, when I publish posts and updates in strapi, my blogsite will never know what went out leaving it in the cold and all clueless. In the case if I built it consuming an api on run time, it will just be a piece of cake, no fun again.

beemo-v2-publisher.png

Another piece I need, a github REST api to trigger events such as workflow to trigger a build. However, strapi's webhook does not support the payload that github requires to trigger my workflow. Then comes, AWS Lambda, I have setup a lambda function that includes the data I need and pass to the github REST api to run the workflow correctly. Basically, I configured my API endpoint in my strapi webhook settings that points to my lambda function which initiates the request to Github. It sounds like a lot of work but it was fun.

For simplicity's sake, the common approach would be to expose strapi's api endpoint and either consume it on build time or during run time and never have to do all these heavy lifting and juggling of different stacks. But I knew one thing when I built this, I was working for fun and exploration.

Whats next

I am still optimising this build and setup so my stacks may change from the time I am writing this. Well, thats how learning works - fail fast, learn and iterate.

Also, my lab is crafting something exciting. Check it out sometime in the future.