Getting started

Prerequisites

Node.js v20 or higher and a package manager such as npm are required to install and use the Tairu framework.

Installation

The handler package is needed to create Tiles server-side.

npm

npm install @tairu/handler

pnpm

pnpm add @tairu/handler

Your first Tile

A Tile can be simply defined using JSX and exporting the handler wrapped in the handle() function:

import { Text, Tile, handle, h } from '@tairu/handler'

export function handler() {
  return (
    <Tile title="Demo tile">
      <Text>Hello Tairu!</Text>
    </Tile>
  )
}

export default handle(handler)

Serving the Tile

The tile can then be served by the CLI:

npm

npx tairu serve handler.tsx

pnpm

pnpm dlx tairu serve handler.tsx

The Tile is then accessible at the URL http://localhost:3210 by default.

Accessing the Tile

Finally, the Tile can be accessed from different clients:

Tairu CLI

npx tairu open http://localhost:3210

Web browser embed

<iframe src="http://localhost:3210"></iframe>

React embed

Using the tairu/react-dom package:

import { Tile } from '@tairu/react-dom'

function App() {
  return <Tile url="http://localhost:3210" />
}