grabado con localstorage y store

src/routes/+page.svelte

@@ -1,4 +1,5 @@
 <script>
+  import { contador, customStore } from "./../store/store";
   let nombre = "";
   let apellido = "";
   const enviar = () => {
@@ -43,3 +44,37 @@
     >Enviar</button
   >
 </div>
+
+<div class="mb-3 mt-3">
+  <h3>{$contador} en index</h3>
+  <button
+    type="button"
+    class="btn btn-outline-success"
+    on:click={() => $contador++}>+1</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => $contador--}>-1</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-success ml-3"
+    on:click={() => customStore.suma($contador)}>+10</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => customStore.reset($contador)}>Reset</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-success"
+    on:click={() => customStore.setNumberNeg($contador)}>-53</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => customStore.setNumberPos($contador)}>+24</button
+  >
+</div>

src/routes/about/+page.svelte

@@ -1,2 +1,52 @@
+<script>
+  import { contador, customStore } from "./../../store/store";
+  import { onDestroy } from "svelte";
+  onDestroy(() => {
+    if ($contador) {
+      console.log($contador);
+      localStorage.setItem("sveltekit", $contador);
+    }
+  });
+</script>
+
 <h1>About</h1>
 <a href="/">Home</a>
+
+<div class="mb-3 mt-3">
+  <h3>{$contador} en index</h3>
+  <button
+    type="button"
+    class="btn btn-outline-success"
+    on:click={() => $contador++}>+1</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => $contador--}>-1</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-success ml-3"
+    on:click={() => customStore.suma($contador)}>+10</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => customStore.reset($contador)}>Reset</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-success"
+    on:click={() => customStore.setNumberNeg($contador)}>-53</button
+  >
+  <button
+    type="button"
+    class="btn btn-outline-warning"
+    on:click={() => customStore.setNumberPos($contador)}>+24</button
+  ><button
+    type="button"
+    class="mx-2 btn btn-outline-danger"
+    on:click={() => localStorage.setItem("sveltekit", $contador)}
+    >Guardar</button
+  >
+</div>

src/store/store.js

@@ -0,0 +1,28 @@
+import { writable } from 'svelte/store'
+import { browser } from '$app/environment';
+
+
+let value = 0
+if (browser) {
+  if (localStorage.getItem("sveltekit")) {
+    value = parseInt(localStorage.getItem("sveltekit"))
+  } else {
+    value = 0
+  }
+}
+export const contador = writable(value)
+
+
+const funContador = () => {
+  return {
+    suma: (newValue) => contador.update(value => value + 10),
+    reset: (newValue) => contador.update(value => value = 0),
+    setNumberNeg: (newValue) => contador.update(value => value = -53),
+    setNumberPos: (newValue) => contador.update(value => value = +24),
+  }
+}
+
+export const customStore = funContador()
+// export default contador
+export default contador
+