Full Stack Laravel/ PHP Developer

Red Banner Media

My Web Agency's Website advertising my services

Written By:Roberto Rivera

This wasn't just an opportunity to advertise my website services, but to speak to a community of businesses. I first built the website using Laravel, only later adding Statamic as a secondary option. I also took this opportunity to work with HTMX. In many ways, this is my playground.

I added Statamic later, which meant that the site was built with Blade, Tailwind, AlpineJS, and HTMX. I wanted to see what performance bumps I could get by using HTMX as a lazy loader. The elements that are above the hold do not contain HTMX. Meanwhile, the elements below that are all loaded after the user starts scrolling down. Being that this was one page I thought that would be enough. However I quickly ran into an issue as most of the navigation leads to anchor tags on different parts of the same page. This meant that without the scroll, the section of the page wouldn't load. I fixed this behavior by leveraging AlpineJS. I added a helper function to the parent element for the page and now it loads the element if someone is navigating directly there via a link.

HTMX was interesting to leverage, while it did increase the speed, there was some overhead that wasn't immediately intuitive. It requires certain considerations beforehand, and isn't neccessarily fit for every client, but I'm excited to keep pushing the capabilities.

After awhile, I determined that it would help my SEO if I at least published case studies on the clients that I have worked for. While Laravel provides me the ability to create a blog, I decided to see what it would be like to simply add Statamic to a Laravel project. Turns out it was fair easier than I thought. I simply did a composer require on Statamic, exposed a blog route, then treated that route as it's own blog. While I love creating things to expand knowledge, I didn't really have the time to fully flesh out a blog, that and it allowed me to test some of the marketing behind Statamic.