Con los estilos en línea se puede meter pequeños cambios a estilo usando directamente la etiqueta style. Svelte soporta el atributo style estandar de HTML, pero también alguna sorpresilla más.

Las clases condicionales permiten utilizar en función de una determinada condición una clase u otra, y es un recurso muy práctico, por ejemplo, para señalar clases cuando un estado es inválido o en general para hacer que el aspecto de un componente dependa en sus propiedades.

Comenzamos el módulo de CSS hablando de lo más simple: cómo haríamos para incorporar estilos a una aplicación de Svelte. El resultado probablemente no te sorprenda: dentro de la etiqueta style de cada componente de Svelte se pueden insertar estilos CSS y usarlos localmente en el componente como se ha...

Aparentemente no hablé acerca de esto antes. Los modificadores de eventos permiten declarar aspectos adicionales sobre un evento. La lista completá está en la documentación de Svelte, pero los que creo que vais a encontrar más útiles son el modificador preventDefault, para añadirle automáticamente un preventDefault a cualquier evento, y...

En la segunda parte del ejemplo vamos a crear los componentes que quedan, que requieren un poco más de caso, antes de considerar este ejemplo como completado. Veremos cómo crear eventos propios y cómo propagar hacia arriba mediante binds.

En los próximos dos episodios haremos una pequeña demo creando un formulario complejo con Svelte para demostrar las capacidades a la hora de crear eventos. En esta primera parte creamos el esqueleto de la aplicación y los componentes más sencillos.

Veamos cómo ejecutar el comando para descargar un repositorio plantilla de Svelte con el que podemos empezar a trabajar, y cómo entender las distintas carpetas de las que se compone un proyecto de Svelte. También vemos el comando para lanzar un servidor web.

Para terminar con el tema eventos, es posible repropagar eventos hacia arriba en la jerarquía de un componente significativo de Svelte si simplemente utilizamos el atributo on, pero no le damos ningún valor. Un ejemplo será mejor que mil palabras.

Los eventos que fabriquemos con un event dispatcher también nos permiten agregarle información extra que puede ser capturada en el listener de los eventos, lo que nos va a permitir enviar información extra cuando hagamos fluir eventos de un sitio a otro.

createEventDispatcher es la función principal que nos va a permitir crear despachadores, que es lo que podemos usar para propagar hacia arriba un evento personalizado cuando estamos en un componente Svelte.