hit counter

Building a WordPress Site with Twig and Laravel Mix

Posted on June 28th, 2018.

Recently, I redesigned my technology blog Iamlittle Tech. It had been due a rebuild for quite a while.

Usually when you build a WordPress theme, you have to write a whole load of strange PHP stuff. I mean what is this?

I tell you what that is, it's what you need in order to display the latest posts using WordPress php. It's not very pretty.

Instead of using WordPress' yukky templating system, I decided to look for other options. My first idea was to utilise the WP REST API and create a Vue frontend for the site, however I ran into a few issues with that, one of those is SEO and because the site is on shared hosting and will be for the forseable future we can't run Node for server side rendereing. Once I had realised that Vue really wasen't a valid option, I found Timber. Timber is a port of Twig for WordPress. I tried it out for five minutes and I was instantly suprised at how well it worked. I ended up using Twig/Timber.

You can install Timber in two ways. I would recommend using the WordPress plugin for Timber but using Composer is also an option. If you are going to use Composer you'll need to do composer require timber/timber.

Also when you are getting started I recommend you download the starter theme from GitHub and work from that.

In the site rebuild, I used SCSS for the styles. I was using SCSS on the previous site and I was compiling my code using Scout but for this I wanted to use something different. I thought that I could make use of Laravel Mix on the project because I'm am slowly starting to use it more and more on some of my other sites. The setup process was fairly painless. I followed through the tutorial by Eric Barnes.

I feel really proud of what I have created and the stack that I am using to create it. I would appreciate it if you would comment on it's design.