Blog

Notes and tutorials about web development — React, Next.js, testing, automation and the occasional hard-won error fix — written from my day-to-day work as a software architect.

• Continuous Integration with Github Actions workflow

  2023-05-09

  Continuous integration and continuous deployment with using the github workflow actions in a nextjs project and deploying to vercel

• Filter for positions, survey to check compatibility

  2023-03-07

  Survey for recruiters to find out if I am compatible with a specific job position

• Dark theme with Nextjs

  2023-02-03

  One way to implement a dark theme with Nextjs is to use the CSS variables and once hooked to the theme change event, change the value of the variables.

• Lighthouse report automation

  2023-01-24

  Automation of Lighthouse reporting using playwright and the lightouse api on a deployed website in a real example

• How document my react components with JSDoc

  2023-01-16

  Automatically create documentation of your react components with jsdoc and publish in your static site

• How translate the slugs in my web pages?

  2023-01-12

  Translate the urls of my website, to have a 100% internationalised site using nextjs and static pages with mdxjs files.

• Counter for github stars repository

  2023-01-11

  This is a simple counter for github stars repository. You can use it in your website or blog. Using Nextjs api and octokit.

• Make a views counter with google analytics

  2023-01-10

  Make a views counter for your blog with google analytics and nextjs api routes. Using BetaAnalyticsDataClient from google analytics data api

• How to fix Minified React error #425 (hydration mismatch)

  2023-01-05

  Uncaught Error: Minified React error visit https://reactjs.org/docs/error-decoder.html?invariant=425 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

• Deploying my storybook is very simple

  2023-01-04

  Deploying React Components with Storybook: An Easy Way to Showcase Your Work. Are you looking for an easy way to showcase your React components and share them with?

• Fix "Failed to replace env in config: $\{NPM_TOKEN}" in npm and yarn

  2023-01-03

  How to avoid losing 2 hours of your life because of an NPM bug, that doesn't let you run yarn or npm commands

• EADDRINUSE: address already in use — how to free the port

  2023-01-02

  Means that the network address and port combination specified in the error message is already in use by another process running on your computer. This can occur when you try to start a server on a port that is already being used by another program.

• How to publish the test coverage report in your React application

  2023-01-01

  In this post we are going to see how to publish the test coverage report in your React application.

About me · Contact