Latest Post

Oracle Cloud VPS and site updates

December 31st, 2022

Summary since the last update:

  • Migrated from my home server to Oracle Cloud VPS

  • Created Ansible playbooks for setting up a simple ubuntu server that serves websites with Nginx

  • Created modular header and footer components for easy updating

  • Implemented nav bar with a dropdown menu in the header

  • Changed footer from grid to flex for improved layout on tablets

  • Added recent posts and project links to the footer

  • Added favicon

Migrating from my home server to Oracle Cloud VPS:

I enjoyed setting up my home server on my old laptop. It was nice to put some use to the hardware that had just been collecting dust. I also appreciated knowing I had complete control over the server.

But I had a number of issues that stemmed from my network and the laptop's hardware. Some of them were unacceptable stability issues that needed to take priority over other projects. Rather than trying to purchase new hardware or identify and solve the multiple issues with my laptop and/or network that were causing my site to be unreachable, I decided to look into VPS's. I discovered that Oracle Cloud offers a free compute instance that could run Ubuntu.

I had recently gone through the process of setting up an ubuntu server and wondered if this next time would be the last. So, instead of just setting it up manually, I learned about Ansible playbooks and created one for setting up the server and another for setting up Nginx to serve a website. This way, if I need to recreate the VPS on Oracle Cloud or another cloud provider, I could run a couple of playbooks and be done with it.

I launched the compute instance, set up my git ssh keys, pulled the repository onto my new server, adjusted the virtual cloud network to include a new ingress rule for allowing HTTP traffic, and updated the DNS records on Cloudflare to point to my new VPS.

After testing it out, I was extremely satisfied by the significant performance increase and have been happy to find that the stability issues have been completely resolved.

This is the pagespeed.web.dev analysis on miketekken.com/blog/latest-post.html that points to my home server.

This is the analysis on miketekin.dev/blog/latest-post.html that points to my server on Oracle Cloud.

Both servers are running Ubuntu, serving the site with Nginx, and using the same GitHub repository.

Creating custom HTML elements for the header and footer:

Initially, with just a couple of pages, I had the header and footer code directly on each page. At first, with just a couple of pages, this was fine. But as I add more pages, this becomes more cumbersome. I wanted to implement a better solution now while I still only have a few pages to manage.

When looking for a solution, initially, every answer I found suggested using express or some other framework. But I still want to avoid taking on additional tools, frameworks, and dependencies until they would make a large improvement in the project. I found I could use custom HTML elements and javascript callbacks to import repeated HTML elements like the header and footer, and this was perfect for my needs.

You can view my site's GitHub repo here. And you can view my ansible playbooks here.

What I'm considering working on next:

  • Setting up a CI/CD pipeline to cut a few steps out of my deployment process

  • Setting up automatic updates on my VPS

  • Some kind of project that uses SQL databases

Have any questions or suggestions for me? Let me know! :)