atomicdata-dev / atomic-server

An open source headless CMS / real-time database. Powerful table editor, full-text search, and SDKs for JS / React / Svelte.
https://atomicserver.eu
MIT License
954 stars 44 forks source link

Atomic Data in the browser #37

Closed joepio closed 3 years ago

joepio commented 3 years ago

I want to render Atomic Data in more fancy ways than what is currently possible. Currently, all resources use the same HTML renderer. It simply iterates over all Property/Value combination. However, some classes of resources would be way more nice to look at (and easy to grasp) if they had their own views. A Class view, for example, would be helpful for explaining Atomic Data concepts. It would probably always show the title and description at the top, followed by a list of recommended and required properties - each of which shown with a human friendly name, instead of a URL.

How can I achieve this?

Using the current stack + Tera template engine

We could let users create views in Atomic-server, store them as Tera templates in atomic data. Doing this might require various things:

Doing these things in the current stack could be possible, but would require quite a bit of logic for each view. Especially graph traversal seems complex - Tera might have to call functions in rust, which is not possible, or we should pass a very deeply stored nested graph to account for nested items... Which might not even be a bad idea, btw.

In any case, it would not be very useful for most developers - maybe only for static site generation, but not for more dynamic apps.

Using existing JS libraries

I want to provide front-end developers with a simple way of constructing their own custom views. One approach would be to use my colleague Thom's Link-Redux library, which offers most of what I need. However, it's also quite tightly integrated with RDFS - it uses RDF:Type for determining a view, but we might be able to work around this.

Creating a new atomic-JS library

This will probably happen some day, but it will take a lot of work, and I'd rather focus my attention on getting the current library to a higher level.

Mapping atomic to JS using wasm_bindgen

Another approach would be to use this rust based library and use wasm_bindgen to make functions available in a JS context. The obvious advantage is that I can still use this rust library, but I'm not sure what kind of problems I might encounter. All available functions need explicit js mapping using wasm_bindgen, and I'm pretty sure some of the current used libraries don't even compile to wasm in the browser. I also have to change the HTTP client, to use the browser one using web_sys.

Using a rust front-end framework

Rust in the browser isn't very popular, but it's possible. Some frameworks, such as Yew, seem to work pretty well. However, this will limit how many people will want to work with it.

joepio commented 3 years ago

I've started work on a typescript + react implementation of atomic data for this purpose:

https://github.com/joepio/atomic-react