Ulzurrun de Asanza i Sàez

How to write WordPress Themes with SASS, TypeScript, and HMR

Not interested in all the details? I shared a twentytwenty child theme with SASS, TypeScript, and HMR applying all the ideas in this post that you can use as a starting point.

Modern front-end developer experience is nicer than the one we had in 2007 when WordPress came out.

Regular WordPress themes require reloading the entire page when any JavaScript or CSS changes. However, with tools like Vite we can achieve a state-of-the-art developer experience.

In this post I will guide you through all the steps required to add SASS, TypeScript, and HMR support to any WordPress theme.

A Twenty Twenty child theme with SASS stylesheet and HMR, and early preview of what we will achieve by the end of the post.
Read more →

Structured JSON logging in AWS Lambda with Kotlin and Log4j2

JVM ecosystem has a steep learning curve: missing a Maven/Gradle dependency might end up being a cryptic runtime exception about a package that is partially referenced in an XML file. I experienced this recently at work, trying to set up Log4j2 to write JSON logs in an AWS Lambda function.

Read more →

How to make Docker build faster reducing build context size

When you build a Docker image you will notice a “transferring context” step in the output (“Sending build context to Docker daemon” in older Docker versions) that can take a lot of time. This step is just Docker copying local files so keeping those to the minimum will make this step faster.

Read more →

Throttle and debounce visualized

throttle and debounce are two functions widely used in frontend applications but they are confusing and oftentimes used interchangeably even though they are not the same thing. In this article we’ll review both and clarify their differences (or go directly to the interactive demo showcasing the differences).

Read more →

How to reduce Docker images size

It’s easy to make Docker images bigger than needed. This has a negative impact in both push and pull time but it may also be hiding additional problems you should address before they become critical.

In this post I will explain you three techniques to help you slim down your Docker images:

Read more →

Geoblink Design System

There are days when you know you are working on something amazing. You would love to share it with the world, but cannot. I felt that every single day at the office for months, knowing that someday – eventually – I would be able to share this project. Finally – today – Geoblink’s Design System has been open sourced (GitHub repository).

Geoblink’s Design System is open source.

Read more →

Validate Jenkinfiles in VSCode

Jenkins pipelines are cool but writing Jenkinsfiles is a frustrating experience, especially if you are not familiar with Groovy. Testing them can be tedious, too. And to add insult to injury, editor support is not quite good.

However, there are ways to make Jenkinsfile development less painful. One quality of life improvement is being able to validate a Jenkinsfile while developing it, directly in VSCode.

To add linter-like support for Jenkinsfiles in VSCode, take a look at Jenkins Pipeline Linter Connector extension (view).

Read more →

Peach Maps – Searchable Apple Maps on your browser before official API is released

Two days ago I found out that Apple website featured an Apple Maps map to show this year’s WWDC location so I checked out its API and built a quick demo which allows you to search addresses and display them on Apple Maps: Peach Maps ? (source code).

I added a search form which uses OpenStreetMap to get the results. The project only uses static files so it can be easily hosted on any server.

Introducing… MawKit

Recently I’ve released two iOS games (with Javier Rodríguez Vidal‘s and Víctor Grau Moreso‘s help). Both games use Cocos2d-x engine and a custom open source framework built on top of it named MawKit which I want to introduce in this post.

Read more →

Fixing Cocos2d-x glitches with pixel art games

While developing Hop Raider we found a rare glitch in floor’s tiles: sometimes they had an additional semi-transparent border line which was not supposed to be there. We discovered that some sprites were taking a bigger bounding box than they were supposed to, so when a sprite was drawn an additional line taken from adjacent sprites in the spritesheet was also drawn.

If you look carefully (or not so carefully) to the rock base floor in Hop Raider 1.2.1 or older you can see this glitch. It happens in lava tiles too. And this glitch is iOS/Android-independent. This usually happens in rock base floor, lava and sometimes in right-side dirt floors.

As it was somehow random (and actually it didn’t impact in gameplay and didn’t break overall game experience) we didn’t prioritise fixing this glitch but today I have been able to fix it and wanted to share both, the reason of and the solution to the problem.

Read more →