Adding YouTube Video in React

Adding YouTube Video in React

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 You can customize the options by adding playerVars: reference. … Read more

Best tools to measure web accessibility

Best tools to measure web accessibility

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! Wave is one of my favorites. It’s a web accessibility assessment tool … Read more

Web Accessibility and WCAG Standards, Accessibility Levels

Web Accessibility and WCAG Standards, Accessibility Levels

Tiempo de lectura: 2 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

Nginx Container for React with Docker Compose

Nginx Container for React with Docker Compose

Tiempo de lectura: < 1 minuto 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 Now we are going to create our Dockerfile Finally, we will create the necessary folders: The nginx.conf file must contain: Remember that the React distribution folder generated with Vite is inside dist, … Read more

Create Development Build with React Vite

Create Development Build with React Vite

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”: { Returns only the HTML translated, without any additions. npm build-dev This way … Read more

Installing Docker and Docker Compose on Debian in Minutes

Installing Docker and Docker Compose on Debian in Minutes

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. Now we install the latest version of Docker sudo apt-get install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin Run Docker sudo docker run hello-world We can configure so that we don’t need to … Read more

Software Engineering: Model-View-ViewModel (MVVM)

Software Engineering: Model-View-ViewModel (MVVM)

Tiempo de lectura: < 1 minuto 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

Software Engineering: Object-Oriented Software Architecture

Software Engineering: Object-Oriented Software Architecture

Tiempo de lectura: < 1 minuto Object-oriented software architecture focuses on designing and organizing software systems using principles and concepts of object-oriented programming. Unlike traditional architecture based on components or layers, object-oriented architecture is based on the idea of building systems as a collection of interconnected objects that collaborate to achieve the system’s goals. By applying object-oriented design principles and using … Read more

Implementing Vitest in a React Environment with Vite for Unit Tests

Implementing Vitest in a React Environment with Vite for Unit Tests

Tiempo de lectura: 2 minutos Today we are going to learn how we can install Vitest in a React environment with Vite. First, we will install Vitest: npm install -D vitest After we will install the necessary libraries: npm install vitest @testing-library/react @testing-library/jest-dom –save-dev Now let’s create the directory structure for the tests, outside our src folder: And within components, … Read more