Curso Node.
js
La consola devuelve lo que puse en el codigo javascritp usando node js
Forteach: Foreach es un bloque constructivo de los lenguajes de programación para
recorrer los elementos de una colección.
EXPORTACIONES
El module.export es para exportar un comando que esta en otra archivo .js en uno
determinado solo con llamarlo
A su vez para llamar mas de 2 constantes seria de la siguiente manera
Packge.json
Es importante este paquete.json porque ahí estarán las descripciones de nuestro proyecto…
definición
Se nos creará un archivo el cual tendrá información sobre nuestro
proyecto, lo más relevante en estos momentos serán sus dependencias
y scripts
Para ir agregándole paquetes a .json se utilizara el siguiente comando para que aparezca las
dependencias
npm i cowsay
La misma creo un paquete llamado cowsay que si agregamos este código en app.js y lo
ejecutamos en la consola saldría esto
PREPARACION PARA EL SERVIDOR
Para continuar con el servidor se debe conocer la diferencia entre var, let, const
Var : es una variable que se puede repetir y cambiar el valor
Let: no se puede repetir pues sale un aviso en caso de repetición ejemplo:
let carro = 1
let carro= 2… saldría error
conts : es una constante que no puede cambiar ni ser modificada
………………………………………………………………………………………………………………………………………..
FUNCIONES SENCILLAS
Función normal y abajo la nueva función de flecha
Otro ejemplo mas de escribir
Se ve la suma de los parametros con la nueva funcion
Ahora de una manera mas resumida
Ejemplo con nombre
Lo siguiente es algo muy util ya que declara que en caso de que el usuario no coloque un
resultado le mostrara un resultado que uno le quiera mostrar en este caso al no colocarle un
valor numerico se le sumara un numero 1 y por eso dara 4…. Podria ponerse un mensaje que
diga,, debe colocar un numero…
……………………………………………………………………………………………………………………
Template string es codigo mas avanzado de javascritp…..
Las comillas que se utilizan son comillas invertidas
Otro ejemplo
…………………………………………………………………………………………………………………………………….
Objetos
Aquí es un como declarar una variable o constante que tenga 1 o mas propiedades
También se mostrara como ver una propiedad espesifica de ese objeto
………………………………………………………………………………………………………………………………..
Destructuring Objects
Es para llamar a una o mas propiedades dentro de un objeto de manera mas
eficaz usando llaves de la siguiente manera
…………………………………………………………………………………………………………………………………………………
OBJETOS DENTRO DE OBJETOS
Se puede ver como se colocan objetos dentro de objetos y como poder visualizarlos
Ahora un ejemplo de cómo guardaríamos el enlace de youtube en una constante y como
visualizarla
Ahora una manera mas resumida usando las comillas invertidas de Destructuring Objects
…………………………………………………………………………………………………………………………………………………
FETCH
Es para leer API…. Sirve también para otras cosas
Se utiliza el fetch para pegar el link donde esta la api que es un .json…… el primer .then es para
eviar esa respuesta en forma de .json y el segundo .then lo envía a la consola
Una manera mas ordenada de llamarlo seria
…………………………………………………………………………………………………………………………………………..
Async & Await
Es una alternativa de usar fetch
MAP()
Crea un array con los resultados de la llamada función indicada aplicados en cada uno
de sus elementos
Un ejemplo
Aquí puedo ver los resultados de los nombres usando el .map y guardándolo en una constante
……………………………………………………………………………………………………………………………………………….
Filter
Crea un nuevo array con todos los elementos que cumplan la condición implementada
por la función dada
Aquí se esta remplazando el .map por .filter y lo que esta haciendo es mostrando el resultado
que sta entre comillas
Aquí quiere decir que si existiera una propiedad llamada poder filtraría todos los pokemones
que tengan el poder mayor a 5
Ahora esta seria la manera de que en caso no queramos un resultado… aquí quiere decir que
no quiere ningún pokemon salga bulbazor por ello no aparece
HTTP SERVIDOR
Se creara un servidor con los siguientes comandos
Se puede ver que se guarda en un puerto y se puede enviar un mensaje con console.log que se
puede apreciar en la web
Es importante saber que si se quiere hacer un cambio que
aparezca en la web se debe hacer lo siguiente
Se escribe control + c en el terminal de visual studio y luego se
reinicia colocando node y el nombre del archivo
PARA AHORRAR TIEMPO EN REINICIAR EL SERVIDOR SE
INSTALARA EN LA CONSOLA CON EL SIGUIENTE COMANDO
NODEMON
npm install -g nodemon
Asi cada que guardemos se reiniciara el servidor
EXPRESS Importante para un servidor
INSTALAMOS EXPRESS CON EL COMANDO … npm i xpress
Lo siguiente es un ejemplo usando express
App.listen en una funcion de flecha lo que hace es diciendo que se utilizara ese puerto para
enviar el mensaje
Se puede hacer otro app.get que vendria siendo otra pagina asi
Y para ir a esa pagina se colocaria localhost:3000/servicios
En lo siguiente se explica qu se debe crear una carpeta llamada publico porque ahí donde se
colocara todo lo que vera el usuario …. Se colocan unos comandos para poder llamar a esa
carpeta echa con HTML
El dirname hace alusion a la ruta de areas locales o el servidor osea las url
En el primer dirname solo nos mostrara la ruta de nuestra consola que usamos (se puede ver
en la terminal)….
Mas el segundo dinarme esta haciando alusion a la ruta de la carpeta public
AHORA LO SIGUIENTE
Se plantea que se hara el index en un nuevo archivo html… para que se pueda ver apenas se
entre al servidor… pero para que se pueda visualizar lo demas que seria el archivo 404 y la ruta
de servicios. Se debe colocar el archivo 404 al final de las rutas para que no genere ningun
error
AHORA lo siguiente despues de instalar con npm i ejs en la terminal
Se ha creado la carpeta views.. que es la carpeta de las vistas, y se ha borrado los archivos html
de la carpeta public…lo que hara esta es que las paginas se pondran en las vistas y se
exportaran a la carpeta publico para unirlas…
En el primer app.set esta diciendo que se usara EJS y en la segunda app.set dice a donde se
llevara eso que en este caso es la carpeta views
Asu vez el res.render esta redirigiendo lo que dice el titulo al index.ejs de la carpeta views con
este otro comando
Dice titulo en el medio porque asi lo llamamos anteriormente
Otro ejemplo
Se debe ver que se agrego el /servicios en la URL
Otro ejemplo de otro modo
Una manera de ahorrar codigo es la siguiente
Se creara una carpeta dentro de vistas que se llame template donde tendra un archivo ejs que
contenga solo la cabecera del html
Luego se copiara esa linea de comando para conectar todas las vistas que se le borro la
cabecera para que funcione de manera mas eficaz. Se debe eliminar todas las cabeceras y
copiar esa linea de comando. Y asi no generara ningun error
Descargar bootstrap
LO SIGUIENTE es descargar bootstrap en la carpeta public de nuestro proyecto y sacar el ccs y
js
Luego de eso para usar el css iremos a la cabezera a escribir el siguiente comando que
modificara las letras de la pagina
Navbar
SE CREO un navbar.ejs y se agrego un body en la cabezera Y SE QUITA EL BODY EN SERVICIOS Y
404
A SU VEZ SE AGREGO <%- include("template/footer") %> EN LA PAGINA 404 Y SERVICIOS
Ahora se ira a la pagina de bootrap y se copiara el código de navbar.. y se ira cambiando el
home a inicio y el link a servicio y se borrara lo subrayado al igual que el “disable”
Despues de instalar Heroku procedemos a cambiar
la configuracion de pack.json
Ahora crearemos un nuevo archivo para subir nuestro proyecto a la red. Pero ignorando la
carpeta node_modules
Ahora iremos a app.js para decirle a donde ira…
cambiando el puerto 3000
Una vez para hacer el cambio del puerto debemos poner en la terminal estos comandos de
nuevo
$ git add .
$ git commit -am "make it better"
$ git push heroku master
Asi es el resultado