Tiempo de lectura: 2 minutosJSON (JavaScript Object Notation) is a lightweight data exchange format widely used in APIs, storage, and communication between systems. Its simplicity makes it very powerful, but it’s essential to know the types of data it supports to avoid errors. JSON defines six main data types: Represents text and should always be between double quotes. { … Read more
Tiempo de lectura: 2 minutosYou will learn about the state in React when you start working with it. The state is one of the most important concepts to learn. It allows components to be dynamic, interactive and able to respond to user actions. You will learn about the state, what it is for and how to use it correctly … Read more
Tiempo de lectura: < 1 minutoWe will share a Fix that can help you solve problems with automatic URLs added by Shopify in your footer. In this case, it’s about the link to Cookies policy. Since the theme I installed won’t let me modify this content and automatically adds a link with this format: web/policies/#shopifyReshowConsentBanner To solve it, you need … Read more
Tiempo de lectura: 2 minutosToday we are going to learn how we can integrate tests with Jest that allow us to test the React components created. The first thing we have to do is install Jest: npm install –save-dev jest Install testing-library/jest-dom: npm install –save-dev @testing-library/jest-dom We installed ts-jest npm install –save-dev ts-jest We installed: npm install –save-dev babel-jest … Read more
Tiempo de lectura: < 1 minutoA few weeks ago, I updated a PHP website to Next.js with React, and to my surprise, when I loaded the page, it displayed the PHP version without loading the previous resources correctly because they did not exist. To solve this issue, we can try loading a file that was included in the previous website … Read more
Tiempo de lectura: 2 minutosToday we’re going to see how we can communicate a web created with React with an iFrame or frame in React or HTML with JavaScript. Loading the Frame We create an iframe: <iframe src={urlCargar} style={{ width: ‘100%’, height: ‘500px’ }} /> In urlCargar we put the URL of the web from which we want to … Read more
Tiempo de lectura: 2 minutosPhoto by Pixabay In this example, we’ll see how to dynamically generate options for a select element in HTML using JSON data and JavaScript. First, let’s display the array of elements we’ll use as an example: const jsonData = [ { id: 1, name: “NameDevCodelight1” }, { id: 2, name: “NameDevCodelight2” }, { id: 3, … Read more
Tiempo de lectura: 2 minutosPhoto by James Wheeler In this example, I’m going to show a basic structure for making a POST type AJAX request with jQuery in JavaScript. First, we define the parameters of the AJAX request. Here, we set the URL to which we’ll send the request, the type of request which will be POST, and the … Read more
Tiempo de lectura: 2 minutosPhoto by Yaqui Zanni In this example, I’m going to show a basic structure for making a GET type AJAX request with jQuery in JavaScript. First, we define the parameters of the AJAX request. Here, we set the URL to which we’ll send the request, the type of request which will be GET, and the … Read more
Tiempo de lectura: 2 minutosTo create a horizontal menu with different options that change content based on the selected option, follow these steps. First, create an unordered list (<ul>) representing your menu and give it some styles to remove bullets and set a dark background. Each list item (<li>) represents a menu option and is floated left (float: left) … Read more
