sveltekit5-showcase

Ex001: Interactive Button

This is a button that increases a count by 2 each time it is pressed.

0

Ex002: Interval Count

5

wait 1 second

Ex003: Update Array

(empty)

Ex004: Universal Reactivity

User is 55 years old and their score is 0.

Ex005: Svelte Stores

user name is Robert

there are skills

Ex006: Svelte Stores

user name is Robert

Ex007: Update Array with State/Derived

Same as Ex003 but with $state() and $derived()

(empty)

Amount: 0

Sum: 0

Max:

Min:

Ex008: $state() with get/set

0

Ex009: $state() without get/set (simpler)

0

Ex010: State variables with array.push()
Theme is: dark

1, 2, 3, 4, 5

total = 15

Ex011: Shared State 001
Theme is: dark
{
  "theme": "dark",
  "currentUser": {
    "firstName": "Olaf",
    "lastName": "Hackberg",
    "age": 56
  }
}
Ex012: Shared State 002
Theme is: dark
First Name:
Last Name:
Ex013: Rune Store

count: 0

double count: 0

Ex014: Rune Store

count: 0

double count: 0

number of skills: 0

Ex017: Bind Elements

(This input box is focused on page load.)

Ex018: Bind Elements

Name: Hans

Age: 34

Is online: yes

Ex019: Checkmark
Ex020: Snippets

Count: 0