just_haug

We came up with a fundamentally new architecture for web apps that lets you build complete full-stack web apps 10x faster while keeping the flexibility you expect in most standard UI frameworks.

This is the second article in our architecture series explaining the new architecture and what problems it solves.

I can answer any questions and you can tweet at me at https://twitter.com/just_haug

The UI is essentially a node tree similar to react, defined in JSON objects.

This example (https://github.com/yolmio/boost/blob/main/examples/todos/sys...) gives a "lower level" example of a todo list that interacts with the database.

But excerpted the below demonstrates the state approach:

  nodes.state({
    procedure: (s) =>
      s
        // A scalar is a single value
        .scalar(`input_text`, `''`)
        // Queries the todo table from the database and puts them in a ui table
        .table(`todo`, `select * from db.todo`),
    children: [
      // like react, controlled input
      components.input({
        value: `input_text`,
        on: { input: (s) => s.setScalar(`input_text`, `target_value`) },
      }),
      components.button({
        on: {
          click: (s) =>
            s.serviceProc((s) =>
              s
                .startTransaction()
                // Inserts into the database using the scalar defined in the ui
                .modify(`insert into db.todo (title) values (input_text)`)
                .commitTransaction(),
            ),
        },
      }),
    ],
  });

It defines a node hierarchy with ui state (tables) and that state is populated from the database. The serviceProc is able to modify the database with data from the ui state.

There is nothing special about any of the components and functions I call in the examples, there are really just creating node hierarchies and objects. It means that you aren't limited to kinds of UIs you can create and you can create your own functions that just take in data and return arbitrary node hierarchies.

I suppose it depends on what you mean as a growing app. A few of the examples (https://github.com/yolmio/boost/tree/main/examples) are apps that you could easily sell as a freelancer/contract work.

You can of course split up your system into as many files as possible, the emphasis on a single file is that now instead of your architecture, languages, etc. enforcing separate files and hampering reuse, you can organize it however you like.

I'm sure best practices will evolve overtime, but I've been alright with just a single file for apps in production (as long as the majority of components are made reusable)

I assume so, I have seen a few people make SQLite run in the browser against IndexedDB, but I haven't personally seen anyone build one from scratch for it.

Hey HN,

After 6 years of work we are publicly releasing Yolm (https://yolm.io) in beta.

This is the first of three technical articles going in depth into the architecture of Yolm.

I will be here to answer any questions and you can contact me on twitter at https://twitter.com/just_haug

Also if you just want a quick overview of what Yolm can do, watch this video: https://youtu.be/GHzNIX7kdSw

If you want to try out Yolm for free, follow the instructions at https://yolm.dev/tutorials/quick_start/