¿Qué es Vue.js? Frameworks, librerías y componentes

Librerías: Son una serie de herramientas provistas para que puedan ser usadas y facilitar el desarrollo
.
Frameworks: Estos no solo te proveen las herramientas para trabajar, sino que también te dicen cómo trabajarlas.

Vue es un Framework 👀☝️
.
Vue es **un framework progresivo, ya que te permite agregar capas, a medida que tu aplicación vaya creciendo puedes agregar más y más capas que necesites.
.
Declarative Rendering: Es con la que Vue trabaja todo, se encarga de conectar la información con la presentación. La información son todos los datos de tu aplicación, la presentación es la encargada de mostrar la información al usuario.
.
Components: Separan y encapsulan partes de la aplicación, son como pequeños legos que puedes usar para armar poco a poco la página

Dejo un gráfico de como puede funcionar el sistema de capas en nuestras aplicaciones

Para potenciar tu aprendizaje en esta clase, puedes buscar por tu cuenta los siguientes temas y fortalecer asi tus habilidades investigativas.

Que es VUE.JS?
Libreria vs Framework
Por que se dice que Vue es un Framework?
Vue es progresivo? Que son las capas?
Que es Declarative Rendering?
Que son los componentes en Vue.js?

Con estas consultas, podras empezar a consolidar tus conceptos sobre Vue.js.

Nunca pares de aprender!

Complemento:

VueJS, no sólo es un Framework enfocado para agilizar los procesos, sino desde su core posee una arquitectura llamada MVVM o (Modelo Vista Vista-Modelo). Éste es un estilo de arquitectura donde tal cual permite el modelar la información a nuestra conveniencia, pero sobre todo, permitiendo el XD (Developer Experience) sea escalable y selectible para con sus elementos.

Donde encontramos:

• Model. Sería la capa donde la información se encuentra realmente, así como MVC, aquí encontramos las reglas del juego.
• View-Model. En esta capa, nos encontramos en la “reactividad”, jugando con estados o states. También en ella, podemos encontrar expuesta los comportamientos de los datos.
• View, la capa donde se muestra modularmente la información, su estructura.

Por último, es importante denotar que como tal VueJS NO nace con una esencia “china” y siento que es despectivo su enfoque porque Evan You trabajaba dentro de Meteor llamado Angular después, y notaba las deficiencias de su antiguo proyecto VueJS: The Documentary
Les dejo el enlace de las caracterízticas de Vue 3 por el equipo de Vue Mastery 💚

Lo que lei, es que Evan You trabajaba en google en el desarrollo de angular, y que luego se retiro y desarrollo Vue, y le quito muchas de las cosas complejas que tiene angular, y por esto la sintaxis es mucho más simple. Podría ser un Angular mejorado y que ahora cuenta con el aporte de una gran comunidad.

Y el mejor apoyo de un desarrollador que esta aprendiendo Vue.js es la propia documentación, una de las mejores guía para nosotros.
https://v3.vuejs.org/guide/introduction.html

Vue es un framework JavaScript que surge en 2014 desarrollado por Evan You y que nos permite construir las interfaces de usuario. Se dice que es un framework progresivo porque, a diferencia de otros frameworks (como Angular), que están más orientados a usarlos para construir proyectos desde 0, se puede añadir en cualquier proyecto y a cualquier etapa del desarrollo sin ninguna complicación y pudiendo aprovechar todas las funcionalidades de las que nos provee Vue.

Empezar a trabajar con Vue es muy rápido, ya que para usarlo para páginas sencillas basta con importar el script en nuestra página HTML. Pero también podemos llegar a construir aplicaciones más grandes, para lo que nos vendría bien usar vue-cli a la hora de generar la estructura del proyecto, separar la aplicación por componentes y usar algunas librerías como vuex, vue-router o axios para poder hacer uso de funcionalidades que no trae Vue.

Les recomiendo ver el documental de Vue.js.

Vue.js: The Documentary

El meme de Shrek para explicar el concepto de progresivo es lo mejor de la clase 😂

ESPERO APRENDER MUCHO

Libreria vs framework

Libreria: Es una serie de funcionalidades cuyo objetivo es resolver necesidades especificas, estan empaquetadas y ademas son reutilizables. Algunos ejemplos son JQuery y React.

Framework: Es una conjunto de herramietas que te da una estructura para un proyecto completo, desde el comienzo hasta el final, trayendo consigo funcionalidades independientes de cosas externas. Ejemplos como Vue y Angular que son frameworks para el frontend y Laravel para el backend.

¿Qué es Vue?

Vue es un marco Javascript progresivo de código abierto que se usa para crear interfaces de usuarios y aplicaciones SPA (Single Page Application). Fue creado por Evan You, y su idea es tener un marco que proporcione alto desacoplamiento para permitir el desarrollo progresivo de aplicaciones. Vue posee un sistema de componentes reactivos, por lo que es fácil la comunicación a través de componentes.

Vue lo puedes usar de diversas formas, lo que le agrega un punto a su favor. Si quieres incluirlo en tu proyecto puedes optar por las siguientes opciones

• Descargar el achivo fuente de Vue, y agregarlo en tu HTML utilizando la etiqueta <script>
• Utilizar CDN, puedes buscar en su página el CDN y agregarlo a tu HTML, y usarlo como libreria.
• Usando un gestor de paquetes de node, ya sea NPM o Yarn.
• Usar Vue-cli, donde puedes crear diversos tipos de poryectos de Vue, agregar ciertas configuraciones, dependencias, etc. Es uno de los metodos mas usados porque te crea un ambiente de trabajo ya configurado y siguiendo los mejores estandares de estructura y desarrollo.

Me toco ver esta clase como 3 veces, no entendi muy bien, pero creo q ya le entendi jejej xD

WOW

Que excelente explicación.
Precisa, muy fluida y bastante colorida (en un sentido descriptivo de los elementos a explicar).

Por si les interesa, hay un documental de Vue de 30 minutos que salió en 2020: https://www.youtube.com/watch?v=OrxmtDw4pVI&vl=en

¿Qué es Vue.js? Frameworks, librerías y componentes

Ejemplos de librerías:

• MomentJS (para manejar fechas)
• jQuery (para manipular DOM)
• React (UI Components)

Ejemplos de frameworks:

• Angular
• Laravel
• Vue

Vue tiene 2 capas principales que usa en todos sus proyectos:

1. Declarative rendering | Conectar la información con la presentación.
2. Componentes | Encapsular presentación y lógica (HTML, CSS, JS)

La magia es solo ciencia que no entendemos aún. - Arthur C. Clarke

Sabes que es un buen curso cuando al hacer la analogía de la cebolla colocan la referencia Shrek ❤️

Basicamente Vue es un Ogro ❤️

Un articulo para leer: La fascinante historia detrás del nacimiento de Vue.js
https://javascript.plainenglish.io/the-fascinating-story-behind-the-birth-of-vue-js-a-documentary-97d353688c2

Veamos qué se viene!!!

Yo entiendo mejor si usas a Shrek de ejemplo 😁

Podríamos decir que una librería es una herramienta (P.E. un martillo o un desarmador) y un framework es una caja de herramientas.

👌

Librería vs Framework

Librería: Herramienta para un utilidad específica. P.E:

• MomentJS (fechas)
• JQuery (manipular DOM)
• React (componentes UI)

Framework: Conjunto de herramientas que trabajan en un proyecto. P.E:

• Angular
• Laravel
• Vue

Con estas definiciones podemos decir que Vue es un Framework, gracias a todo su ecosistema que permite desarrollar todo un proyecto con Vue.

También se considera progresivo, pues con Vue puedes agregar con muchas capas independientes o en conjunto. Además permite agregar más capas como el proyecto lo requiera.

Vue es un framework porque contiene un monton de librerias, plugins, utilidades.