Hello everyone!

as a side-project, I created reactive Nimiq stores for the SvelteJS framework.

GitHub sisou/nimiq-svelte-stores Provides SvelteJS stores for a Nimiq Blockchain Client - sisou/nimiq-svelte-stores

What is SvelteJS?

SvelteJS is a compiled front-end framework, which has been around for a few years, but completely redesigned itself with version 3 not too long ago. It is a reactive front-end framework with the same goals as React and Vue, but instead of shipping a big runtime library to the browser, this framework compiles an app with only the minimal required code and can thus have a much much smaller download size and better performing DOM updates. Granted, its feature set is smaller than React and Vue, but it also requires much less code.

I recommend to go through the tutorial, which explains Svelte’s concepts step-by-step:

svelte.dev Introduction / Basics • Svelte Tutorial Introduction / Basics

What are Nimiq Stores for Svelte?

Similar to Redux in React, or Vuex in Vue, Svelte also has the concept of app-wide stores that hold state which can be used from all components. These stores are very simple ES6 functional modules that can be extended and combined to do nearly anything, and they are often compared to React Hooks as well.

Nimiq Svelte Stores wrap the Nimiq Client API (available in Nimiq Core v1.5) and provide blockchain state to Svelte apps through these stores, automatically handling network subscriptions for consensus, balances, transactions, etc. and updating state live. That means you don’t have to write any of this code!

Have a look at the example app:

https://nimiq-svelte-stores.netlify.com

and the code for it:

https://github.com/sisou/nimiq-svelte-stores/blob/master/src/App.svelte

If you have any questions about Svelte or these stores, please ask!

Happy coding!

Sören