Mi Primera App con Vue.js

Por Martinez Henry

Resumen (TL;DR)

Vue.js es un framework JavaScript progresivo para construir interfaces de usuario. En este artículo vemos cómo crear una aplicación básica desde cero usando Vue CLI, con los pasos mínimos para tener algo corriendo en el navegador.

📑 Tabla de Contenido

  1. ¿Qué es Vue.js?
  2. Crear una App

Mi Primera App con Vue.js

Vue.js es un framework en JavaScript progresivo para el diseño de interfaces de usuario, con fácil integración con otras librerías o proyectos. Puedes encontrar más información sobre Vue.js en la guía oficial.

Crear una App

Una de las maneras más sencillas de crear una aplicación con Vue.js es a través del Vue CLI, revisa la guía de instalación para preparar tu entorno.

Una vez tengas instalado Vue CLI puedes crear una aplicación con este comando:

vue create mi-app-name -d

Si todo anda bien al finalizar la ejecución verás en la consola algo como esto:

Captura de pantalla de 2021-03-18 08-25-55.png

Por último, para ver tu aplicación en ejecución realiza estos dos comandos:

cd mi-app-name
yarn serve

Al terminar verás algo como esto:

Captura de pantalla de 2021-03-18 08-35-15.png

Ve a tu navegador y coloca la URL indicada en la sección:

App Running At
- Local: http://localhost:8081/
- Network: http://XXX.XXX.X.XXX:8081/

Visualizarás la siguiente página:

Captura de pantalla de 2021-03-18 08-38-58.png

Cierre

Con apenas tres comandos tienes una aplicación Vue corriendo localmente. Desde aquí puedes comenzar a explorar la estructura de componentes, el sistema reactivo y todo lo que el ecosistema de Vue tiene para ofrecer.

Referencias e Inspiraciones: