You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/0/es/part0a.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -334,7 +334,7 @@ La transcripción te será entregada electrónicamente por correo electrónico.
334
334
335
335
### No hay más versiones anuales
336
336
337
-
No hay más "versiones anuales" del curso, el curso está abierto todo el tiempo. Cada parte se actualiza una o dos veces al año. Las actualizaciones son en su mayoría menores: se actualizan las versiones de las bibliotecas y se mejora la claridad del texto. Sin embargo, también puede haber algunos cambios más significativos.
337
+
No hay más "versiones anuales" del curso, el curso está abierto todo el tiempo. Cada parte se actualiza una o dos veces al año. Las actualizaciones son en su mayoría menores: se actualizan las versiones de las librerías y se mejora la claridad del texto. Sin embargo, también puede haber algunos cambios más significativos.
338
338
339
339
A pesar de los cambios *todos los ejercicios enviados siguen siendo válidos*, y puedes continuar el curso sin preocuparte por las actualizaciones. Además, la política para obtener certificados, créditos universitarios, etc., seguirá siendo la misma, sin importar lo que suceda.
Copy file name to clipboardExpand all lines: src/content/0/es/part0b.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -118,7 +118,7 @@ Escribir HTML en medio del código no es muy inteligente, pero para los programa
118
118
119
119
En las aplicaciones web tradicionales, el navegador es "tonto". Solo obtiene datos HTML del servidor, y toda la lógica de la aplicación reside en el servidor. Un servidor puede ser creado utilizando [Java Spring](https://spring.io/projects/spring-framework), [Python Flask](https://flask.palletsprojects.com/en/2.2.x/), o [Ruby on Rails](http://rubyonrails.org/), por mencionar solo algunos ejemplos.
120
120
121
-
El ejemplo utiliza la biblioteca[Express](https://expressjs.com/) con Node.js. Este curso utilizará Node.js y Express para crear servidores web.
121
+
El ejemplo utiliza la librería[Express](https://expressjs.com/) con Node.js. Este curso utilizará Node.js y Express para crear servidores web.
122
122
123
123
### Ejecución de la lógica de la aplicación en el navegador
124
124
@@ -584,8 +584,8 @@ El auge de las aplicaciones de una sola página trajo varias formas más "modern
584
584
585
585
Sin embargo, la popularidad de Angular se desplomó después de que el [equipo de Angular anunció que el soporte para la versión 1 terminaría](https://web.archive.org/web/20151208002550/https://jaxenter.com/angular-2-0-announcement-backfires-112127.html), y que Angular 2 no sería retrocompatible con la primera versión. Angular 2 y las versiones más nuevas no recibieron una bienvenida muy cálida.
586
586
587
-
Actualmente, la herramienta más popular para implementar la lógica del lado del navegador en las aplicaciones web es la biblioteca [React](https://react.dev/) de Facebook.
588
-
Durante este curso, nos familiarizaremos con React y la biblioteca [Redux](https://github.com/reactjs/redux), que se usan juntos con frecuencia.
587
+
Actualmente, la herramienta más popular para implementar la lógica del lado del navegador en las aplicaciones web es la librería [React](https://react.dev/) de Facebook.
588
+
Durante este curso, nos familiarizaremos con React y la librería [Redux](https://github.com/reactjs/redux), que se usan juntos con frecuencia.
589
589
590
590
El estado de React parece sólido, pero el mundo de JavaScript cambia constantemente. Por ejemplo, recientemente un recién llegado -[VueJS](https://vuejs.org/)- ha estado captando cierto interés.
Copy file name to clipboardExpand all lines: src/content/1/es/part1a.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,7 +7,7 @@ lang: es
7
7
8
8
<divclass="content">
9
9
10
-
Ahora comenzaremos a familiarizarnos con probablemente el tema más importante de este curso, es decir, la biblioteca[React](https://es.react.dev/). Comencemos con la creación de una aplicación React simple y con el conocimiento de los conceptos básicos de React.
10
+
Ahora comenzaremos a familiarizarnos con probablemente el tema más importante de este curso, es decir, la librería[React](https://es.react.dev/). Comencemos con la creación de una aplicación React simple y con el conocimiento de los conceptos básicos de React.
11
11
12
12
La forma más fácil de empezar es utilizando una herramienta llamada [Vite](https://es.vitejs.dev/).
Copy file name to clipboardExpand all lines: src/content/2/es/part2c.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -137,7 +137,7 @@ Volvamos al tema de la obtención de datos del servidor.
137
137
138
138
Podríamos usar la función basada en promesas [fetch](https://developer.mozilla.org/es/docs/Web/API/fetch) mencionada anteriormente para extraer los datos del servidor. Fetch es una gran herramienta. Está estandarizado y es compatible con todos los navegadores modernos (excepto IE).
139
139
140
-
Dicho esto, usaremos la biblioteca[axios](https://github.com/axios/axios) en su lugar para la comunicación entre el navegador y el servidor. Funciona como fetch, pero es algo más agradable de usar. Otra buena razón para usar axios es que nos familiarizamos con la adición de bibliotecas externas, los llamados <i>paquetes npm</i>, a los proyectos de React.
140
+
Dicho esto, usaremos la librería[axios](https://github.com/axios/axios) en su lugar para la comunicación entre el navegador y el servidor. Funciona como fetch, pero es algo más agradable de usar. Otra buena razón para usar axios es que nos familiarizamos con la adición de librerías externas, los llamados <i>paquetes npm</i>, a los proyectos de React.
141
141
142
142
Hoy en día, prácticamente todos los proyectos de JavaScript se definen utilizando el administrador de paquetes de node, también conocido como [npm](https://docs.npmjs.com/about-npm). Los proyectos creados con Vite también siguen el formato npm. Un indicador claro de que un proyecto usa npm es el archivo <i>package.json</i> ubicado en la raíz del proyecto:
143
143
@@ -331,7 +331,7 @@ axios
331
331
})
332
332
```
333
333
334
-
Los datos devueltos por el servidor son texto sin formato, básicamente solo una cadena larga. La biblioteca axios aún puede analizar los datos en una matriz de JavaScript, ya que el servidor ha especificado que el formato de datos es <i>application/json; charset=utf-8</i> (ver imagen anterior) usando el encabezado <i>content-type</i>.
334
+
Los datos devueltos por el servidor son texto sin formato, básicamente solo una cadena larga. La librería axios aún puede analizar los datos en una matriz de JavaScript, ya que el servidor ha especificado que el formato de datos es <i>application/json; charset=utf-8</i> (ver imagen anterior) usando el encabezado <i>content-type</i>.
335
335
336
336
Finalmente podemos comenzar a utilizar los datos obtenidos del servidor.
337
337
@@ -357,7 +357,7 @@ Sin embargo, lo que no es inmediatamente obvio es dónde se debe colocar el coma
357
357
Ya hemos utilizado [state hooks](https://es.react.dev/learn/state-a-components-memory) que se introdujeron junto con la versión de React [16.8.0](https://www.npmjs.com/package/react/v/16.8.0), que proporciona el estado de los componentes de React definidos como funciones, los llamados <i>componentes funcionales</i>. La versión 16.8.0 también presenta los [hooks de efectos](https://es.react.dev/reference/react/hooks#effect-hooks) como una nueva característica. Según los documentos oficiales:
358
358
359
359
> <i>Los efectos permiten que un componente se conecte y se sincronice con sistemas externos.</i>
360
-
> <i>Esto incluye manejar la red, el DOM del navegador, animaciones, widgets escritos usando una biblioteca de interfaz de usuario diferente, y otro código que no es de React.</i>
360
+
> <i>Esto incluye manejar la red, el DOM del navegador, animaciones, widgets escritos usando una librería de interfaz de usuario diferente, y otro código que no es de React.</i>
361
361
362
362
Como tal, los hooks de efectos son precisamente la herramienta adecuada para usar cuando se obtienen datos de un servidor.
Copy file name to clipboardExpand all lines: src/content/3/es/part3a.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -85,7 +85,7 @@ El script npm <i>start</i> funciona porque lo definimos en el archivo <i>package
85
85
86
86
Aunque la ejecución del proyecto funciona cuando se inicia llamando a _node index.js_ desde la línea de comando, es habitual que los proyectos npm ejecuten estas tareas como scripts npm.
87
87
88
-
De forma predeterminada, el archivo <i>package.json</i> también define otro script npm de uso común llamado <i>npm test</i>. Dado que nuestro proyecto aún no tiene una biblioteca de testing, el comando _npm test_ simplemente ejecuta el siguiente comando:
88
+
De forma predeterminada, el archivo <i>package.json</i> también define otro script npm de uso común llamado <i>npm test</i>. Dado que nuestro proyecto aún no tiene una librería de testing, el comando _npm test_ simplemente ejecuta el siguiente comando:
89
89
90
90
```bash
91
91
echo"Error: no test specified"&&exit 1
@@ -226,7 +226,7 @@ Cuando abrimos el navegador, el formato que se muestra es exactamente el mismo q
226
226
227
227
Es posible implementar nuestro código de servidor directamente con el servidor web [http](https://nodejs.org/docs/latest-v18.x/api/http.html) integrado de Node. Sin embargo, es engorroso, especialmente una vez que la aplicación aumenta de tamaño.
228
228
229
-
Se han desarrollado muchas librerías para facilitar el desarrollo del lado del servidor con Node, al ofrecer una interfaz más agradable para trabajar con el módulo http integrado. Estas librerías tienen como objetivo proporcionar una mejor abstracción para los casos de uso general que generalmente requerimos para construir un servidor backend. Por lejos, la biblioteca más popular destinada a este propósito es [express](http://expressjs.com).
229
+
Se han desarrollado muchas librerías para facilitar el desarrollo del lado del servidor con Node, al ofrecer una interfaz más agradable para trabajar con el módulo http integrado. Estas librerías tienen como objetivo proporcionar una mejor abstracción para los casos de uso general que generalmente requerimos para construir un servidor backend. Por lejos, la librería más popular destinada a este propósito es [express](http://expressjs.com).
230
230
231
231
Usemos express definiéndolo como una dependencia del proyecto con el comando:
232
232
@@ -249,7 +249,7 @@ El código fuente de la dependencia se instala en el directorio <i>node\_modules
249
249
250
250

251
251
252
-
Estas son, de hecho, las dependencias de la biblioteca express y las dependencias de todas sus dependencias, etc. Estas son las [dependencias transitivas](https://lexi-lambda.github.io/blog/2016/08/24/understanding-the-npm-dependency-model/) de nuestro proyecto.
252
+
Estas son, de hecho, las dependencias de la librería express y las dependencias de todas sus dependencias, etc. Estas son las [dependencias transitivas](https://lexi-lambda.github.io/blog/2016/08/24/understanding-the-npm-dependency-model/) de nuestro proyecto.
253
253
254
254
La versión 4.18.2 de express se instaló en nuestro proyecto. ¿Qué significa el signo de intercalación delante del número de versión en <i>package.json</i>?
255
255
@@ -259,7 +259,7 @@ La versión 4.18.2 de express se instaló en nuestro proyecto. ¿Qué significa
259
259
260
260
El modelo de control de versiones utilizado en npm se denomina control de [versiones semántico](https://docs.npmjs.com/about-semantic-versioning).
261
261
262
-
El signo de intercalación al frente de <i>^4.18.2</i> significa que si y cuando se actualizan las dependencias de un proyecto, la versión de express que se instala será al menos <i>4.18.2</i>. Sin embargo, la versión instalada de express también puede ser una que tenga un número de <i>parche</i> más grande (el último número) o un número <i>menor</i> más grande (el número del medio). La versión principal de la biblioteca indicada por el primer número <i>mayor</i> debe ser la misma.
262
+
El signo de intercalación al frente de <i>^4.18.2</i> significa que si y cuando se actualizan las dependencias de un proyecto, la versión de express que se instala será al menos <i>4.18.2</i>. Sin embargo, la versión instalada de express también puede ser una que tenga un número de <i>parche</i> más grande (el último número) o un número <i>menor</i> más grande (el número del medio). La versión principal de la librería indicada por el primer número <i>mayor</i> debe ser la misma.
263
263
264
264
Podemos actualizar las dependencias del proyecto con el comando:
Copy file name to clipboardExpand all lines: src/content/4/es/part4a.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -791,7 +791,7 @@ Escribe las pruebas para este ejercicio dentro de un nuevo bloque <i>describe</i
791
791
792
792
Este y el siguiente ejercicio son un poco más desafiantes. No es necesario completar estos dos ejercicios para avanzar en el material del curso, por lo que puede ser una buena idea volver a estos una vez que haya terminado de leer el material de esta parte en su totalidad.
793
793
794
-
Se puede terminar este ejercicio sin el uso de librerías adicionales. Sin embargo, este ejercicio es una gran oportunidad para aprender a usar la biblioteca [Lodash](https://lodash.com/).
794
+
Se puede terminar este ejercicio sin el uso de librerías adicionales. Sin embargo, este ejercicio es una gran oportunidad para aprender a usar la librería [Lodash](https://lodash.com/).
795
795
796
796
Define una función llamada _mostBlogs_ que reciba una lista de blogs como parámetro. La función devuelve el <i>author</i> que tiene la mayor cantidad de blogs. El valor de retorno también contiene el número de blogs que tiene el autor principal:
Copy file name to clipboardExpand all lines: src/content/4/es/part4b.md
+9-9Lines changed: 9 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@ lang: es
9
9
10
10
Ahora comenzaremos a escribir pruebas para el backend. Dado que el backend no contiene ninguna lógica complicada, no tiene sentido escribir [pruebas unitarias](https://es.wikipedia.org/wiki/Prueba_unitaria) para él. Lo único que podríamos probar unitariamente es el método _toJSON_ que se utiliza para formatear notas.
11
11
12
-
En algunas situaciones, puede ser beneficioso implementar algunas de las pruebas de backend simulando la base de datos en lugar de usar una base de datos real. Una biblioteca que podría usarse para esto es [mongo-mock](https://github.com/williamkapke/mongo-mock).
12
+
En algunas situaciones, puede ser beneficioso implementar algunas de las pruebas de backend simulando la base de datos en lugar de usar una base de datos real. Una librería que podría usarse para esto es [mongo-mock](https://github.com/williamkapke/mongo-mock).
13
13
14
14
Dado que el backend de nuestra aplicación todavía es relativamente simple, tomaremos la decisión de probar toda la aplicación a través de su API REST, de modo que la base de datos también esté incluida. Este tipo de prueba, en la que se prueban varios componentes del sistema como un grupo, se denomina [prueba de integración](https://en.wikipedia.org/wiki/Integration_testing).
15
15
@@ -50,7 +50,7 @@ Hay un pequeño problema en la forma en que hemos especificado el modo de la apl
50
50
npm install --save-dev cross-env
51
51
```
52
52
53
-
Entonces podemos lograr la compatibilidad multiplataforma utilizando la biblioteca cross-env en nuestros scripts npm definidos en <i>package.json</i>:
53
+
Entonces podemos lograr la compatibilidad multiplataforma utilizando la librería cross-env en nuestros scripts npm definidos en <i>package.json</i>:
54
54
55
55
```json
56
56
{
@@ -822,16 +822,16 @@ try {
822
822
823
823
Uno comienza a preguntarse, ¿sería posible refactorizar el código para eliminar el <i>catch</i> de los métodos?
824
824
825
-
La biblioteca[express-async-errors](https://github.com/davidbanham/express-async-errors) tiene una solución para esto.
825
+
La librería[express-async-errors](https://github.com/davidbanham/express-async-errors) tiene una solución para esto.
826
826
827
-
Instalemos la biblioteca
827
+
Vamos a instalarla
828
828
829
829
```bash
830
830
npm install express-async-errors
831
831
```
832
832
833
-
Usar la biblioteca es <i>muy</i> fácil.
834
-
Introduce la biblioteca en <i>app.js</i>, _antes_ de que importes tus rutas:
833
+
Usarla es <i>muy</i> fácil.
834
+
Introduce la librería en <i>app.js</i>, _antes_ de que importes tus rutas:
Debido a la biblioteca, ya no necesitamos la llamada a _next(exception)_.
876
-
La biblioteca se encarga de todo lo que hay debajo del capó. Si ocurre una excepción en una ruta <i>async</i>, la ejecución se pasa automáticamente al middleware de manejo de errores.
875
+
Debido a express-async-errors, ya no necesitamos la llamada a _next(exception)_.
876
+
La librería se encarga de todo lo que hay debajo del capó. Si ocurre una excepción en una ruta <i>async</i>, la ejecución se pasa automáticamente al middleware de manejo de errores.
Copy file name to clipboardExpand all lines: src/content/4/es/part4c.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -494,7 +494,7 @@ Asimismo, los IDs de los usuarios que crearon las notas se pueden ver cuando vis
494
494
495
495
Nos gustaría que nuestra API funcione de tal manera que cuando se realiza una solicitud HTTP GET a la ruta <i>/api/users</i>, los objetos de usuario también contengan el contenido de las notas del usuario, y no solo su identificación. En una base de datos relacional, esta funcionalidad se implementaría con una <i>consulta de unión</i>.
496
496
497
-
Como se mencionó anteriormente, las bases de datos de documentos no admiten adecuadamente las consultas de unión entre colecciones, pero la biblioteca Mongoose puede hacer algunas de estas uniones por nosotros. Mongoose logra la unión haciendo múltiples consultas, lo cual es diferente de las consultas de unión en bases de datos relacionales que son <i>transaccionales</i>, lo que significa que el estado de la base de datos no cambia durante el tiempo que se realiza la consulta. Con las consultas de unión en Mongoose, nada puede garantizar que el estado entre las colecciones que se están uniendo sea coherente, lo que significa que si hacemos una consulta que une al usuario y las colecciones de notas, el estado de las colecciones puede cambiar durante la consulta.
497
+
Como se mencionó anteriormente, las bases de datos de documentos no admiten adecuadamente las consultas de unión entre colecciones, pero la librería Mongoose puede hacer algunas de estas uniones por nosotros. Mongoose logra la unión haciendo múltiples consultas, lo cual es diferente de las consultas de unión en bases de datos relacionales que son <i>transaccionales</i>, lo que significa que el estado de la base de datos no cambia durante el tiempo que se realiza la consulta. Con las consultas de unión en Mongoose, nada puede garantizar que el estado entre las colecciones que se están uniendo sea coherente, lo que significa que si hacemos una consulta que une al usuario y las colecciones de notas, el estado de las colecciones puede cambiar durante la consulta.
498
498
499
499
La unión de Mongoose se realiza con el método [populate](http://mongoosejs.com/docs/populate.html). Actualicemos la ruta que devuelve todos los usuarios primero:
0 commit comments