Adding a todo

Removing a todo

State

This application state was built with a writable component, written in ./src/store.js. Contains and return an array created with the writable lib from svelte/store.

const tasks = writable([]);

export { tasks };

Remember, it isn't an pure array, its an observable

So to reference we have to use dollar symbol ($) and to change value we have to use the .update() method which will receive a callback function with the new state array. like this:

const store = writable(['var', 'foo']); //on parameters we pass the initial state
console.log($store); // will show ['var', 'foo']

store.update( () => [...$store, 'bar']);
console.log($store); // will show ['var', 'foo', 'bar']

store.update( () => $store.filter(element => element!== 'foo'));
console.log($store); // will show ['var', 'bar']

Psst — looking for a shareable component template? Go here --> sveltejs/component-template

svelte app

This is a project template for Svelte apps. It lives at https://github.com/sveltejs/template.

To create a new project based on this template using degit:

npx degit sveltejs/template svelte-app
cd svelte-app

Note that you will need to have Node.js installed.

Get started

Install the dependencies...

cd svelte-app
npm install

...then start Rollup:

npm run dev

Navigate to localhost:5000. You should see your app running. Edit a component file in src, save it, and reload the page to see your changes.

Deploying to the web

With now

Install now if you haven't already:

npm install -g now

Then, from within your project folder:

cd public
now

As an alternative, use the Now desktop client and simply drag the unzipped project folder to the taskbar icon.

With surge

Install surge if you haven't already:

npm install -g surge

Then, from within your project folder:

npm run build
surge public