kbrsh / moon

🌙 The minimal & fast library for functional user interfaces
https://moonjs.org
MIT License
5.99k stars 200 forks source link

awesome build-less moon (+lazy load components?) #251

Closed coderofsalvation closed 5 years ago

coderofsalvation commented 5 years ago

Awesome project! I was amazed how fast I could just get an index.html up and running, without having to install any transpiler (babel/webpack etc).

Question: what would you think of promise-support or url-support for the 'view'-property?

So instead of

            Moon({
                root: "#root",
                view: $('#view').innerHTML,
                ....

It would support:

            Moon({
                root: "#root",
                view: Moon.component('view/myview.html') // moon evaluates promise
                ...

example (pseudocode):

Moon.component = (url) => {
    return new Promise( (resolve,reject) => {
        fetch(url)
        .then( (d) => d.text() )
        .then( resolve )
        .catch(reject)
    })
}

Why?

Many times i need to livecode HTML. Having the scalability of single-file-components, and not having to use the cli really speeds up the production i my case. Moon is so incredibly simple & easy to use, it kind of makes it sexy to not need an extra buildstep for single-file-components (like vue).

kbrsh commented 5 years ago

Thanks for the feedback!

The next version will be a bit different than what you'd normally expect from a UI library, and its API will look something like this.

That version will support having any function as a component rather than single file components. You could still make single file components that export one view function however, and I'm still working on solutions for CSS but you'd probably use something like CSS modules.

Since any function could be a component, it would support something similar to what you showed above :)

coderofsalvation commented 5 years ago

very interesting! The new approach seems to be very curryable as well. Keep up the good work!

Leon

On Mon, Jul 1, 2019, 20:15 Kabir Shah notifications@github.com wrote:

Thanks for the feedback!

The next version will be a bit different than what you'd normally expect from a UI library, and it's API will look something like this https://twitter.com/kbrshah/status/1145107836147359746.

That version will support having any function as a component rather than single file components. You could still make single file components that export one view function however, and I'm still working on solutions for CSS but you'd probably use something like CSS modules.

Since any function could be a component, it would support something similar to what you showed above :)

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/kbrsh/moon/issues/251?email_source=notifications&email_token=AABL6ZFQUTACEN5MZOCA7CDP5JCUHA5CNFSM4H4SLGF2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODY65VEY#issuecomment-507370131, or mute the thread https://github.com/notifications/unsubscribe-auth/AABL6ZCFESFKZ6RIWZZGQJ3P5JCUHANCNFSM4H4SLGFQ .

LeviSchuck commented 5 years ago

Oh definitely excited for the next api

kbrsh commented 5 years ago

Glad to hear @coderofsalvation @LeviSchuck!

I've tried it out on some small components and experiments, and you're right haha — it's very curryable and it's super easy to create higher-order functions. Even though I created the new design, I haven't explored its full potential.

I just committed the changes in 265252ed8145ffc75c227ca3232ce1b0074fcfbc, definitely one of my larger commits. Feel free to hop on the Slack and I can help you all try it out :)

kbrsh commented 5 years ago

Moon v1 beta 3 is out! :tada:

Let me know what you think — I'm closing this for now because I think it can be achieved through Promises and returning an intermediate loading state inside a component function.