svelteMovies

App.svelte

<script>
	import Form from "./Form.svelte"
</script>

<main>
	<h2> Películas </h2>

	<form>
		<h3> Terminator </h3>

		<button type="button"> - </button>
		0
		<button type="button"> + </button>
	</form>
</main>

Form.svelte

<script>
	const movies = [
		{
			name: "Avengers",
			quantity: 0,
			available: 3
		}	,
		{
			name: "Terminator",
			quantity: 0,
			available: 5
		}	
	];
</script>

{#each movies as movie}
<form>
		<h3> {movie.name} </h3>

		<button 
			type="button" 
			on:click={() => movie.quantity -= 1}
			disabled={movie.quantity <= 0}
		> - </button>
		{movie.quantity}
		<button 
			type="button" 
			on:click={() => movie.quantity += 1}
			disabled={movie.quantity >= movie.available}
		> + </button>
	</form>
{/each}

Rollup

Este paquete combina fragmentos de código en bibliotecas o aplicaciones más grandes y complejas utilizando el nuevo formato de módulos de código de JavaScript (ES6). Con los módulos ES, puedes fácilmente combinar las funciones más útiles de tus bibliotecas favoritas, y Rollup lo hace posible hoy en día.

Archivos de la Clase

Cómo usar Svelte

Lecturas Recomendadas