Skip to content

Quickstart ​

1. Create a Mini Program ​

Sign in to platform.lexcetha.com and choose New Mini Program. Pick a slug (a-z, 0-9, -) and a name. You get a starter project:

manifest.json
src/index.tsx

2. Write it ​

src/index.tsx must render into #root:

tsx
import { useEffect, useState } from 'react';
import { createRoot } from 'react-dom/client';
import { createLex, LexError, type LexContext } from '@lex/sdk';

const lex = createLex();

function App() {
  const [ctx, setCtx] = useState<LexContext | null>(null);
  const [count, setCount] = useState(0);

  useEffect(() => {
    lex.getContext().then(setCtx);
    lex.storage.get<number>('count').then((v) => setCount(v ?? 0));
  }, []);

  async function increment() {
    const next = count + 1;
    setCount(next);
    await lex.storage.set('count', next);
    if (next % 5 === 0) await lex.notify({ title: 'Milestone', message: `${next} clicks`, level: 'success' });
  }

  return (
    <main>
      <h1>Hello{ctx?.user.displayName ? `, ${ctx.user.displayName}` : ''} 👋</h1>
      <button onClick={increment}>Clicked {count} times</button>
    </main>
  );
}

createRoot(document.getElementById('root')!).render(<App />);

Declare what it uses in manifest.json:

json
{
  "manifestVersion": 1,
  "id": "app.lex.hello-world",
  "name": "Hello World",
  "icon": "👋",
  "version": "0.1.0",
  "sdkVersion": "^0.1.0",
  "entry": "src/index.tsx",
  "permissions": ["ui.notifications", "storage.scoped"],
  "compatibility": { "runtime": "^1.0.0" }
}

Only these imports are allowed: react, react/jsx-runtime, react-dom, react-dom/client and @lex/sdk.

3. Validate, build and preview ​

  • Validate checks the manifest.
  • Build bundles your source on the platform (esbuild, at most 2 MB) and warns about code that the sandbox will block.
  • Preview runs the build in the same sandbox with a simulated host: in-memory storage, notifications as toasts and a simulated assistant.

4. Submit ​

Submit a successful build. Lexcetha reviews the source, permissions and build log; once it is approved, you publish it from the Release tab. See Review & publishing.

Work locally

The SDK and two examples live in the lex-sdk repository (examples/hello-world, examples/task-board). Use them as references, and test with a fake bridge.

Lex by Gavalytics AI