diff --git a/examples/async-counter/client.js b/examples/async-counter/client.js new file mode 100644 index 0000000..b5cd831 --- /dev/null +++ b/examples/async-counter/client.js @@ -0,0 +1,41 @@ +const choo = require('../../') +const html = require('../../html') + +const app = choo() +app.model({ + state: { + counter: 0 + }, + reducers: { + increment: (data, state) => ({ counter: state.counter + 1 }), + decrement: (data, state) => ({ counter: state.counter - 1 }) + }, + effects: { + incrementAsync: function (data, state, send, done) { + setTimeout(() => send('increment', done), 1000) + }, + decrementAsync: function (data, state, send, done) { + setTimeout(() => send('decrement', done), 1000) + } + } +}) + +const mainView = (state, prev, send) => { + return html` +
+

Async counter

+

Clicked ${state.counter} times!

+ + + + +
+ ` +} + +app.router((route) => [ + route('/', mainView) +]) + +const tree = app.start() +document.body.appendChild(tree) diff --git a/examples/async-counter/package.json b/examples/async-counter/package.json new file mode 100644 index 0000000..ce019b3 --- /dev/null +++ b/examples/async-counter/package.json @@ -0,0 +1,15 @@ +{ + "name": "cancellable-counter", + "version": "1.0.0", + "description": "", + "main": "client.js", + "scripts": { + "start": "budo client.js -p 8080" + }, + "keywords": [], + "author": "Juan Soto ", + "license": "ISC", + "dependencies": { + "budo": "^8.3.0" + } +}