Tiempo de lectura: 2 minutosWe will create a dynamic theme system with CSS variables to create a dark, normal or branded theme. We define the structure of variables at :root.No use hardcoded colors in components. Only use semantic variables. :root { /* Color scheme */ –color-bg: #ffffff; –color-surface: #f5f5f5; –color-primary: #1976d2; –color-text: #222222; –color-text-muted: #666666; /* Borders */ –radius-md: … Read more
Tiempo de lectura: 2 minutosIf I had to start programming from scratch without prior knowledge but with all the knowledge I gained after working on technology for years, I would change many things compared to how I started. I wouldn’t do it because the traditional path is bad, but because the industry has changed a lot. Today there are … Read more
Tiempo de lectura: < 1 minutoThe web performance is a critical factor for any modern application, especially when we talk about large apps with many features, concurrent users and real-time data. A slow site not only affects the user experience, but also impacts retention, conversions and SEO positioning. < p Next, we present practical tips for optimizing large web applications … Read more
Tiempo de lectura: < 1 minutoGood morning, today I show you a brief example of how it would be: By default, as we already know, this returns bullets. If instead of bullets we want it to return numbers, without being a numbered list, our CSS should be as follows: This CSS code is used to number the elements of an … Read more
Tiempo de lectura: < 1 minutoWe will learn today how to transform an Android XML vector into a vector in SVG format using the command line. With the vector in SVG, we can use it both in React, Flutter or Web. First, we will install this library (if we want to use the web version): npm install -g vector-drawable-to-svg Once … 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: < 1 minutoGood morning, today I show you a brief example of how it would be: <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <link rel=”stylesheet” href=”styles.css”> <title>Numbered List</title> </head> <body> <ul class=”numbered-list”> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> </body> </html> By default, as we already know, this returns bullets. If … 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
