Merge pull request #127 from Charlytoc/master

Adding new LearnPack cli and IDE version
4GeeksAcademy · Feb 26, 2024 · abfb126 · abfb126
2 parents 857ceeb + 0bf5e07
commit abfb126
Show file tree

Hide file tree

Showing 34 changed files with 128 additions and 26 deletions.
diff --git 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 [email protected] -g && npm i @learnpack/[email protected].26 -g && learnpack plugins:install [email protected]"
+	"onCreateCommand": "npm i [email protected] -g && npm i @learnpack/[email protected].35 -g && learnpack plugins:install [email protected]"
 
 	// Use 'postCreateCommand' to run commands after the container is created.
 	// "postCreateCommand": "yarn install",

diff --git a/.learn/assets/build.png b/.learn/assets/build.png
diff --git a/.learn/resets/03-hello-without-head/README.es.md b/.learn/resets/03-hello-without-head/README.es.md
@@ -0,0 +1,30 @@
+---
+tutorial: "https://www.youtube.com/watch?v=oFswWx9ba14"
+---
+
+# `03` Hello without Head
+
+En el último ejercicio tuviste que agregar toda la estructura básica HTML de un sitio web.
+
+Haz lo mismo en este ejercicio, pero no incluyas la etiqueta `<head>`.
+
+## 📝 Instrucciones:
+
+1. Agrega al `<body>` un título `<h1>` con tu nombre.
+
+## 💻 Resultado esperado:
+
+![Link url](../../.learn/assets/03-hello-without-head.png?raw=true)
+
+## 💡 Pista:
+
++ La estructura debería de verse algo así:
+
+```md
+<!DOCTYPE html>
+<html>
+	<body>
+		<h1><!--Aquí irá tu nombre--></h1>
+	</body>
+</html>
+```
diff --git a/.learn/resets/03-hello-without-head/README.md b/.learn/resets/03-hello-without-head/README.md
@@ -0,0 +1,26 @@
+# `03` Hello without Head
+
+In the last exercise you had to add all the HTML basic structure of a website.
+
+Do the same for this exercise, but don't include the `<head>` tag.
+
+## 📝 Instructions:
+
+1. Add into the `<body>` an `<h1>` heading with your name on it.
+
+## 💻 Expected result:
+
+![Link url](../../.learn/assets/03-hello-without-head.png?raw=true)
+
+## 💡 Hint:
+
++ The structure should look something like this:
+
+```md
+<!DOCTYPE html>
+<html>
+	<body>
+		<h1><!--The name goes here--></h1>
+	</body>
+</html>
+```
diff --git a/exercises/00-welcome/README.es.md b/exercises/00-welcome/README.es.md
@@ -1,5 +1,5 @@
 ---
-intro: "https://www.youtube.com/watch?v=tVlYr0hRiRM"
+intro: "https://www.youtube.com/embed/kDQAnCqGS-w?si=Hxm_0xsGUWmL4pfk"
 ---
 # ¡Bienvenidos!
 
@@ -37,6 +37,8 @@ Gracias a estas maravillosas personas ([emoji key](https://github.com/kentcdodds
 
 3. [Marco Gómez (marcogonzalo)](https://github.com/marcogonzalo), contribución: (traducción) :earth_africa:
 
+4. [Charly Chacón (charlytoc)](https://github.com/charlytoc), contribución: (remasterización, video tutoriales) 🤖
+
 Este proyecto sigue las especificaciones: [all-contributors](https://github.com/kentcdodds/all-contributors). 
 
 ¡Todas las contribuciones son bienvenidas!

diff --git a/exercises/00-welcome/README.md b/exercises/00-welcome/README.md
@@ -1,5 +1,5 @@
 ---
-intro: "https://www.youtube.com/watch?v=Vd2dby9ind4"
+intro: "https://www.youtube.com/watch?v=zKfaek8q2vI"
 ---
 # Welcome!
 
@@ -37,6 +37,8 @@ Thanks to these wonderful people ([emoji key](https://github.com/kentcdodds/all-
 
 3. [Marco Gómez (marcogonzalo)](https://github.com/marcogonzalo), contribution: (translator) :earth_africa:
 
+4. [Charly Chacón (charlytoc)](https://github.com/charlytoc), contribution: (remasterization, video tutorials) 🤖
+
 This project follows these specifications: [all-contributors](https://github.com/kentcdodds/all-contributors)
 
 Contributions of any kind are welcome!

diff --git a/exercises/01-hello-world/README.es.md b/exercises/01-hello-world/README.es.md
@@ -1,3 +1,6 @@
+---
+tutorial: "https://www.youtube.com/watch?v=rEs6-k7un3o"
+---
 # `01` Hello World
 
 HTML es un lenguaje de marcado, lo que significa que todo lo que se escribe debe estar encerrado en `<tags>` (etiquetas) de apertura y cierre, como estas:
@@ -9,9 +12,9 @@ HTML es un lenguaje de marcado, lo que significa que todo lo que se escribe debe
 
 ## 📝 Instrucciones:
 
-1. **Elimina** todo el contenido actual de la página, **agrega** las etiquetas anteriores en el HTML de tu sitio web y presiona "build" para ver los resultados.
+1. **Elimina** todo el contenido actual de la página, **agrega** las etiquetas anteriores en el HTML de tu sitio web y presiona "**run**" para ver los resultados.
 
-![Build](../../.learn/assets/build.png?raw=true)
+![Run](../../.learn/assets/build.png?raw=true)
 
 ## 💻 Resultado Esperado:
 

diff --git 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=s0WhMNU8qZ0"
+tutorial: "https://www.youtube.com/watch?v=979yVLquF9Y"
 ---
 
 # `01` Hello World
@@ -13,9 +13,9 @@ HTML is a markup language, meaning that everything you type must be wrapped in o
 
 ## 📝 Instructions:
 
-1. Please **remove** the current website content, **add** the above tags to your website HTML and press "build" to see the results.
+1. Please **remove** the current website content, **add** the above tags to your website HTML and press "**run**" to see the results.
 
-![Build](../../.learn/assets/build.png?raw=true)
+![Run](../../.learn/assets/build.png?raw=true)
 
 ## 💻 Expected Result:
 

diff --git a/exercises/01.1-like-word/README.es.md b/exercises/01.1-like-word/README.es.md
@@ -1,3 +1,6 @@
+---
+tutorial: "https://www.youtube.com/watch?v=PFY7o_z8L2I"
+---
 # `01.1` Like Word
 
 HTML fue creado inicialmente para publicar documentos, es por eso que sus `<tags>` (etiquetas) son similares a los elementos típicos que ves en un documento:

diff --git a/exercises/01.1-like-word/README.md b/exercises/01.1-like-word/README.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=sPcd9egcDak"
+---
+
 # `01.1` Like Word
 
 HTML was initially created with the purpose of publishing documents, that is why its `<tags>` are similar to the typical elements you see in a document:

diff --git a/exercises/02-website-structure/README.md b/exercises/02-website-structure/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=XMiG5UhV1n0"
+tutorial: "https://www.youtube.com/watch?v=NxOOu4mntXo"
 ---
 # `02` Website Structure
 

diff --git a/exercises/03-hello-without-head/README.md b/exercises/03-hello-without-head/README.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=JsnzmuQ90_Q"
+---
+
 # `03` Hello without Head
 
 In the last exercise you had to add all the HTML basic structure of a website.

diff --git a/exercises/04-list-of-reasons/README.es.md b/exercises/04-list-of-reasons/README.es.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=Mp4bF6rs3us"
+tutorial: "https://www.youtube.com/watch?v=Gbh21o4wsJg"
 ---
 # `04` List of Reasons
 

diff --git a/exercises/04-list-of-reasons/README.md b/exercises/04-list-of-reasons/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=IH1hAxMGRcw"
+tutorial: "https://www.youtube.com/watch?v=ej4ndZOXkm0"
 ---
 
 # `04` List of Reasons

diff --git a/exercises/05-create-anchors/README.md b/exercises/05-create-anchors/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=hVatMB5GaWA"
+tutorial: "https://www.youtube.com/watch?v=JScoiZRGiPE"
 ---
 
 # `05` Create anchors 

diff --git a/exercises/06-new-window/README.md b/exercises/06-new-window/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=1JXOMalTLNo"
+tutorial: "https://www.youtube.com/watch?v=ZzXz6YMHRGs"
 ---
 
 # `06` New Window

diff --git a/exercises/07-same-page/README.es.md b/exercises/07-same-page/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=Cv0HAnycKfQ"
+---
+
 # `07` Same Page
 
 Las etiquetas anchor `<a>`, también son capaces de redirigir al usuario a diferentes secciones de nuestra página web.

diff --git a/exercises/07-same-page/README.md b/exercises/07-same-page/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=HkJtj2618YU"
+tutorial: "https://www.youtube.com/watch?v=zFJmSEcU6uQ"
 ---
 
 # `07` Same Page

diff --git a/exercises/08-relative-vs-absolute-path/README.md b/exercises/08-relative-vs-absolute-path/README.md
@@ -42,7 +42,7 @@ Absolute paths include the domain name. They contain the full URL because they a
 
 ## 💡 Hints:
 
-+ Your absolute path should start with this: {{publicUrl}}
++ Your absolute path should start with this:**{{publicUrl}}**
 
 + If you build the exercise, open the website, and right click on the image, the context menu will show an option with the text 'Copy Image Address' that will copy its absolute URL into your clipboard.
 

diff --git a/exercises/09-formatting-Text/README.es.md b/exercises/09-formatting-Text/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=wYWGCLekOCA"
+---
+
 # `09` Formatting Text
 
 La forma en que funciona el procesamiento de texto en documentos es bastante estándar, siempre se ve lo mismo: encabezados, texto en negrita, párrafos, citas, etc.

diff --git a/exercises/09-formatting-Text/README.md b/exercises/09-formatting-Text/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=PhH8JeTPHXs"
+tutorial: "https://www.youtube.com/watch?v=Krt4BsRNtJo"
 ---
 
 # `09` Formatting Text

diff --git a/exercises/10-replicate-html/README.es.md b/exercises/10-replicate-html/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=DHSX-rZ5ayk"
+---
+
 # `10` Replicate HTML
 
 Esta es una imagen de un documento HTML que realizamos. 

diff --git a/exercises/10-replicate-html/README.md b/exercises/10-replicate-html/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=NIm_BplpzR0"
+tutorial: "https://www.youtube.com/watch?v=R_h8HWjBhaE"
 ---
 
 # `10` Replicate HTML

diff --git a/exercises/11-nested-tags/README.es.md b/exercises/11-nested-tags/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=vNCfuLTfW78"
+---
+
 # `11` Nested Tags
 
 ## ¿Qué son los Nested Tags? 🤔

diff --git a/exercises/11-nested-tags/README.md b/exercises/11-nested-tags/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=_sLqC-C-rvE"
+tutorial: "https://www.youtube.com/watch?v=3OvWbRlpnLY"
 ---
 
 # `11` Nested Tags

diff --git a/exercises/12-my-first-table/README.es.md b/exercises/12-my-first-table/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=MskUgEMh88g"
+---
+
 # `12` My First Table
 
 Vamos a crear una tabla de datos con solamente código HTML, la cual llevará la siguiente información:
@@ -101,7 +105,7 @@ Vamos a practicar realizando las siguientes tareas para jugar con el formato de
 
 ## 💡 Pista:
 
-+ Después de cada paso dale clic a `build`, para asegurarte que todo va bien.
++ Después de cada paso dale clic a `**run**`, para asegurarte que todo va bien.
 
 + Puedes copiar los bloques de código para que no tengas que escribirlos 3 veces más, solo recuerda cambiar la información de las celdas.
 

diff --git a/exercises/12-my-first-table/README.md b/exercises/12-my-first-table/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=ZHsw63Xdbw4"
+tutorial: "https://www.youtube.com/watch?v=bIQfuIOggpM"
 ---
 
 # `12` My First Table
@@ -104,7 +104,7 @@ We are going to practice doing the following tasks to play with the table format
 
 ## 💡 Hints:
 
-+ After each step click `build`, to make sure everything is going well.
++ After each step click `**run**`, to make sure everything is going well.
 
 + You can copy the code blocks so you don't have to type them 3 more times, just remember to change the information in the cells.
 

diff --git a/exercises/13-image-with-text/README.es.md b/exercises/13-image-with-text/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=1wyvtK7vLFM"
+---
+
 # `13` Image with Text
 
 Antes de que existiera `CSS`, el uso de tablas era la única forma posible de hacer algunos diseños de sitios web. Es un proceso muy similar a la creación de diseños en MS Office.

diff --git a/exercises/13-image-with-text/README.md b/exercises/13-image-with-text/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=QUoq-uQf6As"
+tutorial: "https://www.youtube.com/watch?v=NF1M60J090c"
 ---
 
 # `13` Image with Text

diff --git a/exercises/14-video-tag/README.es.md b/exercises/14-video-tag/README.es.md
@@ -1,3 +1,7 @@
+---
+tutorial: "https://www.youtube.com/watch?v=p9oHBMI6gc0"
+---
+
 # `14`  Video Tag
 
 El tag de `<video>` se utiliza para incluir un contenido de video dentro de un documento.

diff --git a/exercises/14-video-tag/README.md b/exercises/14-video-tag/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=fHTYfMkxPpQ"
+tutorial: "https://www.youtube.com/watch?v=GAGLlTEEP1w"
 ---
 
 # `14` Video Tag

diff --git a/exercises/15-iframe/README.es.md b/exercises/15-iframe/README.es.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=70WeW1uGIs4"
+tutorial: "https://www.youtube.com/watch?v=2PqOfB4nCeU"
 ---
 
 # `15` Iframe

diff --git a/exercises/15-iframe/README.md b/exercises/15-iframe/README.md
@@ -1,5 +1,5 @@
 ---
-tutorial: "https://www.youtube.com/watch?v=B-ge0ggbm7Y"
+tutorial: "https://www.youtube.com/watch?v=xLXYnVKaJL8"
 ---
 
 # `15` Iframe

diff --git a/learn.json b/learn.json
@@ -22,6 +22,6 @@
     "disabledActions": [],
     "autoPlay": true,
     "editor": {
-        "version": "1.0.73"
+        "version": "3.1.5"
     }
 }