README.md

Code11 Engine

The Code11 Engine is a declarative state management system and application builder.

Read the documentation for more information.

Usage

Get started using the cli:

npx @c11/engine.cli create my-app
cd my-app
npm start

Example

// App.tsx
export const App: view = ({
  name = observe.name,
  greeting = observe.greeting,
  updateName = update.name,
}) => (
  <div>
    <h1>{greeting}</h1>
    <input
      defaultValue={name}
      onChange={(e) => updateName.set(e.currentTarget.value)}
    />
  </div>
);

const greeter: producer = ({
  name = observe.name,
  updateGreeting = update.greeting,
}) => {
  const greeting = name ? "Enter your name:" : `Hello ${name}!`;
  updateGreeting.set(greeting);
};

App.producers([greeter]);

// index.tsx
import { engine } from "@c11/engine.runtime";
import { render } from "@c11/engine.react";
import { App } from "./App";

const app = engine({
  state: {
    name: "Foo Bar",
  },
  use: [render(<App />, "#app")],
});

app.start();

The rendering is done by views. Views observe and update anything on the state. The business logic sits in producers.