Bienvenida e Introducción

1

Bienvenida y Presentación del proyecto: PlatziRooms

2

Creación y configuración inicial del proyecto utilizando VUE CLI 3

3

Boilerplate y Limpieza del proyecto

Render Functions y JSX

4

¿Que son las Render Functions y JSX?

5

Preparando nuestro entorno para un prototipo

6

Creación de un componente con createElement

7

Utilizando JSX para la creación de un componente

8

Utilizando Slots con Render Functions y JSX

9

Creando un Modal de Login para PlatziRooms

10

Creando la lógica general de nuestros modales con Vuex

11

Creando el contenido de nuestro modal

Componentes controlados y uso de librerías externas

12

Componentes Controlados y Variables Personalizadas

13

Construcción del componente de Recordar Contraseña

14

Creación de un componente Slider utilizando la librería tiny-slider

High Order Functions

15

¿Qué son las High Order Functions? - Crea tu primera HOF

16

Vuex

17

Obtener datos usando Vuex

18

Crea un getter dinámico en Vuex utilizando HOF

19

Creación de la vista para creación de publicaciones

20

Agregando datos con Vuex

Base de datos en tiempo real con Firebase

21

Instalación y Configuracion de Firebase Realtime Database

22

Obteniendo los datos desde Firebase Realtime Database

23

Agregando la consulta de usuarios

24

Almacenando nuevas publicaciones en Firebase Realtime Database

25

Perfeccionando el flujo de navegación de nuestra App

Autenticación con Firebase

26

Configuracion Inicial para trabajar con Firebase Authentication

27

Agregando nuevos usuarios en firebase autentication

28

Inicio de sesión de usuario

29

Cierre de sesión de usuario

30

Protegiendo páginas utilizando Navigation Guards

Scoped Slots

31

¿Qué son los Scoped Slots? Dónde utilizarlos y por qué

32

Integración de Scoped Slots en Platzi Rooms

Deploy

33

Creando y desplegando nuestra app en Heroku

34

Conclusiones y Despedida

Crea una cuenta o inicia sesión

¡Continúa aprendiendo sin ningún costo! Únete y comienza a potenciar tu carrera

Boilerplate y Limpieza del proyecto

3/34
Recursos

Aportes 19

Preguntas 3

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Notas de la clase:

  • App.vue => Aquí está nuestra aplicación, la UI que se repite sin importar la ruta: mensajes bonitos, enlaces a otras vistas, el componente <router-view /> para renderizar cada vista cuando sea necesario, etc.
  • router.js => Pos el vue-router; el archivo de nuestro proyecto con las conexiones y definiciones de todas las partes de la aplicación.
  • views/cualquier-cosa.vue => Las vistas de cada ruta que solo funcionan si las importas desde el router. Ex. Home.vue, About.vue, Careers.vue, etc.
  • components/cualquier-cosa.vue => Cada componente o bloque de lego de la aplicación. Ex. Menu, Footer, Sidebar, Card, etc.
  • store.js => Vuex.

Explicas cómo dejar un proyecto “limpio” y usar un boilerplate que nos brindas, pero no dejas en claro que son distintas opciones o formas para hacer el proyecto, dejas confundido a uno cuando hace todo eso y luego pides que nos descarguemos el archivo.

Todo el problema es que cambió la versión de Tailwind y ahora no utiliza la que aparece aqui. Es buena idea cuando hagan este curso correr el ocmando npm run install --save-exact

Si ibas a poner un “boilerplarte” para que hiccimos toooda la configuracion anterior y limpieza de codigo si al final de cuentas eso no se va a usar??!!

Personalmente me gusta crear todo el código desde cero incluso si es solo CSS y HTML básico, de lo contrario siento que me estoy perdiendo parte del curso.
Seria genial que agregaran siempre los vídeos de dicha parte “Básica” como una sección que cada quien sea libre de tomar o simplemente saltar y descargar todo el código base.

La configuración de Airbnb es más estricta, recomiendo usar el comando:

npm run lint

Para reparar cualquier error de linteo

Jajjaja WTF, yo todo concentrado, y cuando me sale que tengo que instalar el otro repo jajajajaja

Hago la misma pregunta que los demàs ¿Porque la configuración y explicaciones si no se iba a ocupar?

como en comentarios anteriores, esta mal pensado en enseñarnos hacer una configuracion si no la vamos a usar.

Cual es la finalidad de importar una librería como tailwind.css desde webpack, si se puede hacer via link.
Ventajas, desventajas.?
Observo mucha configuración.
¿Que alguien me explique?

Se me hizo súper rara está clase toda la configuración de la anterior para nada

El proyecto se ve genial!!. Saludos al maestro!

y el boilerplate?

Tengo problemas para instalar esta librería. me muestra un error con circular-json, no sé donde se encuentra eso y porqué está pasando

¿Gente alguien sabe por que ocurre este error? Ayuda pls
https://drive.google.com/file/d/1lJuWHKxKuIwmKTMFE4FPfbRnc4rht8Ej/view?usp=sharing

La verdad nunca me ha gustado que saquen cosas y las pasen así, o si lo hacen bien, por ejemplo dejar en un GitHub Gist lo que se debe copiar y pegar, pero todo?

Donde se encuentra el proyecto …
Descargue el de Archivos y Enlaces y ya se encuentra desarrollado el proyecto.

pensaran en actualizarlo??