Sie sind auf Seite 1von 25

Guía de Nodejs

Fundamentos
Instalar
Primero, Descargar el navegador Chrome o el que ustedes quieran
Segundo, Postman https://www.getpostman.com/apps
Tercero, Instalar visual studio code https://code.visualstudio.com/, usen el editor de código
con el que más se sienta a gusto.
Acá hay versiones portables de code https://code.visualstudio.com/#alt-downloads
Se le deben de instalar las siguientes extensiones que se van a utilizar más adelante:
TypeScript Importe que para importar librerías de javascript
Cuarto, instalar git, https://git-scm.com/

Comprobar la instalación de todo


Abrir la consola cmd o terminal de visual studio code
Instalación de git, su version
git –version
Instalación de node y su versión
node –v
Instalación de npm
npm –v

Actividad de reflexión Inicial


¿Qué es Node?
¿Por qué es tan popular?
¿Qué puedo hacer con Node?
¿Quiénes lo usan?

Actividad de contextualización
¿Qué es Node?
Piensen en JavaScript el que ustedes utilizan y utilizan del lado del navegador llega Node y
lo eleva al nivel de poderlo ejecutar desde el lado del servidor y ya no únicamente desde
la máquina del cliente, convirtiendo a JavaScript en un lenguaje de Backend, además
Node corre sobre el motor V8 de google.

¿Qué puedo hacer con Node?


Uso de Sockets para una comunicación real cliente- servidor,
Manejo de archivos FileSystem, cargas simultaneas,
Servidores locales y remotos con información en tiempo real,
Conexiones a bases de datos,
Creaciones de servicios REST en segundos,

¿Por qué es tan popular?


Entradas y salidas que no realizan bloqueo del servidor,
Es sumamente rápido y fácil,
Más de 470 mil paquetes disponibles (el ecosistema con más librerías en el mundo),
Si sabes JavaScript, ya conoces la mayor parte de Node.

¿Quiénes lo usan?
Netflix
Paypal
Linkedin
Walmart
Uber
ebay
NASA
Es el ecosistema open source con más librerías en el mundo.

Non-blocking I-O
Manejar peticiones paralelamente. Se verá más adelante

Primer programa
let nombre =’Tu nombre’;
console.log(‘Bienvenido! ‘+nombre);
console.log(`Bienvenido! ${nombre}`);
Las comillas simples de Word no son las mismas de programación
let nombre ='Tu nombre';
console.log('Bienvenido! '+nombre);
console.log(`Bienvenido! ${nombre}`);

Ciclos de eventos en Node


Crear un app2.js y copiamos el siguiente código
function saludar(nombre){
let mensaje=`Hola ${nombre}`;
return mensaje;
}
let saludo= saludar('Ramiro');

console.log(saludo);

El ejercicio anterior es una función normal


Ahora vamos a crear un app3.js y copiamos el siguiente código
console.log('inicio del programa');
setTimeout(function(){
console.log('Primer limete de Tiempo');
},3000);
setTimeout(function(){
console.log('Segundo limete de Tiempo');
},0);
setTimeout(function(){
console.log('Tercer limete de Tiempo');
},0);
console.log('Fin del Programa');

¿Qué será lo primero que se imprime? Piénsalo analícelo y comentemos


Adivinamos este sería el resultado
inicio del programa
Fin del Programa
Segundo limete de Tiempo
Tercer limete de Tiempo
Primer limete de Tiempo

Si el programa lee de arriba hacia abajo línea por línea, ¿Qué pasó?
La respuesta se da acá a continuación

Ciclo de vida de un proceso en Node

La respuesta anterior acá te la voy a explicar

node app1.js
let nombre='Ramiro';

console.log(`Hola ${nombre}`);

let a=10;

let b=20;

console.log(a+b);

main()
Pila del proceso Node Apis Cola de
(Call Stack) collbacks

Únicamente utilizó la pila, no se utilizarón las apis de node que son para procesos
asincronos
node app2.js

function saludar(nombre){

let mensaje=`Hola ${nombre}`;

return mensaje;

let saludo= saludar('Ramiro');

console.log(saludo);

main() saludar()

Pila del proceso Node Apis Cola de


(Call Stack) collbacks
node app3.js

console.log('inicio del programa');

setTimeout(function(){
console.log('Primer limete
de Tiempo');
},3000);

setTimeout(function(){
console.log('Segundo
limete de Tiempo');
},0);
setTimeout(function(){
console.log('Tercer limete
de Tiempo');
Pila del proceso Node Apis Cola de console.log('Fin del Programa');
(Call Stack) collbacks

main() saludar()
Funciona de la siguiente manera:
Se lleva el main a la pila del proceso, se ejecuta la primera línea de nuestro programa en
la pila y lo quita, luego lleva el primer setTimeout, como se demora 3 segundos lo registra,
pero no lo ejecuta, ni la elimina la pasa a las tareas asíncronas en el Node Apis mientras
pasa los tres segundos, luego registra el segundo setTimeout, el cual se demora 0 segundos
pero esto no quiere decir que lo ejecuta Node sigue recorriendo el programa, y lo pasa al
Node Apis así mismo hace con el tercer setTimeout, y es muy probable que ya haya
pasado los 0 segundos del segundo setTimeout, pero no lo ejecuta, sino que lo pasa a la
cola de Callbacks, acá se llevan todos los procesos que están listos para ser ejecutados,
pero no se pueden llevar a la pila de procesos, porque hay que esperar que esta termine,
después se ejecuta el console.log de fin programa y como no hay nada más en el main()
este termina. No quiere decir la aplicación de Node termina, Node coge los procesos que
ya tiene en el Callbacks y los ejecuta en su orden primero en entrar primero en salir, y
como ya pasaron los tres segundo se lleva el primer setTimeout al Callbacks y luego lo
lleva a la pila y lo ejecuta y ahora si ha terminado Node.
Corren muchas tareas simultáneamente.

Actividad
Realizar un programa donde se ejecute las siguientes instrucciones como se ve en
pantalla:

/*Bienvenidos a JavaScript
Estela Eres la última en Salir y te dio pereza de Hacer el
recorrido y quedas de primera en la fila de llegada, pero
descalificada
Adios, sigues trabajando!!!:-)
Barrientos Eres el Tercer en Salir y el primero en llegar
Ximena Eres la Quinto en Salir y la segundo en llegar
Gómez Eres el Cuarto en Salir y el tercero en llegar
Emilio Eres el Segundo en Salir y el antepenúltimo en llegar
Juliana Eres la penúltimo en Salir y la penúltimo en llegar
Ramiro Eres el primero en Salir y el último en llegar*/
console.log('Bienvenidos a JavaScript');
let nombre='Ramiro';
let nombre1='Emilio';
let nombre2='Barrientos';
let nombre3='Gómez';
let nombre4='Ximena';
let nombre5='Juliana';
let nombre6='Estela';

setTimeout(function(){
console.log(`${nombre} Eres el primero en Salir y el último en llegar`);
},6000);
setTimeout(function(){
console.log(`${nombre1} Eres el Segundo en Salir y el antepenúltimo en
llegar`);
},4000);
setTimeout(function(){
console.log(`${nombre2} Eres el Tercer en Salir y el primero en llegar`);
},1);
setTimeout(function(){
console.log(`${nombre3} Eres el Cuarto en Salir y el tercero en llegar`);
},2);
setTimeout(function(){
console.log(`${nombre4} Eres la Quinto en Salir y la segundo en llegar`);
},0);
setTimeout(function(){
console.log(`${nombre5} Eres la penúltimo en Salir y la penúltimo en
llegar`);
},5000);

console.log(`${nombre6} Eres la última en Salir y te dio pereza de Hacer el


recorrido y quedas de primera en la fila de llegada, pero descalificada`);

console.log('Adios, sigues trabajando!!!:-)');


Refuerzo
Variables var y let

¿Qué pasaría si?

Ejercicio

Si cambiamos por let


Está trabajando de manera local hay que definirlo de manera global para poderlo utilizar

¿Qué sucederá?

Let brinda más funcionalidad y seguridad, aunque todavía se va a seguir por varios años.

Templates literales

Vamos a usar Templates literales con el acento grave o bactics (``) lo cual se utiliza para
inyectar cualquier cosa de JavaScript
Vamos a ver si en la sintaxis es igual comparando el valor y la identidad, si se cumple debe
de aparecer un true

Destructuración de Objetos

Con emasc 6 podemos quitar la parte function


Pero dejémoslo con function
Nada de lo anterior es destructuración, veamos que es:
Tradicionalmente para traernos cada atributo del objeto creamos una variable

Vamos a realizarlo en una sola línea usando la destructuración


No tendríamos tres variables

Si quiero colocarle renombrar las variables para que no choquen, por ejemplo la de
nombre por primerNombre
Ya genera un erro porque cuando imprimo la variable nombre ya no existe

Funciones arrow
Normalmente realizamos funciones así

Pero con arrow nos quedaría de la siguiente manera

Pero una de las principales funcionalidades de arrow


Primera Actividad traducir la siguiente función a función arrow

Solución

Segunda Actividad

Solución

Actividad tres Especial convertir a


Una característica en funciones arrow que se deben de conocer
Solución

Los valores definidos por funciones arrow no se debe utilizar arrow

Solucionado quedaría así:

Callback
Las funciones callback son funciones dentro de otras que se disparan dependiendo de
otras funciones
Lo que esta subrayado con rojo es la función callback

Actividad convertir la anterior actividad a función flecha


Solución

Más callback
Simulemos que el id 20 no existe

Pero si miramos la respuesta miremos bien lo que sale

Que da muy redundante porque se está trayendo la respuesta, arreglemos esta parte con
err
Pero miremos como sale

Esto indica que se debe arreglar


Problemas comunes con los Callbacks
Vamos a simular una base de datos con cuatro una tabla usuarios la cual va a tener
cuatro registros,
Ahora vamos a crear otra tabla llamada usuarios, la cual puede tener dos registros o más,
Así:

Ahora vamos a crear el Callbacks de la siguiente manera;


Como dice el comentario se debe de guardar en una variable que vamos a llamar
empleadoDB,

Vamos a convertirlo a una función de una sola línea

Vamos a comprobar si funciona los empleados, todavía no se ha realizado el Callbacks

Da como resultado lo siguiente


Falta el salario

Promesas
Vamos a crear un archivo promesas.js
Vamos a copiarnos la base de datos de callback2
let empleados=[{
id:1,
nombre:'Ramiro'

},{
id:2,
nombre:'Estela'
},{
id:3,
nombre:'Ximena'
},{
id:4,
nombre:'Juliana'
}];

let salarios =[{


id:1,
salario:5000000
},{
id:2,
salario:4000000
},{
id:3,
salario:3000000
},{
id:4,
salario:2000000
}];

Ahora vamos a copiarnos el metodo del getEmpleado


Para que veamos cómo se hace la conversión a promesas
let getEmpleado=(id,callback)=>{
let empleado=empleados.find(empleado=>empleado.id==id)
if(!empleadoDB){
callback(`No existe un empleado en la DB ${id}`)
}else {
callback(null,empleadoDB);
}
}
Lo primero que realizaremos es quitar el segundo parámetro es decir el callback y dejar
únicamente el id
let getEmpleado=(id)=>{
Necesito retornar una promesa, una promesa es una característica de ecma6 y son
funciones común y corrientes, pero que tiene adentro dos callback,
let getEmpleado=(id)=>{

return new Promise((resolve, reject)=> )

//Ojo

let empleado=empleados.find(empleado=>empleado.id==id)
if(!empleadoDB){
callback(`No existe un empleado en la DB ${id}`)
}else {
callback(null,empleadoDB);
}
}
La parte después de Ojo la muevo dentro de la promesa así:
let getEmpleado=(id)=>{

return new Promise((resolve, reject)=> {


let empleado=empleados.find(empleado=>empleado.id==id)
if(!empleadoDB){
callback(`No existe un empleado en la DB ${id}`)
}else {
callback(null,empleadoDB);
}

});

//Ojo

}
Ahora toca cambiar los dos Callbacks por resolve y reject; donde el primero es el que
carga la parte positiva y la segunda carga la parte negativa
let getEmpleado=(id)=>{

return new Promise((resolve, reject)=> {


let empleado=empleados.find(empleado=>empleado.id==id)
if(!empleadoDB){
reject(`No existe un empleado con el ID ${id}` en la base de
datos)
}else {
resolve(null,empleadoDB);
}

});

En el resolve no puede tener dos parámetros, solamente uno


}else {
resolve(empleadoDB);
}

Vamos a utilizar esta promesa, llamemos empleado

getEmpleado(10).then(empleado=>{
console.log('Empleado de BD', empleado);

});
Al ejecutarlo nos muestra un error
C:\Users\Ximena-Juliana\Dropbox\Cursos\Node.js\Curso Complementario>node
promesas
(node:5504) UnhandledPromiseRejectionWarning: No existe un empleado con el ID
10, en la base de datos
(node:5504) UnhandledPromiseRejectionWarning: Unhandled PROMISE REJECTION. This
error originated either by throwing inside of an async function without a catch
block, or by rejecting a promise which was not handled with .catch(). (rejection
id: 2)
(node:5504) [DEP0018] DeprecationWarning: Unhandled promise rejections are
deprecated. In the future, promise rejections that are
not handled will terminate the Node.js process with a non-zero exit code.
En letra mayúscula se ve el error, y es porque no realice el manejo de error y para ello
modificamos la última parte.
getEmpleado(10).then(empleado=>{
console.log('Empleado de BD',empleado);

},(err)=>{
console.log(err);

});
Actividad
Convertir el siguiente código a promesas

Solución
let getSalario=(empleado)=>{
return new Promise((resolve,reject)=>{
let salarioDB=salarios.find(salario=>salario.id==empleado.id);
if(!salarioDB){
reject(`No se encontró el salario para el Usuario
${empleado.nombre}`);
}else{
resolve({
nombre:empleado.nombre,
salario: salarioDB.salario,
id: empleado.id
});
}
});
}
Ahora vamos a llamar la función
getEmpleado(4).then(empleado=>{
//console.log('Empleado de BD',empleado);
getSalario(empleado).then(res=>{
console.log(`El salario de ${res.nombre} es de ${res.salario}`);
})
},(err)=>{
console.log(err);

});
Pero si el empleado no tiene salario que pasa? Pues genera error
C:\Users\Ximena-Juliana\Dropbox\Cursos\Node.js\Curso Complementario>node
promesas
(node:6360) UnhandledPromiseRejectionWarning: No se encontró el salario para el
Usuario Juliana
(node:6360) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This
error originated either by throwing inside of an async function without a catch
block, or by rejecting a promise which was not handled with .catch(). (rejection
id: 2)
(node:6360) [DEP0018] DeprecationWarning: Unhandled promise rejections are
deprecated. In the future, promise rejections that are
not handled will terminate the Node.js process with a non-zero exit code.

Solucionemos el error
getEmpleado(4).then(empleado=>{
// console.log('Empleado de BD',empleado);
getSalario(empleado).then(res=>{
console.log(`El salario de ${res.nombre} es de ${res.salario}`);
}, (err)=>{
console.log(err);

})
},(err)=>{
console.log(err);

});
Si duplico la línea donde está el reject no se duplicaría la respuesta del mensaje
reject(`No se encontró el salario para el Usuario ${empleado.nombre}`);
reject(`No se encontró el salario para el Usuario ${empleado.nombre}`);
reject(`No se encontró el salario para el Usuario ${empleado.nombre}`);
reject(`No se encontró el salario para el Usuario ${empleado.nombre}`);
reject(`No se encontró el salario para el Usuario ${empleado.nombre}`);

Promesas en cadena
Esto se hace para que las sangrías no se tiren tanto a la derecha
Por ejemplo
getEmpleado(4).then(empleado=>{
// console.log('Empleado de BD',empleado);
getSalario(empleado).then(res=>{
console.log(`El salario de ${res.nombre} es de ${res.salario}`);
getSalario(empleado).then(res=>{
console.log(`El salario de ${res.nombre} es de ${res.salario}`);
getSalario(empleado).then(res=>{
console.log(`El salario de ${res.nombre} es de
${res.salario}`);
},(err)=>{
console.log(err);
Se solucionaría del a siguiente manera únicamente dejemos la getEmpleado y
encadenemos las promesas así
getEmpleado(4).then(empleado=>{
//esta función debe regresar otra promesa
return getSalario(empleado)
})
.then(res=>{
console.log(`El salario de ${res.nombre} es de ${res.salario}`);

})
.catch(err=>{
console.log(err);

})

Async- Await

Das könnte Ihnen auch gefallen