In an app that I’ve recently worked on, I had to interact with 2 different APIs: a typical JSON-based API from a django project, as well as a “real-time API” which was coming directly from Firebase. That meant that, when reading data, I had to sometimes read them from Firebase and sometimes from another JSON API.

I wanted used react-query for my remote data management needs, while also using the Firebase web client (as recommended) for all-things-firebase. While there’s nothing wrong with that, it felt a bit cumbersome to have two (2) different ways of querying and storing data. …

In this article I’m going to present to you a way of handling your API errors once and for all in a centralized and easily extendable way, regardless of the state-management library (Redux, Apollo, etc.) that you are using.

Almost every modern app interacts with an API for their data requirements; be it a RESTful API or a GraphQL one, firing requests on the web is the bread and butter of the majority of apps out there. Most of the times things go well and your request is returns successfully, but there are times when things don’t go as smoothly…

I recently had to implement a multi-language static website, so I thought Gatsby would be a fun choice; surely people have a lot of guides out there on how to do it. Turns out, implementing it the naive way is easy, but if you want to minify manual work and streamline translations through automated processes, things can get hard. In this article, I’ll be attempting to showcase the problems that I’ve faced, the solutions that I ended up using and the benefits of each approach.

Intro

Initially, internalization might seem like an easy task. You get a request, you check which…

In this article I’ll attempt to share a few tips & optimization tricks that you should consider when aiming to minimize the footprint of your React app. I’m confident that after reading this article you will be able to reduce your bundle size by at least 5–10%, since I’ll start with conventional tips and move on to edge-case micro-optimizations. I also want to point out that most of the things that I’ll go through are not React specific, but apply to all JS apps that are built using Webpack.

Why should I care?

If you’ re wondering that, then the sooner your JS reaches…

Do you have a designer in your team? Well, I do and he’s a grumpy one, let’s call him Jim. People normally go to Jim for all sorts of things; to let him know that they preferred the design they saw in another website, to complain about a particular interface he implemented or to simply ask him to resize an image in certain dimensions. Designers get all sorts of weird requests and all that Jim wants deep down inside, is what most developers also crave for; to be left alone to do his job.

Luckily for Jim, Gatsby ships with…

Intro

At first, these two (2) terms mind sound irrelevant to one another. After all UX (User Experience) is a different specialty and can’t be directly related to engineering, or can it? You see, engineers tend to view UX as an external study that decides the way the elements are positioned in a screen & the flow that the users have to go through before they reaches their goal. While this is absolutely true, that’s only part of an equation that sometimes we engineers tend to forget: to provide the best experience for the users that are visiting our platform. Thus…

Sounds promising? Hopefully it will be! In this article I’ll attempt to demystify all you’ll need to know when developing a Chrome Extension. I’m positive that after reading this article, you’ll be able to easily develop your own extension without too much trouble. There are a lot of things to cover, so let’s get dig straight in.

Basic Concepts

When we think of an extension (also named plugin), we sometimes think about an icon in the top right corner of Google Chrome’s toolbar. Most of you might remember that when you click this icon, a nice popup usually appears. In reality that’s…

Amplify is perhaps one of the best libraries out there to create your application prototype. As things scale though, you find yourself in need of its modules in multiple places and as a result you directly import them in most of your components. At the same time, there is an interesting shift in the way React developers structure their code. With the introduction of hooks, core concepts like splitting your components into presentational & container are losing ground, while a more holistic approach begins to take over, where the container & presentational parts are integrated into one single entity.

This…