From 29b85513e42e8be24181d70d5f6ce04ea7ce1696 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Charly=20Chac=C3=B3n?=
<107764250+Charlytoc@users.noreply.github.com>
Date: Mon, 29 Apr 2024 10:41:54 -0500
Subject: [PATCH 1/4] Update README.md
---
exercises/00-welcome/README.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/exercises/00-welcome/README.md b/exercises/00-welcome/README.md
index 9d13409b..ccad0074 100644
--- a/exercises/00-welcome/README.md
+++ b/exercises/00-welcome/README.md
@@ -1,5 +1,5 @@
---
-intro: "https://www.youtube.com/watch?v=yRjmuLAH25s"
+intro: "https://www.youtube.com/watch?v=46c5XPAEFzU"
---
# Welcome!
From caf68eda5461bbba59937d369d744dfbe0904aa3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Charly=20Chac=C3=B3n?=
<107764250+Charlytoc@users.noreply.github.com>
Date: Mon, 29 Apr 2024 16:24:11 +0000
Subject: [PATCH 2/4] Add videos in both languages
---
exercises/00-welcome/README.es.md | 4 ++++
exercises/01-hello-world/README.es.md | 4 ++++
exercises/01-hello-world/README.md | 2 +-
exercises/01.1-hello-jsx/README.es.md | 4 ++++
exercises/01.1-hello-jsx/README.md | 2 +-
exercises/01.2-rendering-from-objects/README.es.md | 4 ++++
exercises/01.2-rendering-from-objects/README.md | 2 +-
exercises/01.3-building-a-layout/README.es.md | 4 ++++
exercises/01.3-building-a-layout/README.md | 2 +-
exercises/01.4-building-html-from-arrays/README.es.md | 4 ++++
exercises/01.4-building-html-from-arrays/README.md | 2 +-
exercises/02-maping-array-to-li/README.es.md | 4 ++++
exercises/02-maping-array-to-li/README.md | 2 +-
exercises/02.1-maping-array-objects-to-li/README.es.md | 5 +++++
exercises/02.1-maping-array-objects-to-li/README.md | 2 +-
exercises/02.2-maping-array-of-objects-to-li/README.es.md | 5 +++++
exercises/02.2-maping-array-of-objects-to-li/README.md | 2 +-
exercises/03-render-with-functions/README.es.md | 5 +++++
exercises/03-render-with-functions/README.md | 2 +-
exercises/03.1-your-first-component/README.es.md | 5 +++++
exercises/03.1-your-first-component/README.md | 2 +-
exercises/03.2-a-real-component/README.es.md | 6 ++++++
exercises/03.2-a-real-component/README.md | 2 +-
exercises/03.3-component-properties/README.es.md | 5 +++++
exercises/03.3-component-properties/README.md | 2 +-
exercises/03.4-hero-component/README.es.md | 5 +++++
exercises/03.4-hero-component/README.md | 2 +-
exercises/03.5-alert-component/README.es.md | 5 +++++
exercises/03.5-alert-component/README.md | 2 +-
exercises/04-conditional-rendering/README.es.md | 5 +++++
exercises/04-conditional-rendering/README.md | 2 +-
exercises/04.1-conditional-rendering/README.es.md | 5 +++++
exercises/04.1-conditional-rendering/README.md | 2 +-
exercises/04.2-conditional-rendering/README.es.md | 5 +++++
exercises/04.2-conditional-rendering/README.md | 2 +-
exercises/05-adding-styles/README.es.md | 4 ++++
exercises/05-adding-styles/README.md | 2 +-
exercises/05.1-second-styles/README.es.md | 4 ++++
exercises/05.1-second-styles/README.md | 2 +-
exercises/06-listening-to-events/README.es.md | 4 ++++
exercises/06-listening-to-events/README.md | 2 +-
41 files changed, 116 insertions(+), 20 deletions(-)
diff --git a/exercises/00-welcome/README.es.md b/exercises/00-welcome/README.es.md
index bb513dd8..fff24c31 100644
--- a/exercises/00-welcome/README.es.md
+++ b/exercises/00-welcome/README.es.md
@@ -1,3 +1,7 @@
+---
+intro: "https://youtu.be/watch?v=L21NvjxiVmc"
+---
+
# Welcome!
¡Estamos muy entusiasmados por tenerte aquí! 🎉 😂
diff --git a/exercises/01-hello-world/README.es.md b/exercises/01-hello-world/README.es.md
index 1941b353..f1109f3d 100644
--- a/exercises/01-hello-world/README.es.md
+++ b/exercises/01-hello-world/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://youtu.be/watch?v=FQv38IJJvng"
+---
+
# `01` Hello World
El mayor dolor de cabeza de los desarrolladores front-end es **trabajar con el DOM** para crear HTML dinámico, lo cual es algo que React.js hace mucho mejor.
diff --git a/exercises/01-hello-world/README.md b/exercises/01-hello-world/README.md
index 5f8ba9dc..2b619ae6 100644
--- a/exercises/01-hello-world/README.md
+++ b/exercises/01-hello-world/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=Qdu6GSew8xM"
+tutorial: "https://www.youtube.com/watch?v=YTnv1aPEXWE"
---
# `01` Hello World
diff --git a/exercises/01.1-hello-jsx/README.es.md b/exercises/01.1-hello-jsx/README.es.md
index aad53c19..2a4e3f26 100644
--- a/exercises/01.1-hello-jsx/README.es.md
+++ b/exercises/01.1-hello-jsx/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://youtu.be/9ZYIO78TGb0"
+---
+
# `01.1` Hello JSX
JSX también te permite incluir variables en el HTML fácilmente. Por ejemplo, asumamos que tienes la siguiente variable disponible:
diff --git a/exercises/01.1-hello-jsx/README.md b/exercises/01.1-hello-jsx/README.md
index f4baf324..fd901c63 100644
--- a/exercises/01.1-hello-jsx/README.md
+++ b/exercises/01.1-hello-jsx/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=Wp8hcH8jScQ"
+tutorial: "https://www.youtube.com/watch?v=sNE_3IpQ2Tk"
---
# `01` Hello JSX
diff --git a/exercises/01.2-rendering-from-objects/README.es.md b/exercises/01.2-rendering-from-objects/README.es.md
index 7bc4062e..102321d2 100644
--- a/exercises/01.2-rendering-from-objects/README.es.md
+++ b/exercises/01.2-rendering-from-objects/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=Wnw2DmuZSX0"
+---
+
# `01.2` Rendering from objects
Ahora, vamos a usar una variable más compleja para renderizar nuestro HTML, digamos que tenemos el siguiente Objeto JS con la información de un cliente:
diff --git a/exercises/01.2-rendering-from-objects/README.md b/exercises/01.2-rendering-from-objects/README.md
index a8f19315..a1ec451d 100644
--- a/exercises/01.2-rendering-from-objects/README.md
+++ b/exercises/01.2-rendering-from-objects/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=Z9gzZoYM4pY"
+tutorial: "https://www.youtube.com/watch?v=inPN8MOdJWA"
---
# `01.2` Rendering from objects
diff --git a/exercises/01.3-building-a-layout/README.es.md b/exercises/01.3-building-a-layout/README.es.md
index 6d73766d..0bef0bce 100644
--- a/exercises/01.3-building-a-layout/README.es.md
+++ b/exercises/01.3-building-a-layout/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://youtu.be/Yvu_4qjQEZA"
+---
+
# `01.3` Building a layout
Practiquemos un poco más el uso del JSX para crear HTML.
diff --git a/exercises/01.3-building-a-layout/README.md b/exercises/01.3-building-a-layout/README.md
index 31f4d93d..fb2846d5 100644
--- a/exercises/01.3-building-a-layout/README.md
+++ b/exercises/01.3-building-a-layout/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=5Z12IWd4CI8"
+tutorial: "https://www.youtube.com/watch?v=ZRmtR2Gp-z0"
---
# `01.3` Building a layout
diff --git a/exercises/01.4-building-html-from-arrays/README.es.md b/exercises/01.4-building-html-from-arrays/README.es.md
index 3478c43f..2bb3a107 100644
--- a/exercises/01.4-building-html-from-arrays/README.es.md
+++ b/exercises/01.4-building-html-from-arrays/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://youtu.be/FWk6mHpYeRo"
+---
+
# `01.4` Building from arrays
Con JSX también puedes crear **arrays** de elementos HTML. Por ejemplo, si tenemos un arreglo de `
` podemos incluirlos todos dentro del documento a la vez, así:
diff --git a/exercises/01.4-building-html-from-arrays/README.md b/exercises/01.4-building-html-from-arrays/README.md
index 820ad727..e07863b5 100644
--- a/exercises/01.4-building-html-from-arrays/README.md
+++ b/exercises/01.4-building-html-from-arrays/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=mFPtdyHeKVM"
+tutorial: "https://www.youtube.com/watch?v=s3pv6ZOg6-8"
---
# `01.4` Building from arrays
diff --git a/exercises/02-maping-array-to-li/README.es.md b/exercises/02-maping-array-to-li/README.es.md
index eb82c187..c07848a3 100644
--- a/exercises/02-maping-array-to-li/README.es.md
+++ b/exercises/02-maping-array-to-li/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://youtu.be/hONwtbNOBuc"
+---
+
# `02` Mapping array to ``
Ahora, vamos a construir un arreglo dinámicamente...
diff --git a/exercises/02-maping-array-to-li/README.md b/exercises/02-maping-array-to-li/README.md
index c02f5e4f..9b6a9b90 100644
--- a/exercises/02-maping-array-to-li/README.md
+++ b/exercises/02-maping-array-to-li/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=xe-O1jhnVxk"
+tutorial: "https://www.youtube.com/watch?v=wR18z-IngeA"
---
# `02` Mapping array to ``
diff --git a/exercises/02.1-maping-array-objects-to-li/README.es.md b/exercises/02.1-maping-array-objects-to-li/README.es.md
index dffdc343..1d1eb168 100644
--- a/exercises/02.1-maping-array-objects-to-li/README.es.md
+++ b/exercises/02.1-maping-array-objects-to-li/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/PexVFLiJjE8"
+---
+
+
# `02.1` Mapping array objects to ``
Usando el conocimiento que tienes del ejercicio anterior, ahora corrijamos la función `map()` nuevamente, pero esta vez, partiendo de un arreglo de objetos.
diff --git a/exercises/02.1-maping-array-objects-to-li/README.md b/exercises/02.1-maping-array-objects-to-li/README.md
index f44eabf0..cf0225c2 100644
--- a/exercises/02.1-maping-array-objects-to-li/README.md
+++ b/exercises/02.1-maping-array-objects-to-li/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=Gw6i3BWzwNY"
+tutorial: "https://www.youtube.com/watch?v=f-UPidUUOzg"
---
# `02.1` Mapping array objects to ``
diff --git a/exercises/02.2-maping-array-of-objects-to-li/README.es.md b/exercises/02.2-maping-array-of-objects-to-li/README.es.md
index 99c07e28..084fcb65 100644
--- a/exercises/02.2-maping-array-of-objects-to-li/README.es.md
+++ b/exercises/02.2-maping-array-of-objects-to-li/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/HvQCQW1qgzc"
+---
+
+
# `02.2` Mapping array of objects to ``
Cuando estás mapeando un arreglo de datos para convertirlo en un arreglo HTML, tienes que especificar una **"función de mapeo"** que recibirá cada elemento del arreglo original y lo transformará e insertará en el nuevo arreglo.
diff --git a/exercises/02.2-maping-array-of-objects-to-li/README.md b/exercises/02.2-maping-array-of-objects-to-li/README.md
index 230b8a18..b74ce85b 100644
--- a/exercises/02.2-maping-array-of-objects-to-li/README.md
+++ b/exercises/02.2-maping-array-of-objects-to-li/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=-B0KJP1tzXE"
+tutorial: "https://www.youtube.com/watch?v=BByz7dnodZQ"
---
# `02.2` Mapping array of objects to ``
diff --git a/exercises/03-render-with-functions/README.es.md b/exercises/03-render-with-functions/README.es.md
index 9e916042..98eb6249 100644
--- a/exercises/03-render-with-functions/README.es.md
+++ b/exercises/03-render-with-functions/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/RwT0ltsXPEI"
+---
+
+
# `03` Render with Functions
JSX permite usar funciones para renderizar HTML, ¡y eso es fantástico!
diff --git a/exercises/03-render-with-functions/README.md b/exercises/03-render-with-functions/README.md
index 88305fad..ea4ddcbe 100644
--- a/exercises/03-render-with-functions/README.md
+++ b/exercises/03-render-with-functions/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=EdpPIo_JNVc"
+tutorial: "https://www.youtube.com/watch?v=2jGeHZ97_LU"
---
# `03` Render with Functions
diff --git a/exercises/03.1-your-first-component/README.es.md b/exercises/03.1-your-first-component/README.es.md
index ce149aaa..4d6e06b6 100644
--- a/exercises/03.1-your-first-component/README.es.md
+++ b/exercises/03.1-your-first-component/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/JEQaixuE78Q"
+---
+
+
# `03.1` Your first functional component
Cuando creas funciones que devuelven HTML, JSX te dejará tratarlos como **Componentes**. Básicamente, se convertirán en tus propias etiquetas HTML personalizables.
diff --git a/exercises/03.1-your-first-component/README.md b/exercises/03.1-your-first-component/README.md
index b216ed3b..22c4ad8c 100644
--- a/exercises/03.1-your-first-component/README.md
+++ b/exercises/03.1-your-first-component/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=9Eiidx--_GQ"
+tutorial: "https://www.youtube.com/watch?v=cpq-MqQWMs8"
---
# `03.1` Your first functional component
diff --git a/exercises/03.2-a-real-component/README.es.md b/exercises/03.2-a-real-component/README.es.md
index aeae446a..dbdb74ba 100644
--- a/exercises/03.2-a-real-component/README.es.md
+++ b/exercises/03.2-a-real-component/README.es.md
@@ -1,5 +1,11 @@
+---
+tutorial: "https://youtu.be/iXSBNgZTTFc"
+---
+
+
# `03.2` A real component
+
En el ejercicio anterior hemos creado nuestro primer componente llamado `PrintHello`, y hemos aprendido que podemos usar el componente como una etiqueta HTML.
```jsx
diff --git a/exercises/03.2-a-real-component/README.md b/exercises/03.2-a-real-component/README.md
index 4444c874..0f13d374 100644
--- a/exercises/03.2-a-real-component/README.md
+++ b/exercises/03.2-a-real-component/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=MGqH3dOhxL4"
+tutorial: "https://www.youtube.com/watch?v=GzBbP3JLdEw"
---
# `03.2` A real component
diff --git a/exercises/03.3-component-properties/README.es.md b/exercises/03.3-component-properties/README.es.md
index 8268ccde..de913b0a 100644
--- a/exercises/03.3-component-properties/README.es.md
+++ b/exercises/03.3-component-properties/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/lNBbv8_0rC8"
+---
+
+
# `03.3` Component Properties
La `BootstrapCard` que acabas de hacer está [hard coded](https://es.wikipedia.org/wiki/Codificaci%C3%B3n_r%C3%ADgida) para **Bob Dylan** únicamente.
diff --git a/exercises/03.3-component-properties/README.md b/exercises/03.3-component-properties/README.md
index e0bad6cc..2e4ea06f 100644
--- a/exercises/03.3-component-properties/README.md
+++ b/exercises/03.3-component-properties/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=79ho2T5Zy6U"
+tutorial: "https://www.youtube.com/watch?v=hIhhpm85kZU"
---
# `03.3` Component Properties
diff --git a/exercises/03.4-hero-component/README.es.md b/exercises/03.4-hero-component/README.es.md
index 91ecf4da..94db9421 100644
--- a/exercises/03.4-hero-component/README.es.md
+++ b/exercises/03.4-hero-component/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/06d3Qh3R3SI"
+---
+
+
# `03.4` Hero Component
Usando todo lo que has aprendido...
diff --git a/exercises/03.4-hero-component/README.md b/exercises/03.4-hero-component/README.md
index c4476251..673adc92 100644
--- a/exercises/03.4-hero-component/README.md
+++ b/exercises/03.4-hero-component/README.md
@@ -1,5 +1,5 @@
---
-tutorial: 'https://www.youtube.com/watch?v=zv6HPveyz6g'
+tutorial: 'https://www.youtube.com/watch?v=ruD2opV_eGg'
---
# `03.4` Hero Component
diff --git a/exercises/03.5-alert-component/README.es.md b/exercises/03.5-alert-component/README.es.md
index 8080da6d..8c0d58df 100644
--- a/exercises/03.5-alert-component/README.es.md
+++ b/exercises/03.5-alert-component/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/FXGYRnGs6Dg"
+---
+
+
# `03.5` Alert Component
Basado en el conocimiento que tienes ahora:
diff --git a/exercises/03.5-alert-component/README.md b/exercises/03.5-alert-component/README.md
index a9982885..ff11f005 100644
--- a/exercises/03.5-alert-component/README.md
+++ b/exercises/03.5-alert-component/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=80_k11tqhrE"
+tutorial: "https://www.youtube.com/watch?v=qfAIamf0JOA"
---
# `03.5` Alert Component
diff --git a/exercises/04-conditional-rendering/README.es.md b/exercises/04-conditional-rendering/README.es.md
index b49d7de3..10c1c578 100644
--- a/exercises/04-conditional-rendering/README.es.md
+++ b/exercises/04-conditional-rendering/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://www.youtube.com/watch?v=rsPIYF2PWAQ"
+---
+
+
# `04` Conditional Rendering
También puedes usar las propiedades de un componente para cambiar su comportamiento como mostrar u ocultar ``, según una propiedad llamada `show`.
diff --git a/exercises/04-conditional-rendering/README.md b/exercises/04-conditional-rendering/README.md
index 99e5788c..3913f492 100644
--- a/exercises/04-conditional-rendering/README.md
+++ b/exercises/04-conditional-rendering/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=1O9uUXymny4"
+tutorial: "https://www.youtube.com/watch?v=PZq3JSYNYw4"
---
# `04` Conditional Rendering
diff --git a/exercises/04.1-conditional-rendering/README.es.md b/exercises/04.1-conditional-rendering/README.es.md
index 94fe06e6..84fa588f 100644
--- a/exercises/04.1-conditional-rendering/README.es.md
+++ b/exercises/04.1-conditional-rendering/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://youtu.be/myK-x2eBPbI"
+---
+
+
# `04.1` Conditional Rendering
Hagamos nuestro componente `` un poco más inteligente.
diff --git a/exercises/04.1-conditional-rendering/README.md b/exercises/04.1-conditional-rendering/README.md
index 210964c6..10b25f6f 100644
--- a/exercises/04.1-conditional-rendering/README.md
+++ b/exercises/04.1-conditional-rendering/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=hEY3YRQN0uk"
+tutorial: "https://www.youtube.com/watch?v=XkKUH49XufQ"
---
# `04.1` Conditional Rendering
diff --git a/exercises/04.2-conditional-rendering/README.es.md b/exercises/04.2-conditional-rendering/README.es.md
index 98b9021e..b67ff7ca 100644
--- a/exercises/04.2-conditional-rendering/README.es.md
+++ b/exercises/04.2-conditional-rendering/README.es.md
@@ -1,3 +1,8 @@
+---
+tutorial: "https://www.youtube.com/watch?v=1cYgv4aorjw"
+---
+
+
# `04.2` Conditional Rendering
Justo ahora este componente `` puede renderizar en **yellow** o **red** dependiendo del valor de su propiedad `color`.
diff --git a/exercises/04.2-conditional-rendering/README.md b/exercises/04.2-conditional-rendering/README.md
index fa5f9c69..758b56d4 100644
--- a/exercises/04.2-conditional-rendering/README.md
+++ b/exercises/04.2-conditional-rendering/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=l3v6E1o_YUI"
+tutorial: "https://www.youtube.com/watch?v=4t5ABvXbEqo"
---
# `04.2` Conditional Rendering
diff --git a/exercises/05-adding-styles/README.es.md b/exercises/05-adding-styles/README.es.md
index ed05b48a..54c23e4e 100644
--- a/exercises/05-adding-styles/README.es.md
+++ b/exercises/05-adding-styles/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=iMLO4utFkFU"
+---
+
# `05` Adding styles to the components
La forma más recomendada de usar estilos en React es usando CSS-in-JS.
diff --git a/exercises/05-adding-styles/README.md b/exercises/05-adding-styles/README.md
index 379e4144..1f098c9b 100644
--- a/exercises/05-adding-styles/README.md
+++ b/exercises/05-adding-styles/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=I93UjM0y9aE"
+tutorial: "https://www.youtube.com/watch?v=PYJr6Mf3tq4"
---
# `05` Adding styles to the components
diff --git a/exercises/05.1-second-styles/README.es.md b/exercises/05.1-second-styles/README.es.md
index c4494fbc..6b8ad81d 100644
--- a/exercises/05.1-second-styles/README.es.md
+++ b/exercises/05.1-second-styles/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=SJxlGFSUgG0"
+---
+
# `05.1` Adding styles to the components
## 📝 Instrucciones:
diff --git a/exercises/05.1-second-styles/README.md b/exercises/05.1-second-styles/README.md
index 3202532e..6de9ff2b 100644
--- a/exercises/05.1-second-styles/README.md
+++ b/exercises/05.1-second-styles/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=Vr5Kh47NSuM"
+tutorial: "https://www.youtube.com/watch?v=mw3AuXgzETE"
---
# `05.1` Adding styles to the components
diff --git a/exercises/06-listening-to-events/README.es.md b/exercises/06-listening-to-events/README.es.md
index 3aa62f5f..45a127b8 100644
--- a/exercises/06-listening-to-events/README.es.md
+++ b/exercises/06-listening-to-events/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=p5JuLoQ0gA8"
+---
+
# `06` Listening for events
Los eventos en React trabajan de forma muy similar a como lo harían en Vanilla JS, si quieres escuchar el `Click` de un usuario, todo lo que tienes que hacer es agregar tu propiedad `onClick` (o cualquier otro evento en la etiqueta HTML) como suele hacerse.
diff --git a/exercises/06-listening-to-events/README.md b/exercises/06-listening-to-events/README.md
index f7f9475d..fef4f23b 100644
--- a/exercises/06-listening-to-events/README.md
+++ b/exercises/06-listening-to-events/README.md
@@ -1,5 +1,5 @@
---
-tutorial: "https://www.youtube.com/watch?v=mKNchkgVtrg"
+tutorial: "https://www.youtube.com/watch?v=WLiSFuCLhxA"
---
# `06` Listening for events
From cbe6744798650c4171f67d966530f579487f918f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Charly=20Chac=C3=B3n?=
<107764250+Charlytoc@users.noreply.github.com>
Date: Mon, 29 Apr 2024 13:52:13 -0500
Subject: [PATCH 3/4] Update devcontainer.json
---
.devcontainer/devcontainer.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 0cc70a9a..83005370 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -22,7 +22,7 @@
// Use 'forwardPorts' to make a list of ports inside the container available locally.
// "forwardPorts": [],
- "onCreateCommand": "npm i jest@29.7.0 -g && npm i jest-environment-jsdom@29.7.0 -g && npm i @learnpack/learnpack@2.1.50 -g && learnpack plugins:install @learnpack/react@1.1.5"
+ "onCreateCommand": "npm i jest@29.7.0 -g && npm i jest-environment-jsdom@29.7.0 -g && npm i @learnpack/learnpack@2.1.50 -g && learnpack plugins:install @learnpack/react@1.1.6"
// Use 'postCreateCommand' to run commands after the container is created.
// "postCreateCommand": "yarn install",
From 3355bbe08dc4dba5baba6b194b908709b36bde45 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Charly=20Chac=C3=B3n?=
<107764250+Charlytoc@users.noreply.github.com>
Date: Mon, 29 Apr 2024 14:02:00 -0500
Subject: [PATCH 4/4] Update devcontainer.json
---
.devcontainer/devcontainer.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 83005370..4cdea309 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -22,7 +22,7 @@
// Use 'forwardPorts' to make a list of ports inside the container available locally.
// "forwardPorts": [],
- "onCreateCommand": "npm i jest@29.7.0 -g && npm i jest-environment-jsdom@29.7.0 -g && npm i @learnpack/learnpack@2.1.50 -g && learnpack plugins:install @learnpack/react@1.1.6"
+ "onCreateCommand": "npm i jest@29.7.0 -g && npm i jest-environment-jsdom@29.7.0 -g && npm i @learnpack/learnpack@2.1.50 -g && learnpack plugins:install @learnpack/react"
// Use 'postCreateCommand' to run commands after the container is created.
// "postCreateCommand": "yarn install",