Scribd
Cargar
31 vistas

Curso Node

Cargado por

Samuel Contreras
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
31 vistas

Curso Node

Cargado por

Samuel Contreras
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 33

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

También podría gustarte