Conocer y comprender cómo se realizan las conexiones hacia los servidores a través de internet y sus implicaciones en el desarrollo de servidores

1

Bienvenida y presentación del curso

2

Qué es Node y cómo instalarlo

3

¿Qué son y cómo se usan las peticiones HTTP?

4

Métodos, cabeceras y estados

5

Cuerpo y query de la petición

Crear un servidor HTTP en Javascript, y comenzar a escuchar y responder peticiones desde un cliente .

6

Crear un servidor HTTP desde NodeJS

7

¿Cómo pueden venir las peticiones?

8

Recibir información desde el cliente: Body y Query

9

Información contextual: Leer las cabeceras

10

Tipos de respuesta: Vacía, plana, con datos y estructurada

11

Respuestas coherentes

12

Servir archivos estáticos

13

Errores: Cómo presentarlos e implicaciones en la seguridad

Comprender y desarrollar la arquitectura básica de un backend en NodeJS, y comunicarse entre módulos

14

Conceptualmente: Rutas, controladores y bases de datos

15

Rutas y capa de red: Responsabilidades y límites

16

Controladores: Definiendo la lógica de negocio

17

Almacenando la información en una base de datos

Utilizar una base de datos para definir, modelar, almacenar y recuperar la información de nuestra aplicación

18

Tipos de Bases de Datos: Relacionales y No Relacionales

19

Crear y Configurar tu Base de Datos con MongoDB

20

MongoDB: Almacenar y leer datos

21

MongoDB: Actualizar datos

22

MongoDB: Consultar datos

23

MongoDB: Eliminar Datos

24

Gestionar conexiones a la base de datos desde la API

Uso de entidades para crear aplicaciones escalables

25

Escalando la arquitectura: Múltiples entidades

26

Relacionando nuestras entidades

27

Cómo recibir ficheros desde NodeJS

28

Guardar el fichero en el servidor

Conocer el protocolo de websockets, e implementar comunicación cliente/servidor con SocketIO.

29

WebSockets: Qué son, por qué son interesantes y cómo usarlos

30

Manejo de Websockets con NodeJS

31

Conectar la API al servidor de WebSockets

Revisión de lo aprendido, y próximos pasos

32

Revisión y próximos pasos

33

Tips para escalar nuestro proyecto

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Revisión y próximos pasos

32/33
Recursos

Aportes 37

Preguntas 15

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Para iniciar el frontend del Vue.js:

  • Descargar la carpeta del proyecto frontend desde “Archivos y Enlaces” de esta clase
  • En consola moverse al directorio del proyecto descargado (ES UN PROYECTO APARTE, no ponerlo en el directorio del proyecto de Node que hemos venido trabajando.
  • Una vez en el directorio leer el archivo README.md, aquí indica que hacer. Correrá los scripts definidos en package.json
    npm install
    npm run serve
    npm run build
    _
    Al hacer npm run serve iniciará el frontend en http:localhost:8080/
    _
    Correr el servidor del chat y recargar la página del frontend y listo!
    NOTA: asegurarse de instalar e iniciar el módulo cors en el backend del chat para que funcione

El curso genial, pero necesito un curso completo de websockets para entenderlo bien jejej

Para conectar el Frontend hay que seguir los siguiente pasos:

  • Descargar todos los archivos en la pestaña de Archivos y Enlaces.
  • Copiar y pegar todos los archivos (ojo hay archivos que en el explorador de archivos no aparecen como el .eslintrc.js asegurate de también copiarlos) a la carpeta public del proyecto de node.
  • Desde la consola estando en la carpeta general del proyecto de node, moverse a la carpeta public (cd public).
  • Ejecutar el comando: npm install (se instalaran todas las dependencias del proyecto).
  • Ejecuten el servidor que tienen de node: nodemon server.js (estando en la carpeta general del proyecto cd …).
  • Ejecutar el comando: npm run serve (correrá el proyecto en un servidor local en el puerto 8080).
  • En el navegador pongan http://localhost:8080/ y listo ahi podrán ver el front que muestran en el video funcionando!

Para la gente de React, cree un frontend que utiliza esta API. Pueden descargarlo de mi github y dejarme una estrellita. Tambien pueden cambiarlo como gusten y comentar sugerencias!

Leyendo los comentarios y resumiendo la información faltante:

Descargar la carpeta que está en Archivos y enlaces
Descomprimir
Por consola entrar a esa carpeta
ejecutar:
npm install
npm run serve
npm run serve --fix
npm run build
Debería crear una carpeta dist, entrar y copiar los archivos
Pegarlos en la carpeta public de nuestro proyecto
Listo!
nodemon server

Les presento los retos que propone socketio:

- Broadcast a message to connected users when someone connects or disconnects.
- Add support for nicknames.
- Don’t send the same message to the user that sent it. Instead, append the message directly a soon as he/she presses enter.
- Add “{user} is typing” functionality.
- Show who’s online.
- Add private messaging.

Yo hice el front con React, aquí les dejo mi Github por si quieren darme estrellita y hacerme sugerencias 😄, también desplegué la aplicación en Heroku por si quieren probarla!



Cuando envio un mensaje desde insomnia, no llega al instante a la app de Vue, toca recargar, why?

2021 Seguimos sin poder implementar el frontend que el profe proporcionó, pero bueno, no por eso dejen de hacer su propio frontend

Al correr npm install me da el siguiente error:

npm ERR! code ENOTFOUND
npm ERR! syscall getaddrinfo
npm ERR! errno ENOTFOUND
npm ERR! network request to http://npm.fintonic.com:4873/yorkie/-/yorkie-2.0.0.tgz failed, reason: getaddrinfo ENOTFOUND npm.fintonic.com
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly.  See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Anderson\AppData\Local\npm-cache\_logs\2021-03-19T21_50_31_855Z-debug.log

¿Que debo hacer?

Todo bien hasta esta clase

Hola, existe alguna documentación para entender como puedo integrar el frontend de Vue en esta clase con el proyecto de Node que llevamos por a parte

Teniendo dos clientes abiertos, y en un mismo chat, lo que escribo en el cliente 1 no se ve en tiempo real en el cliente 2.

¿Como hago para que esto pase?

El frontend esta perfecto para realizar las pruebas de lo que se estuvo trabajando, pero soy el unico al que no le funciona el socket para mostrar los mensajes en la vista de chat ?

Desde mi cliente REST envio mensajes pero no se muestran en tiempo real

Me ha encantado el curso, pero siuento que necesito retomarlo para afianzar muchas cosaas! Muchas gracias

Algo que me hubiese gustado fuera implementar un login con twj

el frontend no tiene ningna escucha de los mensajes que emite el socket desde el back, no esta en ninguna parte del codigo de vue. Les falto esa pequeña GRAN cosa.

en esta clase faltó mayor explicación de como instalar vuejs en el proyecto

Excelente curso!!!

genial el curso !!!

tremendo curso!

quedó increíble el curso

Cuando añado cors al proyecto se me queda el navegador como recargando y no funciona nada… a alguien más le pasa?

Excelente curso gracias

Muy buen curso.

Muy buen curso, fácil de entender!!

No comprendo el funcionamiento, se supone que debería haber un websocket cuando abro el frontend, en la versióon compilada para producción no veo ningun websocket en la red y al correr npm run serve si se muestran websockets pero son los que vue crea para recargar la pagina cuando se modifica el código, no veo los websockets funcionando en el frontend, alguién me puede explicar esto?

Excelente curso, aunque me perdí un poco con websockets, hay que repasar. gracias

Perfecto

alguien le salio este error en la consola al ejecutar
npm run server


These dependencies were not found:

* core-js/modules/es.array.concat in ./src/store/modules/messages.js, ./src/store/modules/chat.js
* core-js/modules/es.array.for-each in ./src/store/modules/messages.js, ./src/store/modules/chat.js and 1 other
* core-js/modules/es.object.to-string in ./src/router.js
* core-js/modules/web.dom-collections.for-each in ./src/store/modules/messages.js, ./src/store/modules/chat.js
and 1 other

To install them, you can run: npm install --save core-js/modules/es.array.concat core-js/modules/es.array.for-each core-js/modules/es.object.to-string core-js/modules/web.dom-collections.for-each

ya probe con el siguiente comando y nada sigue el error

npm install core-js

tambien con lo que sugiere

npm install --save core-js/modules/es.array.concat core-js/modules/es.array.for-each core-js/modules/es.object.to-string core-js/modules/web.dom-collections.for-each

y me da el siguiente error

npm ERR! code ENOLOCAL
npm ERR! Could not install from "core-js\modules\es.array.concat" as it does not contain a package.json file.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\User\AppData\Roaming\npm-cache\_logs\2020-05-15T20_53_23_498Z-debug.log

tengo node 12.16.2

Gran curso ahora a practicar todo lo aprendido para tener el stack de MEAN controlado ❤️

excelente curso, se nota la experiencia en el desarrollo

Este curso es increíble, me encanto al 1000%

Tremendo curso! Felicitaciones!

Para hacer que funcionara el frontend con los endpoints del curso me toco modificar un poco el código en vue ya que al enviar un mensaje el usuario no se guardaba en mongo, lo dejo como observación para los que tienen el mismo problema. Les comparto también la modificación que hice.
.
En el archivo views>Messages.vue dentro del método sendMessage cambie la siguiente línea:

user: this.$store.state.user.selected

por esta:

user: this.$store.state.user.selected._id

Y en el chat para que se visualizarán los nombres del usuario que los envió cambie el siguiente código:

<div class="messages">
     <div v-for="message in $store.state.messages.list">
       {{ message.user.name }} : <-aqui hice el cambio
       {{ message.message }}
     </div>
</div>

Reemplace la línea mencionada arriba por lo siguiente:

{{ message.user[0].name }}

😃

Genial el curso, próximo reto, crear el frontend con React e implementar el backend del curso!