Hello 👋

I'm Alejandro

A Web Engineer from Málaga, Spain based in London, UK

Posts about "Javascript"

React Testing Setup

Testing your code is like having a lifesaver, everyone should have one. Here, I'm going to set up an environment of safety, one that will you the confidence you need to ship your React code in the best shape possible. Let's assume you…
Read →

Mocking HTTP requests with Mock Service Worker

There is a lot of talk these days about if when you are testing your API integration you should be mocking your client (fetch/axios...etc.) or not. To answer your question, we want our tests to be as reliable as possible, so if they work…
Read →

Understanding NPM Scripts

Have you ever thought about creating your own command line tool? Well, here is your chance to create one for your project. What are NPM Scripts? NPM scripts is a simple solution to automate any repetitive tasks. For example, building your…
Read →

Mocking a Server Error with cypress

When doing cypress end-to-end tests, it is very tempting to only be testing the happy path most of the time. The happy path, is the one we think users will follow , the ideal journey that will take a user from state A to B. But users…
Read →

Tracking custom events with Google Analytics

Google Analytics is the "to go" tool everytime we want to be aware of how many users are browsing our websites today. It's just what we are used to use, and it does its job pretty well. Analytics will show you tons of good metrics like page…
Read →

Avoiding complexity with Compound Components

Over the years, the way we consume and create our React Components have changed considerably. I'm pretty sure, at some point this thought got on your mind when creating a component. I'm going to create this generic component that we will…
Read →

Use media queries with React hooks

Using media queries with React is pretty easy nowadays. There are a lot of solutions out there, but the most popular one is react-media by the ReactTraining people. But today everyone wants to use hooks, so I'm going to show you how to…
Read →

How to break the rules, with conditional hooks

If you have been working with hooks for a while now, you probably know there are some rules around it. One of them is, hooks cannot be conditional or called inside loops, neither inside nested functions. They need to be on the top level…
Read →

Route to Next.js

Tell me this never happen. You have a new idea of project, and then you start coding straight away. You need all sorts of things, Server Side Rendering because you want Google to pick up your content. Also, you want it to be fast, so you…
Read →

useEffect and useLayoutEffect

From React's 16.8 release, there has been quite a change in the way we use to write React components. In this version, the React team introduced Hooks , allowing you to share your component logic and not write a single class anymore…
Read →

Code splitting

We live in a world where there are plenty of devices. They have different sizes, memory, cpu or even screen resolutions. Some are faster than others. But they all have something in common, they want to access the web and they want to do…
Read →

Understanding Optional Chaining

Great News! Optional Chaining is a thing! But... are you ready for it? Do you know what does it mean? Do you know how to use it? If that's a no, hopefully, at the end of this post, you will perfectly know how to answer all these questions…
Read →

React performance with CSS

There are a lot of different ways to do CSS with React, and the library itself is not opinionated on how you do so, instead, it’s you, the developer, who decides what to use. Reality is, that if you look for “Stying a React App” in google…
Read →

Intersection Observer in action

Intersection Observer? Whaaat!? That sounds scary! In this post I want to explain my journey through and use case for using Intersection Observer. I will also give you a brief overview of how you can get started. As the specification says…
Read →