Uh oh!
There was an error while loading.Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork0
Reactive DOM elements, based on mutableJS's state
License
mutableJS/dom
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
DOM elements, brought to life by@mutableJS/core.
Since version 0.2.0 you can! Just check out ourmutableJS / Demo repository or clone ourmutableJS / typescript-starter-template repository for the correct setup. Although the lib is written in TypeScript, the type support for JSX-elements is only partially supported.
Nope.
Its reactivity depends on the@mutableJS/core activated variables.
At the current stage mutableJS is mostly a proof of concept... But there are already a few projects in the making.
Sure, there is a demo app with super simple code available. Be sure to clone and play with ourmutableJS / Demo repository!
Also we have amutableJS / typescript-starter-template repository to provide a correct project setup.
Install withnpm:
npm install @mutablejs/core @mutablejs/dom
Install withyarn:
yarn add @mutablejs/core @mutablejs/dom
Keep in mind the repository depends on@mutablejs/core.
JSX JS/ TS
importmutable,{mutableFn}from'@mutablejs/core';import{mutableElement}from'@mutablejs/dom';constroot=document.body;constcount=mutable(0);constmakeText=mutableFn(({ pre, count}:{pre:string;count:number})=>`${pre}:${count}`,);root?.append(<div><buttononclick={()=>{count.value++;}}>{makeText({pre:'Clicks', count})}</button><div>{makeText({pre:'Clicks made', count})}</div></div>,);
Plain JS/ TS
importmutable,{mutableFn}from'@mutablejs/core';import{mutableElement}from'@mutablejs/dom';constroot=document.body;constcount=mutable(0);constmakeText=mutableFn(({ pre, count}:{pre:string;count:number})=>`${pre}:${count}`,);root?.append(mutableElement('button',{onclick(){count.value++;},},makeText({pre:'Clicks', count}),),mutableElement('div',null,makeText({pre:'Clicks made', count})),);
More complex todo-app demo in ourdemo repository.
Or start right away with your own project:Starter-Template repository.
Any feedback? Join ourDiscord server and reach out to us.
We are open to suggestions, ideas and collaboration.
Love open source? Enjoying my project?
Your support can keep the momentum going! Consider a donation to fuel the creation of more innovative open source software.
| via Ko-Fi | Buy me a coffee | via PayPal |
|---|---|---|
![]() | ![]() |
About
Reactive DOM elements, based on mutableJS's state
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Sponsor this project
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.

