Tiempo de lectura: < 1 minuto Today we’re going to learn how we can add a YouTube video in React. The first thing we need to do is to add this dependency: npm install react-youtube –save Once installed, let’s create the component responsible for opening the YouTube video. We’ll call it YoutubePlayer.tsx import React from ‘react’; import YouTube, { YouTubeProps } … Read more
Tiempo de lectura: 3 minutos Web accessibility is crucial to ensuring that everyone, regardless of their abilities, can fully enjoy the online experience. Fortunately, there are several tools and browser extensions that can help you assess and improve the accessibility of your website. Let’s explore some of them! 1. Wave Evaluation Tool Wave is one of my favorites. It’s a … Read more
Tiempo de lectura: 3 minutos The web is a vast and diverse place, filled with information and opportunities. However, for many people with disabilities, navigating the web can be like trying to open a locked door. That’s why web accessibility is crucial. Let’s dive into the world of web accessibility and discover how the WCAG guidelines can unlock the web … Read more
Tiempo de lectura: 2 minutos Today we are going to learn how we can set up ESLint for a project that uses React and React Native with JavaScript or TypeScript. This will allow us to recognize errors that appear in our code and configure the type of error we want. First of all, we need to install ESLint: npm install … Read more
Tiempo de lectura: 2 minutos Today I’m going to share a container setup for React based on Nginx. To do this, we are going to create this docker-compose.yml version: ‘3.1’ services: nginx_frailstop: build: . container_name: nginx_frailstop restart: unless-stopped ports: – “80:80” – “443:443” volumes: – ./dist:/usr/share/nginx/html – ./config/nginx/cache/:/var/cache/nginx/ – ./config/nginx/sites/:/etc/nginx/sites-enabled/ – ./config/nginx/config/nginx.conf:/etc/nginx/nginx.conf Now we are going to create our Dockerfile … Read more
Tiempo de lectura: < 1 minuto Today I share a solution to properly configure the nginx.conf file to make it compatible with react-router-dom route management. To solve the error, we need to add the line try_files $uri $uri/ /index.html; inside the nginx.conf file http{ … server { listen 80; server_name localhost; location / { root /usr/share/nginx/html; index index.html index.htm; try_files $uri … Read more
Tiempo de lectura: < 1 minuto Today we are going to learn how we can generate a development build with React Vite. This will generate the dist folder with development configuration. To do this, we need to go to the package.json file and add this command inside «scripts»: { “scripts”: { … “build-dev”: “tsc && vite build –mode development”, … } … Read more
Tiempo de lectura: < 1 minuto Today we’re going to learn how we can install Docker and Docker Compose on Debian very quickly. First, we add the Debian repository keys. # Add Docker’s official GPG key: sudo apt-get update sudo apt-get install ca-certificates curl sudo install -m 0755 -d /etc/apt/keyrings sudo curl -fsSL https://download.docker.com/linux/debian/gpg -o /etc/apt/keyrings/docker.asc sudo chmod a+r /etc/apt/keyrings/docker.asc # … Read more
Tiempo de lectura: 3 minutos The term “Model-View-ViewModel” (MVVM) is a software architecture pattern commonly used in the development of software applications, especially in user interface applications such as web and mobile apps. MVVM is a variant of the Model-View-Controller (MVC) pattern and focuses on separating the presentation logic from the business logic of an application. In MVVM, the three … Read more
Tiempo de lectura: 4 minutos The Model-View-Controller (MVC) is a software architecture pattern commonly used in the development of software applications, especially in web and desktop applications. This pattern is based on the principle of separation of concerns, which means dividing an application into three main components: Model, View, and Controller, each with specific responsibilities. Model: The Model represents the … Read more
