Aprecio mucho que se tome la molestia de explicar las bases… llevo desarrollando en Vue ya casi dos años y aprendí cosas nuevas
Introducción
¿Qué es Vue.js?
Fundamentos de componentes
Configuración del entorno
Primer contacto
Renderizado declarativo
Interpolación de datos
Interpolación de datos 2
Atributos reactivos
Input de usuario
Eventos de usuario
Inputs reactivos
Reactividad
Propiedades computadas
Watchers
Estilos reactivos
Listas y condicionales
Condicionales
Listas
Componentes personalizados
Componentes
Slots
Comunicación entre componentes
Comunicación de componente padre a hijo
Comunicación de componente hijo a padre
Custom v-model
Comunicación con componentes profundos
Componentes en el Virtual DOM
Instancias de componentes
Cierre del curso
Vue progresivo
Esto es solo el comienzo
Aportes 8
Preguntas 2
Aprecio mucho que se tome la molestia de explicar las bases… llevo desarrollando en Vue ya casi dos años y aprendí cosas nuevas
Extensiones que te harán la vida mas fácil con Vue:
Vetur
Vue VSCode Snippets
Eso del Proxy tiene bastante que ver en esa magia de Vue, les dejo una clase del curso Profesional de JavaScript donde se habla de Proxy: https://platzi.com/clases/1642-javascript-profesional/22172-proxy/
En el curso de reactividad con Vue 3, las primeras clases se dedica a explicar cómo funciona internamente Vue.js, incluso esta parte del Proxy que es un objeto “trampa” que intermedia los datos entre el DOM y Vue. Eso para crear copias de objetos y usar funciones que manejen la data ya sea como getter o setter y todo pueda trabajarse virtualmente.
Aquí un ejemplo de cómo funciona se implementa el proxy en JS.
const proxyEjemplo = new Proxy(target, handler);
Hola dejo el codigo de esta clase, para que ahorres tiempo y te enfoques en la explicacion de los temas de esta clase. Sigue avanzando!!! Vue es genial.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="https://unpkg.com/[email protected]"></script>
<div id="app">{{ text }}</div>
<script>
Vue.createApp({
data() {
return {
text: 'Hello Word!'
}
}
}).mount('#app')
</script>
</body>
</html>
Me encanta cuando uno lleva mucho tiempo en algo y cree que esta parte basica la sabe bien y se da cuenta que cada nuevo detalle, abre nuevos mundos
Hicieron un cambio reciente en la ruta del script del cdn. A día de hoy es:
<script src=“https://unpkg.com/[email protected]”></script>
Definimos una función llamada data, esta función siempre retornará un objeto JSON (JavaScript Object Notation)
¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.