Embed the Rerun web viewer within your React app.
If you'd like to use a framework-agnostic package instead, see https://www.npmjs.com/package/@rerun-io/web-viewer.
$ npm i @rerun-io/web-viewer-react
ℹ️ Note:
The package version is equal to the supported rerun SDK version.
This means that @rerun-io/[email protected]
can only connect to a data source (.rrd
file, websocket connection, etc.) that originates from a rerun SDK with version 0.10.0
!
import WebViewer from "@rerun-io/web-viewer-react";
export default function App() {
return <WebViewer rrd="...">
}
The rrd
in the snippet above should be a URL pointing to either:
- A hosted
.rrd
file, such as https://app.rerun.io/version/0.15.0/examples/dna.rrd - A WebSocket connection to the SDK opened via the
serve
API
If rrd
is not set, the viewer will display the same welcome screen as https://app.rerun.io.
ℹ️ Note: This package only targets recent versions of browsers. If your target browser does not support Wasm imports or top-level await, you may need to install additional plugins for your bundler.
$ npm run build