Comenzaremos repasando los conceptos de binding con el ejemplo Twitter: runas $state y $derived. Testeo unitario de frontend.
Luego veremos cómo implementar tests de frontend. Diapositivas tests de frontend.
Y por último trabajaremos en el Carrito de compras: runas $state, $derived, $bindable (manejo de eventos entre componentes), $props. Definición de componentes propios en Svelte. Testeo unitario de frontend. Diapositivas componentes + runas $props y $bindable.
Comenzaremos a estudiar nuestro primer framework de UI: Svelte
Tenés una página de Svelte que te explica con qué herramientas trabajar
Veremos estos ejemplos:
Conversor: runas $state y $derived. Testeo unitario de frontend. Diapositivas Intro a Svelte.
El martes tenemos:
Presentación oficial del TP
El jueves se ve:
04 - Medidas espaciales: em, rem, px - Video de medidas relativas y absolutas - Youtube
BONUS: 09- Variables - Custom properties en CSS. - Video de Variables en CSS - Youtube
Bonus:
El martes será la presentación oficial de la materia:
Anotate en la lista
Unidad 1: Introducción a las interfaces de usuario.
Unidad 2 Desarrollo Web Estático.
Introducción a la arquitectura web. HTML. Introducción básica a CSS.
Diapositivas
Videos de clase
Los temas para ver en la clase del jueves serán:
03 - Elementos de línea y de bloque. Position. Z-Index. - Video de Display inline vs. block. Position - Youtube
Si querés podés ver cómo generar un proyecto web desde cero, y cómo importar fuentes de Google (Video youtube)
BONUS: Ejemplo de Maquetado Web, para leer en casa: