Create a WordPress Theme Using React with Frontity, TypeScript, and Vite

Create a WordPress Theme Using React with Frontity, TypeScript, and Vite

Tiempo de lectura: 2 minutos Today we are going to learn how to create a WordPress theme using React, TypeScript, and Frontity. Additionally, we will add Vite underneath, which will allow us to deploy our app faster. Frontity is the framework that allows you to connect your React application with WordPress, leveraging its REST API or GraphQL to fetch and … Read more

What is SEO? Strategies and Tactics to Improve Your Search Engine Ranking

What is SEO? Strategies and Tactics to Improve Your Search Engine Ranking

Tiempo de lectura: 2 minutos In the competitive digital world, SEO (Search Engine Optimization) has become a crucial factor for online success. Improving your search engine ranking not only increases your website’s visibility but also attracts high-quality traffic. In this article, we will explore various strategies and tactics you can implement to optimize your online presence and master the game … Read more

Folder Permissions for WordPress Installation

Folder Permissions for WordPress Installation

Tiempo de lectura: 2 minutos Today we are going to indicate the necessary permissions in a WordPress installation with Apache. To ensure the security and proper functioning of your WordPress site within a Docker container, it is important to set the correct permissions on the web directory (www). Here is a general recommendation on how you could set the permissions: … Read more

Redirect PHP errors to Docker console or Linux console

Redirect PHP errors to Docker console or Linux console

Tiempo de lectura: < 1 minuto Today we’re going to learn how to create a handler to redirect PHP errors to the Linux or Docker console. The first thing we need to do is to create a handler, we can call it exception_handler.php. And let’s add the following: <?php function handleException($exception) { // Get information about the exception $message = ‘ERR: … Read more

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 import React from ‘react’; import YouTube, { YouTubeProps } … 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! 1. Wave Evaluation Tool Wave is one of my favorites. It’s a … Read more

Web Accessibility and WCAG Standards, Accessibility Levels

Web Accessibility and WCAG Standards, Accessibility Levels

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

Setting up ESLint for React or React Native project with JavaScript or TypeScript

Setting up ESLint for React or React Native project with JavaScript or TypeScript

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

Nginx Container for React with Docker Compose

Nginx Container for React with Docker Compose

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

Fixing route error when refreshing with F5 in React (react-router-dom) using nginx

Fixing route error when refreshing with F5 in React (react-router-dom) using nginx

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