¿Qué es MEAN?
Clase 2 de 75 • Curso de MEAN 2017
Contenido del curso
El Frontend de PlatziOverflow
- 3

Introducción a Angular y TypeScript
10:14 min - 4

Instalación y configuración del entorno
09:02 min - 5

Trabajando con Angular Material
11:14 min - 6

Construcción del header de la aplicación
08:34 min - 7

Detalles de preguntas para el proyecto
07:21 min - 8

Construcción de pantalla de detalle de una pregunta
09:35 min - 9

Estilo en la pantalla de detalle de una pregunta
06:34 min - 10

Incorporando angular2-moment al proyecto
04:05 min - 11

Agregando el listado de respuestas a la pantalla de detalle
07:24 min - 12

Agregando un formulario para respuestas
12:18 min - 13

Dando estilo al formulario de preguntas
07:12 min - 14

Corrigiendo estilos en el formulario y toques finales
06:31 min - 15

Cómo mostrar las respuestas en el listado
10:28 min - 16

Empezando la pantalla de signin
06:23 min - 17

Creando el formulario de signin
11:43 min - 18

Dando estilo al formulario de signin
03:06 min - 19

Creando la pantalla para el listado de preguntas
04:23 min - 20

Creando el componente para los listados de preguntas
11:42 min - 21

Crear la pantalla para cargar una nueva pregunta
05:42 min - 22

Crear formulario de carga de nueva pregunta
05:13 min - 23

Agregando iconos al formulario de preguntas
10:51 min - 24

Agregando un icono genérico al formulario de preguntas
02:51 min - 25

Seleccionando un icono para la pregunta
03:47 min - 26

Conectando nuestras pantallas con el router de Angular
09:46 min - 27

Conectando la pantalla de registro con la de login
03:38 min - 28

Conectando el listado de preguntas con la pantalla del detalle
07:17 min - 29

Conectando el listado de preguntas con el formulario de creación
05:45 min
El Backend de PlatziOverflow
- 30

Introducción a Node.js y Express
14:09 min - 31

Express
12:26 min - 32

Instalación y configuración del entorno de desarrollo de Backend con Babel
10:20 min - 33

Instalación y primeros pasos con Express
06:55 min - 34

Creando un endpoint en la API para servir preguntas al cliente
09:48 min - 35

Creando el servicio de preguntas
10:48 min - 36

Completando el servicio de preguntas
04:14 min - 37

Conectando el Frontend de preguntas con nuestro Backend
10:22 min - 38

Agregando un spinner para la carga de preguntas
04:25 min - 39

Obteniendo el detalle de una pregunta desde el Backend
08:53 min - 40

DESAFIO: Contruye el spinner del detalle de la pregunta
01:08 min - 41

Agregando una ruta para crear una pregunta en el Backend
09:25 min - 42

Agregando el método para crear preguntas en el QuestionService
06:07 min - 43

Enviando una pregunta hacia el Backend
06:00 min - 44

Agregando una ruta para crear una respuesta en el Backend
06:53 min - 45

Agregando el método para crear respuestas en el QuestionService
02:38 min - 46

Enviando una respuesta hacia el Backend
10:27 min - 47

Creando la ruta de signin en el Backend
09:55 min - 48

Creando un JSON web token para el usuario autenticado
05:26 min - 49

Escribiendo nuestro servicio de autenticación
11:44 min - 50

Conectando el signin con el Backend
07:28 min - 51

Agregando el logout de usuarios a PlatziOverflow
10:21 min - 52

Creando la ruta de signup en el backend
05:37 min - 53

Conectando el signup de usuarios con el Backend
06:07 min - 54

Qué son y Cómo funcionan los Middlewares
05:19 min - 55

Organizando los middlewares del Backend
14:02 min - 56

Autorizando usuarios para que puedan crear preguntas
10:03 min - 57

Manejar el error del signin
13:02 min
La Base de Datos de PlatziOverflow
- 58

Creando el modelo de respuesta
06:11 min - 59

Creando el modelo de usuario
03:40 min - 60

Creando el modelo de pregunta
05:30 min - 61

Estableciendo la conexión con la base de datos
08:44 min - 62

Obteniendo todas las preguntas de la base de datos
08:36 min - 63

Obteniendo una pregunta de la base de datos
06:30 min - 64

Conectando el signup con la base de datos
05:28 min - 65

Encriptando la contraseña del usuario
03:25 min - 66

Conectando el signin con la base de datos
02:00 min - 67

Guardando una pregunta en la base de datos
05:56 min - 68

Guardando una respuesta en la base de datos
10:45 min - 69

Ordenando las preguntas en la home
13:40 min
Despliegue a producción
- 70

¿Cómo vamos a hacer el deploy?
06:39 min - 71

Configurando nuestra app para el entorno productivo
09:39 min - 72

Creando el build para producción de nuestro Frontend
06:13 min - 73

Creando el build para producción de nuestro Backend
17:10 min - 74

Cómo enfrentar un proyecto MEAN de aquí en más
02:34 min - 75

Qué aprendimos durante el curso de MEAN
02:02 min
Contenido Bonus
¿Qué es MEAN?
Un stack de desarrollo es como tu caja de herramientas. Es el conjunto de tecnologías que usamos para desarrollar un proyecto, ya sea una aplicación web, una app para dispositivos móviles o lo que te propongas crear.
Para construir una aplicación web, por ejemplo, podemos usar Backbone o React para nuestro frontend y Node, PHP o Rails para el backend. Podemos correr nuestro código dentro de una máquina virtual como Vagrant o desarrollar directamente en nuestra computadora hay muchas opciones y puedes combinarlas como quieras, claro, algunas combinaciones representan mejor performance en tus aplicaciones, hay combinaciones bien conocidas y bien probadas y que tienen buen comportamiento como MEAN.
MEAN es uno de los Stacks tecnológicos más utilizados para crear Single Page Applications:
MongoDb para la base de datos
Express como framework backend corriendo en Node.js
Y Angular para el frontend
Estas tecnologías son muy sencillas de combinar: todo está escrito en JavaScript, incluso la base de datos guarda colecciones con objetos en JSON.
Node.js es nuestro servidor web, encargado de escuchar las peticiones de los usuarios y responderle con los datos que requieran.
-
Configurar sus rutas
-
Proteger los recursos
-
Servir archivos estáticos
Express es el micro-framework que nos hará la vida mucho más fácil permitiéndonos ahorrar tiempo y líneas de código. A su vez nos brinda la libertad para que organicemos los archivos y usemos los módulos que necesitamos para nuestro proyecto.
En este punto es importante que hablemos de persistencia de datos. MongoDb es una de las bases de datos NoSQL más utilizadas hoy en día. Nos permite almacenar objetos en formato JSON sin un esquema de datos rígido, como en las de datos relacionales. Desde Express le pediremos datos a la base de datos, quien nos responderá a nuestras consultas.
Pero todo esto no tiene sentido si los usuarios no pueden acceder a nuestra aplicación visualmente: Angular es la herramienta de nuestra caja que completa el stack. Es uno de los frameworks más populares, cuenta con una de las comunidades más grandes y activas en el desarrollo frontend.
Con Angular podemos crear componentes visuales y reutilizables en todo nuestro proyecto o incluso en otros proyectos. Desarrollar servicios inyectables en estos componentes para comunicarnos con el backend haciendo solicitudes de datos y recibiendo las respuestas.
MEAN es un stack para desarrollo de SPA muy sencillo y divertido de aprender, asi que te invito a continuar con el curso, si tienes dudas o haces desarrollos increibles por favor compartelo con tus compañeros en el sistema de discusiones.