How I Built This Site
May 6, 2025
I've been using a modified version of Bootstrap’s “Cover” example as my website for a number of years because of its simplicity and elegance.
I needed to make a change because my site was just being used as a glorified landing site and didn’t contain any actual content to speak of.
I wanted to add some form of blog wasn’t sure where to start, I’d looked into statically generated sites in the past but wasn’t sure if that was the right direction.
I know that some are adverse to the use of AI, but I have found it very helpful for prototyping purposes.
So I enlisted the help of my friend ChatGPT using the ChatGPT-4o model and now...
My updated site is still using a static Bootstrap layout but now it has some fancy social media navigation links using svg icons and also client-side Markdown rendering using marked.js.
A sprinkle of vanilla javascript + marked.js is the special sauce that now makes the blog portion of my website go!
It’s really handy to be able to create blog posts in Markdown format, it really streamlines the process!
Update - May 7, 2025
Upon posting my website URL into Twitter I realized that hadn’t added “Open Graph Meta Tags” and "Twitter Card Tags”...
Without these I wasn’t getting the fancy website description/thumbnails for social media posts 🤦♂️
Thankfully this is now remedied! 😅
Update - May 8, 2025
Yeaaah sooo implementing “Open Graph Meta Tags” and "Twitter Card Tags” functionality for blog posts wasn’t so simple...
Hilariously I broke the blog functionality pretty bad last night trying to implement them, and then learned that Twitter doesn't follow javascript when scraping URLs, so now the blog functionality is no longer written in javascript...
So introducing the new Dubs Domain 2.0 which now works again for reals...
Tech Used
- PHP for server side scripting to allow dynamic rendering of blog posts
- Bootstrap 5.3 to make my site responsive and mobile friendly
- Parsedown for Markdown Parsing
- Symfony YAML for reading a block of metadata at the beginning of each markdown file that is passed into the Open Graph Tags and Twitter Card Tags metadata
- Composer for handling all of the dependencies necessary for Parsedown and Symfony YAML
- A fancy ".htaccess” script that translates "/templates/post-template.php?slug=postname” URLs to “/posts/postname” URLs
So glad this actually works now! 👽