También pueden crear un proyecto Vue con su interfaz gráfica ejecutando el comando:
vue ui
Bienvenida e Introducción
Bienvenida y Presentación del proyecto: PlatziRooms
Creación y configuración inicial del proyecto utilizando VUE CLI 3
Boilerplate y Limpieza del proyecto
Render Functions y JSX
¿Que son las Render Functions y JSX?
Preparando nuestro entorno para un prototipo
Creación de un componente con createElement
Utilizando JSX para la creación de un componente
Utilizando Slots con Render Functions y JSX
Creando un Modal de Login para PlatziRooms
Creando la lógica general de nuestros modales con Vuex
Creando el contenido de nuestro modal
Componentes controlados y uso de librerías externas
Componentes Controlados y Variables Personalizadas
Construcción del componente de Recordar Contraseña
Creación de un componente Slider utilizando la librería tiny-slider
High Order Functions
¿Qué son las High Order Functions? - Crea tu primera HOF
Vuex
Obtener datos usando Vuex
Crea un getter dinámico en Vuex utilizando HOF
Creación de la vista para creación de publicaciones
Agregando datos con Vuex
Base de datos en tiempo real con Firebase
Instalación y Configuracion de Firebase Realtime Database
Obteniendo los datos desde Firebase Realtime Database
Agregando la consulta de usuarios
Almacenando nuevas publicaciones en Firebase Realtime Database
Perfeccionando el flujo de navegación de nuestra App
Autenticación con Firebase
Configuracion Inicial para trabajar con Firebase Authentication
Agregando nuevos usuarios en firebase autentication
Inicio de sesión de usuario
Cierre de sesión de usuario
Protegiendo páginas utilizando Navigation Guards
Scoped Slots
¿Qué son los Scoped Slots? Dónde utilizarlos y por qué
Integración de Scoped Slots en Platzi Rooms
Deploy
Creando y desplegando nuestra app en Heroku
Conclusiones y Despedida
Creación y configuración inicial del proyecto utilizando VUE CLI 3
2/34Resources
Vue CLI is an official Vue.js tool that helps us to create projects with a very good default configuration that we can extend and customize according to our projects.
Installation command with Yarn:
bashyarn global add @vue/cliIf the installation was successful we will have a new command in the terminal: vue.
In previous versions of Vue CLI we used the vue init command to download a template with default configuration. However, with the new version we can use the vue create command that allows us to choose step by step the tools and their different configurations to develop our project.
Remember that having all the configurations of your project in the package.json file can be confusing because we mix the dependencies with their configurations. Rather, we can use dedicated files for each tool configuration; it is cleaner and easier to detect the location of our configurations.
Finally, let's run our project with the vue serve command.
Contributions 16
Questions 5
Sort by:
Para aquellos que usan Npm
npm install -g @vue/cli
Para aquellos que usan Yarn
yarn global add @vue/cli
Instalación de Vue CLI con NPM (vamos, es muy fácil de “traducir” ¬¬ 😅😛):
npm install -g @vue/cli
npm install -g @vue/cli
vue create platzi-rooms
Existen también templates para empezar proyectos mas avanzados. https://madewithvuejs.com/templates
La herramienta que de ayudara en el desarrollo con vue es la vue devtool, la cual es una extension para el navegador, la puedes encontrar para chrome y firefox:
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=es
https://addons.mozilla.org/es/firefox/addon/vue-js-devtools/
en la version de vue cli 4.1.2 las opciones para la creacion de proyectos sigue siendo igual a las que podemos ver en esta clase.
🤔 ¿Cuál configuración de ESLint recomiendan para Vue?
El profe recomienda la de Airbnb (irónico, nuestro proyecto es una aplicación de viviendas 😂) pero he visto mucho por Twitter que Prettier está ganando terreno 👀😬.
En este caso...
No puedo encontrar el archivo router.js al generar el proyecto… alguien tiene idea que puede ser? No puedo seguir adelante…
Para iniciar el proyecto en NodeJS
npm run serve
Actualmente ya estamos por Vue CLI 4.5, pero los comandos siguen siendo los mismos
Voy a hacer una aplicación pero necesitaré de SEO, será que aplico esta config ó uso NUXT…?
Para desinstalar versiones anteriores de vue:
npm uninstall vue-cli -g
el CLI ya está en la versión 4
Este curso sigue siendo válido?
Want to see more contributions, questions and answers from the community?