4.35 de 5
4.35
2129 valoraciones en Udemy

Desarrollo web con JavaScript, Angular, NodeJS y MongoDB

Aprende a desarrollar una webapp como Spotify usando el MEAN Stack (Node, MongoDB, Express, JWT y Angular 4, 5, 7, 8, 9)
Profesor:
Víctor Robles
8.254 Estudiantes apuntados
Spanish [Auto-generated]
Desarrollar aplicaciones web con el MEAN Stack 2.0
Dominar Angular
Crear APIs RESTful con NodeJS
Crear webapps SPA con Angular
Hacer desarrollos full-stack completos
Usar JWT para hacer sistemas de login
Aumentar las posibilidades laborales como programador

Bienvenido al curso Desarrollo web con JavaScript, Angular, NodeJS y MongoDB. Vas a aprender paso a paso como desarrollar servicios y APIs REST con NodeJS, Express, MongoDB, JWT y como crear aplicaciones web front-end complejas con la nueva versión de AngularJS (Angular 2, 4, 5, 6, 7, 8 y 9).

En resumen vamos a aprender a hacer un desarrollo fullstack con el MEAN Stack 2.0, creando paso a paso una aplicación web similar a Spotify.

  • NodeJS es una tecnología que nos permite hacer desarrollos back-end usando únicamente JavaScript.
  • MongoDB es la base de datos NoSQL líder. Nos permite trabajar con documentos JSON binarios (BSON) en lugar de utilizar un sistema clásico de tablas y relaciones, lo cual hace que Mongo sea muy veloz.
  • Angular se está convirtiendo en el framework para JavaScript estándar para desarrollar aplicaciones web modernas y escalables en el lado del cliente basadas en la filosofía SPA.

Si quieres ser desarrollador front-end, back-end o full-stack, o incluso si ya te dedicas al desarrollo web, es casi obligatorio aprender a trabajar con estas tecnologías y frameworks.

El curso está divido en dos partes:

  1. En la primera parte nos dedicaremos al backend (servidor) y desarrollaremos un servicio o API REST con NodeJS.
    Un API REST es un servicio que puede usarse desde cualquier dispositivo que entienda el protocolo HTTP, además interactúa directamente con la base de datos. Por ejemplo, las aplicaciones de smartphones interactúan con el servidor a través de un API RESTful.
  2. En la segunda parte nos centraremos en el frontend (cliente) y desarrollaremos una aplicación web de tipo SPA con Angular.
    Una web SPA es una aplicación de una sola página en la que la carga de datos es asíncrona y la página no se recarga en casi ningún momento, pese a cambiar de ruta o url para navegar entre las secciones de la aplicación, es una nueva tendencia en el desarrollo web.

Al finalizar el curso serás capaz de desarrollar tus propias aplicaciones web con NodeJS, Express, Mongo DB, JWT y Angular.

Durante las más de 15 horas del curso verás como desarrollar una plataforma web tipo Spotify paso a paso.

En esta aplicación podremos identificarnos mediante un formulario de login, registrarnos en la plataforma, modificar los datos de nuestro usuario, subir una imagen de perfil, crear, editar y subir artistas, álbumes y artistas a la web. Tendremos un listado paginado de los artistas de la plataforma, catálogo de álbumes, player de canciones y mucho más.

Abordaremos el desarrollo backend de esta aplicación partiendo desde cero, empezando por el diseño y creación de la base de datos, el servicio REST, servicios, controladores, autenticación basada en tokens con JWT (JSON Web Tokens). Interacción con la base de datos con Mongoose, CRUD de usuarios, artistas, álbumes y videos en NodeJS.

Continuaremos programando la parte del cliente con Angular, desde la creación de los componentes necesarios, uso de rutas y servicios, consumo de servicios REST (mediante un API Rest programada en con Node y ExpressJS) con el componente HTTP de Angular, trabajo con el LocalStorage, hasta la creación y validación de formularios, entre otras cosas.

Trataremos todos los temas paso a paso y poco a poco hasta construir una aplicación web completa de vídeos tipo Spotify. Pese a esto, para aprovechar al 100% el curso te recomendamos tener conocimientos en HTML, CSS  y JavaScript y además tener unas nociones básicas en el MEAN Stack.

A parte de esto, en los cursos de Víctor Robles conseguirás soporte, apoyo y ayuda muy rápida para que puedas conseguir tus objetivos y resolver tus dudas.

Si quieres aprender desarrollo full-stack moderno con JavaScript sin dolor, practicando poco a poco con las tecnologías y frameworks más actuales, subir de nivel en el desarrollo web con NodeJS y Angular y aumentar tus oportunidades laborales ¡Este es tu curso!

Échale un vistazo al programa del curso para ver todos temas que aprenderás.

Únete al curso y sube de nivel: ¡¡ Aprende Desarrollo web con JavaScript, Angular, NodeJS y MongoDB !!

Introducción

1
Introducción al curso

Introducción al curso Desarrollo web con Javascript, Angular, Node.js y MongoDB.

2
¿Que vamos a desarrollar en el curso? - Mini Spotify

Veremos que es lo que vamos a desarrollar en el curso, en este curso de NodeJS, Angular 2, JWT, MongoDB y ExpressJS vamos a crear una aplicación web similar a Spotify paso a paso.

El entorno de desarrollo y primeros pasos

1
Instalar NodeJS

Instalaremos Node.js paso a paso.

2
Instalar MongoDB

Instalaremos el Mongo DB para hacer basaes de datos no SQL.

3
Diseño de la base de datos

Diseñaremos la base de datos que vamos a utilizar durante el desarrollo de la aplicación tipo Spotify que vamos a crear.

4
Instalar terminal de comandos

Instalaremos una terminal de comandos para nuestro sistema operativo.

5
Crear el proyecto

Crearemos el proyecto en nuestro editor de código o IDE.

6
Crear alias en la terminal

Crearemos un comando(alias) para trabajar más eficientemente con la consola de comandos.

Empezando a desarrollar el API RESTful con NodeJS (back-end)

1
Instalar dependencias

Instalaremos las librerías, paquetes, módulos y dependencias que usaremos en nuestro backend de Node.js

2
Como desinstalar una dependencia

Aprenderemos a desinstalar dependencias con npm.

3
Crear la base de datos

Crearemos la base de datos que usaremos en el proyecto.

4
Conexión a la base de datos

Aprenderemos a conectar la base de datos con Mongoose y NodeJS

5
Crear el servidor web

Crearemos un servidor HTTP con NodeJS y ExpressJS

6
El modelo de usuario

Crearemos el modelo para la entidad de Usuario.

7
Crear los modelos

Crearemos los modelos de datos de las diferentes entidades de la base de datos.

8
Quitar aviso de Mongoose Promise de la consola

Controlador de usuarios y login con tokens (JWT)

1
Crear controlador de usuarios, acción y ruta

Crearemos el controlador para los usuarios.

2
Acción de registro de usuarios

Crearemos un método para registrar usuarios en la base de datos.

3
Método para el login

Crearemos una acción para el login de usuarios usando JWT

4
Crear servicio para JWT

Crearemos un servicio para trabajar con los tokens de JWT

5
Middleware de autenticación (JWT)

Crearemos un middleware para aplicar seguridad a las rutas de la aplicación

6
Actualizar un usuario

Crearemos un método en el controlador para actualizar la información de los usuarios.

7
Subir el avatar del usuario

Crearemos una acción el controlador para subir la imagen del usuario registrado.

8
Conseguir la imagen del usuario

Controlador de Artista

1
Crear el controlador y las rutas

Crearemos el controlador y las rutas para la entidad de artista.

2
Crear un artista

Crearemos una acción para guardar un documento de tipo artista en la base de datos de MongoDB usando NodeJS y Mongoose.

3
Conseguir un artista

Devolveremos un artista de la base de datos creando un método en el controlador de artista.

4
Listado de artistas paginado

Crearemos un método que nos devolverá los artistas de la base de datos y crearemos una paginación.

5
Actualizar artistas

Haremos un update de los artistas creando un método en el controlador y una ruta.

6
Eliminar un artista

Crearemos un nuevo método para poder eliminar artistas de la base de datos.

7
Métodos las imágenes del artista

Crearemos una acción que nos permitirá subir imágenes para los artistas.

Controlador de Album

1
Controlador y conseguir un album

Crearemos un controlador, rutas y acciones para los albums

2
Guardar un album

Crearemos una acción para crear albums en base de datos.

3
Devolver un album

Crearemos un método en el controlador para conseguir un album de la base de datos de Mongo.

4
Mostrar albums

Crearemos un método para devolver los albums.

5
Actualizar albums

Crearemos métodos y rutas en NodeJS para actualizar documentos de tipo album de la bbdd de MongoDB

6
Borrar albums

Haremos una acción que nos permita borrar albums de la aplicación

7
Métodos para las imágenes de albums

Crearemos un método para subir imágenes y otro para devolverlas, también usaremos las rutas de express, etc.

Controlador de Canción

1
Controlador de canciones y rutas
2
Acción para crear canciones dentro de un album

Crearemos una acción para guardar canciones con nuestra api restful

3
Conseguir una canción

Crearemos un método para mostrar una canción.

4
Listar canciones

Listaremos las canciones de la base de datos y las devolveremos en json

5
Actualizar canciones

Crearemos un método que nos permitirá actualizar las canciones de la bbdd.

6
Eliminar una canción

Crearemos una acción en el controlador que nos permita eliminar canciones de la aplicación.

7
Subir ficheros de audio

Crearemos una acción que nos permitirá subir ficheros de audio mp3 al servidor y asociarlos a un documento de tipo canción de la base de datos.

Configuraciones finales del backend (NodeJS, Express, MongoDB, JWT)

1
Configurar cabeceras (CORS)

Configuraremos las cabeceras del servidor para evitar errores con el CORS y el control de recursos compartidos entre dominios.

2
Devolver la imagen recién subida del usuario

Mejoras en el método de getImage del controlador de usuarios.

Empezando a desarrollar el frontend SPA con Angular

1
Directorios del proyecto

Crearemos la estructura de carpetas necesaria para empezar a trabajar en el cliente con Angular 2

2
Angular CLI

Aprenderemos a usar la herramienta Angular CLI

3
Instalar Angular

Instalar Angular (AngularJS, Angular 2, Angular 4) desde cero con Angular CLI

4
Incluir assets, Bootstrap y jQuery

Incluiremos los assets del proyecto

5
Crear modelos de datos

Crearemos las entidades que vamos a usar en el front de Angular.

6
Componente principal y vistas

Crearemos el componente principal app.component.ts y la vista para el login y el registro.

Login y registro en el frontend

1
Crear formularios de login y registro

Crearemos la vista de login y registro y los formularios correspondientes en Angular 2 (AngularJS 2)

2
Two-way data binding en formularios

Recibiremos los datos de los formularios de login y registro jwt

3
Crear servicios

Crearemos un servicio en Angular para los usuarios y otro para las configuraciones globales de la webapp.

4
Operator map
5
rxjs/Observable
6
Método login en el servicio de usuarios

Crearemos un método para realizar las peticiones ajax al api rest con nodejs para hacer el login.

7
Llamadas al servicio para identificar al usuario

Usaremos el servicio de usuario para hacer el login.

8
Persistir el login con localStorage

Persistir la información del usuario logueado en Angular 2 con LocalStorage y JWT

9
Cerrar sesión en el cliente

Cerrar la sesión del front-end.

10
Formulario y recepción de datos para el registro

Crearemos el formulario y recibiremos los datos del mismo en el componente para posteriormente guardar los datos del usuario en la base de datos.

11
Métodos en el servicio y registrar usuarios

Acabaremos la funcionalidad de registro de usuarios.

12
Mejoras en el logueo

Haremos mejoras en el flujo de funcionamiento del login

Configuración del usuario

1
Método para actualizar el usuario en el servicio

Crearemos un método para actualizar el usuario en el servicio y haremos una petición ajax al api rest.

2
Componente para la sección de mis datos

Crearemos el componente para la página de configuración del usuario

3
Crear menú de navegación

Crearemos un menú de navegación con Angular 2

4
Configurar el routing

Configuraremos el sistema de rutas de Angular

5
Formulario de actualización del usuario

Crearemos el formulario para hacer el update de  los datos del usuario identificado.

6
Actualizar los datos usuario

Modificaremos los datos del usuario en el front-end y en el back.end.

7
Adaptar formulario para subir imágenes

Crearemos un campo para subir ficheros en el formulario.

8
Subir el avatar del usuario

Subiremos ficheros de imagen para el avatar del usuario 

9
Actualizar imágenes de usario

Mostraremos las imágenes del usuario en toda la aplicación web con Angular.

10
Maquetar barra lateral

Los artistas

1
Componente para el listado de artistas

Crearemos un componente para listar artistas.

2
Marcar elementos del menú con Angular 2

Veremos como marcar elementos del menú con Angular 2

3
Mostrar el botón de añadir artista

Mostraremos un botón para poder entrar a una página de añadir artistas.

4
Página Home

Crearemos una página de inicio.

5
Componente y formulario de añadir artista

Crearemos un componente y un formulario en Angular 2 para añadir artistas a la web.

6
Servicio para Artistas

Crearemos un servicio de Angular 2 para la entidad de Artista

7
Crear artista

Haremos las funcionalidades necesarias para crear artistas en la webapp.

8
Componente para editar artista

Crearemos un componente para editar o actualizar los artistas.

9
Métodos en el servicio de artista

Crearemos los métodos necesarios en el servicio de artista.

10
Ruta y cargar datos en el formulario de editar artistas

Crearemos rutas, componentes y cargaremos los datos del formulario de editar artistas.

11
Editar los datos del artista

Llamaremos al servicio para editar los usuarios

12
Subir imagen del artista

Crearemos un srevicio de subida de imágenes y haremos la funcionalidad para subir la imagen del artista.

13
Restringir acceso

Restringiremos el acceso a ciertas zonas de la webapp dependiendo del rol del usuario.

You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.4
4.4 de 5
Calificaciones 2129

Calificación Detallada

5 estrellas
1058
4 estrellas
735
3 estrellas
246
2 estrellas
50
1 estrellas
40
922b0b6b440c1df088ac2e0970697f4e
DEBES ESTAR REGISTRADO PARA ACCEDER AL CURSO

Contenido

17 horas de video online
6 Articulos
Acceso sin limites
Acceso desde Móvil y Smart TV
Certificado de finalización

Newsletter

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos. Al hacer clic en el botón Aceptar, aceptas el uso de estas tecnologías y el procesamiento de sus datos para estos propósitos. Ver
Privacidad