How I built my blog in 2024
August 24, 2024
As every developer knows, every 2 to 3 days we have to reinvent our personal sites with the latest JS framework and features. It's sort of a running joke that every developer (maybe just me) eventually builds their own CMS, overcomplicates it to some degree, and eventually abandons it, only to refurbish it months down the line when they have a new article idea.
That is exactly what I did.
My previous personal site was in two parts. A frontend built in Astro, and a "CMS" built with Adonis v5. It worked well for a while, but eventually I started to dislike the editor I had built for myself as it lacked a lot of options for formatting and layout.
After abandoning the site for several months (I had tried to do an article per week this year), and learning Laravel during that time (another article on this coming soon), I decided it was about time to blow off the dust and refurbish my blog. So here's how I did it and what I used.
The Stack
This probably comes as a surprised to no one, but I went with the TALL stack for this blog. That is: Tailwind, Alphine, Laravel and Livewire. No decoupled frontend and backend, just one monolith that I push to Github and Forge auto-deploys.
I started with Laravel's Jetstream starter kit that includes Auth and a few other handy features included, moved my existing website design over and improved some of the layout.
Canvas
Next, I hoped when I set out to build in Laravel that an existing CMS-style package would already exist and it did: Canvas
Canvas is a simple blogging package with all that I needed to just focus on writing and nothing else.
Features:
- A simple editor
- File uploads
- Drafts & Scheduled Posts
- SEO optimizations
I installed it and got it working with Laravel's Auth system, then created a page view (the one you're reading this article on now) and added some custom CSS for styling.
P.S if you check the HTML for this div, you'll see the "blog" class which adds all the custom css
Hosting
For hosting, I went with Laravel's Forge after a few unsuccessful tries with Coolify. Forge was a walk in the park to connect a Server, a Github repo and deploy to production; I got the entire site running in about 20 minutes of work.
That's it for this article, and hopefully there'll be many more after this!
Thanks for reading 😎
Later update: I recently switched to Filament over Canvas!