Start

Open a cart, change a number, run it

play.onejs.com runs small carts in the browser. Every one shows you its source and can be forked or opened in Unity.

Carts are written in React and TypeScript against a package called oj.

import { View, Text, mount, useFrame, input } from "oj"

function Game() {
    useFrame(() => {
        if (input.keyboard.wasKeyPressed("Space")) console.log("jump")
    })
    return <View><Text>hello</Text></View>
}

mount(<Game />)

No build configuration and no root plumbing. mount() already knows where to render.

The shortest way in

1. Open a cart: Tinder, for one, and press Edit code. Its code opens beside the running cart.
2. Change a number in the code.
3. Press Run, the play button above the code.

That needs no account, and nothing you do touches the original. Run builds what is in your tab and plays it; it never saves.

The editor's address names the file you have open, so a reload or a copied link opens on it.

To show a cart or record one, the button beside Run presents it: the code at a size a video can read, the cart beside it, and nothing else. Alt + and Alt − size the code, Alt 1, 2 and 3 change how the screen is split, and Escape comes back. Adding ?present to the editor's address opens it that way.

Keeping what you make

Signing in is what lets you keep something: creating a cart, forking one, and saving your work.

New cart, the pen beside your name, opens the editor on a starter cart that is already running, under a made-up name like sleepy-otter. The pencil beside the name at the top of the editor renames it; the name itself goes to the cart's page. Your typing is kept as you go, where only you see it, and Push makes it live: one commit, built, and what everybody plays if it builds. A push that does not compile still lands: the error comes back with the file and line, and what is live does not move. Discard changes, in the Push window, puts the cart back to what is live.

A new cart is private. Its Settings, behind the gear beside Push, is the only thing that changes that, and it has two answers, Private and Public. Publishing hands over all of it at once: the page, the source, forking and the Unity download. Forking a public cart gives somebody their own copy with a new id, and yours is untouched.

Two things worth knowing early

Your cart is the JavaScript, not the engine. Unity and the OneJS runtime are one shared container that every cart on the site runs inside, so a cart is a few kilobytes and starts without a download prompt. It also means what you fork is real source.

Nothing here is thrown away. oj is a subset of OneJS, so everything a cart uses also works in a normal Unity project. When a cart outgrows the browser, opening it in Unity is a git clone and one command.

Work locally

Every cart is a git repository, so you can work on one in your own editor. A new one starts on your machine, with no account:

npx ojplay new "My Cart"             # the starter in ./my-cart, a git repository
cd my-cart
npm install
npx ojplay run --watch               # the site's container in a local Chrome, swapping in each save
git add -A && git commit -m "First version"
npx ojplay push                      # the first push puts it on the site, private; it asks you to log in once

A cart already on the site clones by its address plus .git (a public cart needs no login):

npx ojplay list                      # your carts and their addresses, private ones included
git clone https://play.onejs.com/@<handle>/<name>.git
cd <name>
npx ojplay init && npm install       # types and completions, kept out of git
npx ojplay push                      # builds on the site, and says so if it did not build

From your own machine has the rest: running and testing a cart locally, and what happens when the editor and a push both change it.

Where to go next

Start with Writing a Cart if you want to make something, or Elements and Styling if you have forked one and want to know what the code in front of you does.