JavaScript

Encuentra guías y ejemplos para dominar JavaScript, un lenguaje esencial para la creación de interactividad y dinamismo en sitios web y aplicaciones.

• javascript
• herramientas
• typescript
• html
• json

Formato de código con Prettier

Prettier permite mantener el código formateado y legible para todos los desarrolladores de un proyecto.

• javascript

Tree shaking en JavaScript

Tree shaking es un término usado para describir la eliminación de código muerto en aplicaciones JavaScript.

• javascript

Inyección de dependencias en JavaScript

Cómo desacoplar lógica del código usando lo que se conoce como inyección de dependencias.

• javascript
• node

Importar librerías dinámicamente en JavaScript

Cómo importar librerías dinámicamente en JavaScript y Node.js

• javascript
• astro
• node

Depurar aplicaciones Astro SSR

Depurar aplicaciones Astro con Visual Studio Code añadiendo breakpoints en el lado del servidor SSR.

• javascript
• typescript
• herramientas
• test

Informes de cobertura con Vitest

Genera informes de cobertura de código utilizando Vitest en proyectos JavaScript o TypeScript.

• javascript
• astro

Astro middleware

Qué es y cómo funciona un middleware en Astro.

• javascript
• herramientas

Yalc: trabaja con paquetes locales como un profesional

Prueba y desarrolla paquetes npm o yarn localmente antes de publicarlos con Yalc.

• javascript

Proxies en JavaScript

Cómo los Proxies en JavaScript nos permiten interceptar y personalizar el comportamiento de los objetos.

• javascript

Efecto visual de confeti

Canvas confeti es una librería para generar annimaciones altamente optimizadas de confeti en el navegador.

• html
• javascript
• simulacion

Simulación de una cola en JavaScript

Implementación y simulación de una cola en JavaScript utilizando el elemento canvas.

• javascript
• rendimiento

Interaction to Next Paint (INP)

Métrica de Core Web Vitals que mide la capacidad de respuesta de una página a la interacción del usuario.

• npm
• javascript
• node

Solventar conflictos en el archivo package-lock.json

Cómo resolver conflictos en el archiivo de control de dependencias en un proyecto JavaScript con npm.

• html
• javascript
• css

Control deslizante de comparación de imágenes

Implementar un comparador de imágenes deslizante usando HTML, CSS y JavaScript, ideal para mostrar diferencias entre dos imágenes superpuestas.

• javascript
• astro

Diferencias entre client load y client only en Astro

Cómo y cuándo cargar componentes en el navegador sin afectar el rendimiento con Astro.

• javascript
• css

Crea una barra de progresión para indicar el porcentaje de scroll de una página

Cómo crear una barra en la parte superior de la web que indique el porcentaje de scroll avanzado en una página.

• npm
• node
• javascript

Conectar paquetes locales durante el desarrollo con npm link

A veces puede ser útil probar paquetes npm sin tener que publicarlos, con este comando podemos hacerlo fácilmente.

• javascript

Introducción a Preact

Preact es una biblioteca de JavaScript y es una alternativa ligera a React, mantiene una API similar y mejora el rendimiento en ciertas situaciones.

• javascript

Simulación de un tiro balístico parabólico

Explicación de una simulación interactiva de un tiro parabólico usando HTML y JavaScript con cálculos físicos para visualizar la trayectoria de un proyectil.

• javascript

Gestión de eventos en JavaScript

Uso del patrón de diseño Card con HTML y CSS adaptable.