Expo

Prerequisites

• Recommended: Bun 1.2 or higher
• Node.js 23.0.0 or higher

To use LiveStore with Expo, ensure your project has the New Architecture enabled. This is required for transactional state updates.

Option A: Quick start

For a quick start we recommend using our template app following the steps below.

For existing projects see Existing project setup.

1. Set up project from template

   bun

   bunx @livestore/cli@dev create --example expo-todomvc-sync-cf livestore-app

   pnpm

   pnpm dlx @livestore/cli@dev create --example expo-todomvc-sync-cf livestore-app

   npm

   npx @livestore/cli@dev create --example expo-todomvc-sync-cf livestore-app

   yarn

   yarn dlx @livestore/cli@dev create --example expo-todomvc-sync-cf livestore-app

   Replace livestore-app with your desired app name.

2. Install dependencies

   It’s strongly recommended to use bun or pnpm for the simplest and most reliable dependency setup (see note on package management for more details).

   bun

   bun install

   pnpm

   pnpm install --node-linker=hoisted

   Make sure to use --node-linker=hoisted when installing dependencies in your project or add it to your .npmrc file.

   .npmrc

   nodeLinker=hoisted

   Hopefully Expo will also support non-hoisted setups in the future.

   npm

   npm install

   yarn

   When using yarn, make sure you’re using Yarn 4 or higher with the node-modules linker.

   yarn set version stable
   yarn config set nodeLinker node-modules
   yarn install

   Pro tip: You can use direnv to manage environment variables.

3. Run the app

   bun

   bun start

   pnpm

   pnpm start

   npm

   npm run start

   yarn

   yarn start

   In a new terminal, start the Cloudflare Worker (for the sync backend):

   bun

   bun wrangler:dev

   pnpm

   pnpm wrangler:dev

   npm

   npm run wrangler:dev

   yarn

   yarn wrangler:dev

Option B: Existing project setup

1. Install dependencies

   bun

   bun install @livestore/devtools-expo@0.4.0-dev.14 @livestore/adapter-expo@0.4.0-dev.14 @livestore/livestore@0.4.0-dev.14 @livestore/react@0.4.0-dev.14 @livestore/sync-cf/client@0.4.0-dev.14 @livestore/peer-deps@0.4.0-dev.14 expo-sqlite

   pnpm

   pnpm install @livestore/devtools-expo@0.4.0-dev.14 @livestore/adapter-expo@0.4.0-dev.14 @livestore/livestore@0.4.0-dev.14 @livestore/react@0.4.0-dev.14 @livestore/sync-cf/client@0.4.0-dev.14 @livestore/peer-deps@0.4.0-dev.14 expo-sqlite

   npm

   npm install @livestore/devtools-expo@0.4.0-dev.14 @livestore/adapter-expo@0.4.0-dev.14 @livestore/livestore@0.4.0-dev.14 @livestore/react@0.4.0-dev.14 @livestore/sync-cf/client@0.4.0-dev.14 @livestore/peer-deps@0.4.0-dev.14 expo-sqlite

   yarn

   yarn add @livestore/devtools-expo@0.4.0-dev.14 @livestore/adapter-expo@0.4.0-dev.14 @livestore/livestore@0.4.0-dev.14 @livestore/react@0.4.0-dev.14 @livestore/sync-cf/client@0.4.0-dev.14 @livestore/peer-deps@0.4.0-dev.14 expo-sqlite

2. Add Vite meta plugin to babel config file

   LiveStore Devtools uses Vite. This plugin emulates Vite’s import.meta.env functionality.

   bun

   bun add -d babel-plugin-transform-vite-meta-env

   pnpm

   pnpm add -D babel-plugin-transform-vite-meta-env

   yarn

   yarn add -D babel-plugin-transform-vite-meta-env

   npm

   npm install --save-dev babel-plugin-transform-vite-meta-env

   In your babel.config.js file, add the plugin as follows:

   babel.config.js

   module.exports = (api) => {
     api.cache(true)
     return {
       presets: [['babel-preset-expo', { unstable_transformImportMeta: true }]],
       plugins: ['babel-plugin-transform-vite-meta-env', '@babel/plugin-syntax-import-attributes'],
     }
   }

3. Update Metro config

   Add the following code to your metro.config.js file:

   metro.config.js

   // Learn more https://docs.expo.io/guides/customizing-metro
   const { getDefaultConfig } = require('expo/metro-config')
   const { addLiveStoreDevtoolsMiddleware } = require('@livestore/devtools-expo')
   const path = require('node:path')
   
   /** @type {import('expo/metro-config').MetroConfig} */
   const config = getDefaultConfig(__dirname)
   
   // Needed for monorepo setup (can be removed in standalone projects)
   if (process.env.MONOREPO_ROOT) {
     config.watchFolders = [path.resolve(process.env.MONOREPO_ROOT)]
   }
   
   addLiveStoreDevtoolsMiddleware(config, {
     schemaPath: './src/livestore/schema.ts',
     viteConfig: (viteConfig) => {
       viteConfig.server.fs ??= {}
       viteConfig.server.fs.strict = false
       viteConfig.optimizeDeps ??= {}
       viteConfig.optimizeDeps.force = true
       return viteConfig
     },
   })
   
   module.exports = config

Define Your Schema

Create a file named schema.ts inside the src/livestore folder. This file defines your LiveStore schema consisting of your app’s event definitions (describing how data changes), derived state (i.e. SQLite tables), and materializers (how state is derived from events).

Here’s an example schema:

schema.ts

import { Events, makeSchema, Schema, SessionIdSymbol, State } from '@livestore/livestore'

export const tables = {
  todos: State.SQLite.table({
    name: 'todos',
    columns: {
      id: State.SQLite.text({ primaryKey: true }),
      text: State.SQLite.text({ default: '' }),
      completed: State.SQLite.boolean({ default: false }),
      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
    },
  }),
  uiState: State.SQLite.clientDocument({
    name: 'uiState',
    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
  }),
}

export const events = {
  todoCreated: Events.synced({
    name: 'v1.TodoCreated',
    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
  }),
  todoCompleted: Events.synced({
    name: 'v1.TodoCompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoUncompleted: Events.synced({
    name: 'v1.TodoUncompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoDeleted: Events.synced({
    name: 'v1.TodoDeleted',
    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
  }),
  todoClearedCompleted: Events.synced({
    name: 'v1.TodoClearedCompleted',
    schema: Schema.Struct({ deletedAt: Schema.Date }),
  }),
  uiStateSet: tables.uiState.set,
}

const materializers = State.SQLite.materializers(events, {
  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
})

const state = State.SQLite.makeState({ tables, materializers })

export const schema = makeSchema({ events, state })

Add the LiveStore Provider

To make the LiveStore available throughout your app, wrap your app’s root component with the LiveStoreProvider component from @livestore/react. This provider manages your app’s data store, loading, and error states.

Here’s an example:

Root.tsx ListTodos.tsx NewTodo.tsx queries.ts schema.ts

import { makePersistedAdapter } from '@livestore/adapter-expo'
import { LiveStoreProvider } from '@livestore/react'
import { makeWsSync } from '@livestore/sync-cf/client'
import { StatusBar } from 'expo-status-bar'
import type { FC } from 'react'
import { unstable_batchedUpdates as batchUpdates, SafeAreaView, Text, View } from 'react-native'

import { ListTodos } from './components/ListTodos.tsx'
import { NewTodo } from './components/NewTodo.tsx'
import { events, schema, tables } from './livestore/schema.ts'

const storeId = 'expo-todomvc'
const syncUrl = 'https://example.org/sync'

const adapter = makePersistedAdapter({
  sync: { backend: makeWsSync({ url: syncUrl }) },
})

export const Root: FC = () => (
  <SafeAreaView style={{ flex: 1 }}>
    <LiveStoreProvider
      schema={schema}
      adapter={adapter}
      storeId={storeId}
      batchUpdates={batchUpdates}
      renderLoading={(status) => <Text>Loading LiveStore ({status.stage})...</Text>}
      renderError={(error) => <Text>Error: {String(error)}</Text>}
      renderShutdown={() => <Text>LiveStore shutdown</Text>}
      boot={(store) => {
        if (store.query(tables.todos.count()) === 0) {
          store.commit(events.todoCreated({ id: crypto.randomUUID(), text: 'Make coffee' }))
        }
      }}
    >
      <View style={{ flex: 1, gap: 24, padding: 24 }}>
        <NewTodo />
        <ListTodos />
      </View>
    </LiveStoreProvider>
    <StatusBar style="auto" />
  </SafeAreaView>
)

import { useQuery, useStore } from '@livestore/react'
import { type FC, useCallback } from 'react'
import { Button, ScrollView, Text, View } from 'react-native'

import { visibleTodos$ } from '../livestore/queries.ts'
import { events, type tables } from '../livestore/schema.ts'

export const ListTodos: FC = () => {
  const { store } = useStore()
  const todos = useQuery(visibleTodos$)

  const toggleTodo = useCallback(
    ({ id, completed }: typeof tables.todos.Type) => {
      store.commit(completed ? events.todoUncompleted({ id }) : events.todoCompleted({ id }))
    },
    [store],
  )

  const clearCompleted = () => store.commit(events.todoClearedCompleted({ deletedAt: new Date() }))

  return (
    <View style={{ flex: 1, gap: 16 }}>
      <ScrollView contentContainerStyle={{ gap: 12 }}>
        {todos.map((todo) => (
          <View
            key={todo.id}
            style={{
              borderRadius: 12,
              borderColor: '#d4d4d8',
              borderWidth: 1,
              padding: 16,
              gap: 8,
            }}
          >
            <Text style={{ fontSize: 16, fontWeight: '600' }}>{todo.text}</Text>
            <Text>{todo.completed ? 'Completed' : 'Pending'}</Text>
            <View style={{ flexDirection: 'row', gap: 12 }}>
              <Button title={todo.completed ? 'Mark pending' : 'Mark done'} onPress={() => toggleTodo(todo)} />
              <Button
                title="Delete"
                onPress={() => store.commit(events.todoDeleted({ id: todo.id, deletedAt: new Date() }))}
              />
            </View>
          </View>
        ))}
      </ScrollView>
      <Button title="Clear completed" onPress={clearCompleted} />
    </View>
  )
}

import { useQuery, useStore } from '@livestore/react'
import type { FC } from 'react'
import { Button, TextInput, View } from 'react-native'

import { uiState$ } from '../livestore/queries.ts'
import { events } from '../livestore/schema.ts'

export const NewTodo: FC = () => {
  const { store } = useStore()
  const { newTodoText } = useQuery(uiState$)

  const updateText = (text: string) => store.commit(events.uiStateSet({ newTodoText: text }))
  const createTodo = () =>
    store.commit(
      events.todoCreated({ id: crypto.randomUUID(), text: newTodoText }),
      events.uiStateSet({ newTodoText: '' }),
    )

  const addSampleTodos = () => {
    const todos = Array.from({ length: 5 }, (_, index) => ({
      id: crypto.randomUUID(),
      text: `Todo ${index + 1}`,
    }))
    store.commit(...todos.map((todo) => events.todoCreated(todo)))
  }

  return (
    <View style={{ gap: 12 }}>
      <TextInput value={newTodoText} onChangeText={updateText} placeholder="What needs to be done?" />
      <Button title="Add todo" onPress={createTodo} />
      <Button title="Add sample todos" onPress={addSampleTodos} />
    </View>
  )
}

import { queryDb } from '@livestore/livestore'

import { tables } from './schema.ts'

export const uiState$ = queryDb(tables.uiState.get(), { label: 'uiState' })

export const visibleTodos$ = queryDb(
  (get) => {
    const { filter } = get(uiState$)

    return tables.todos.where({
      deletedAt: null,
      completed: filter === 'all' ? undefined : filter === 'completed',
    })
  },
  { label: 'visibleTodos' },
)

import { Events, makeSchema, Schema, SessionIdSymbol, State } from '@livestore/livestore'

export const tables = {
  todos: State.SQLite.table({
    name: 'todos',
    columns: {
      id: State.SQLite.text({ primaryKey: true }),
      text: State.SQLite.text({ default: '' }),
      completed: State.SQLite.boolean({ default: false }),
      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
    },
  }),
  uiState: State.SQLite.clientDocument({
    name: 'uiState',
    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
  }),
}

export const events = {
  todoCreated: Events.synced({
    name: 'v1.TodoCreated',
    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
  }),
  todoCompleted: Events.synced({
    name: 'v1.TodoCompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoUncompleted: Events.synced({
    name: 'v1.TodoUncompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoDeleted: Events.synced({
    name: 'v1.TodoDeleted',
    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
  }),
  todoClearedCompleted: Events.synced({
    name: 'v1.TodoClearedCompleted',
    schema: Schema.Struct({ deletedAt: Schema.Date }),
  }),
  uiStateSet: tables.uiState.set,
}

const materializers = State.SQLite.materializers(events, {
  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
})

const state = State.SQLite.makeState({ tables, materializers })

export const schema = makeSchema({ events, state })

Commit events

After wrapping your app with the LiveStoreProvider, you can use the useStore hook from any component to commit events.

Here’s an example:

NewTodo.tsx queries.ts schema.ts

import { useQuery, useStore } from '@livestore/react'
import type { FC } from 'react'
import { Button, TextInput, View } from 'react-native'

import { uiState$ } from '../livestore/queries.ts'
import { events } from '../livestore/schema.ts'

export const NewTodo: FC = () => {
  const { store } = useStore()
  const { newTodoText } = useQuery(uiState$)

  const updateText = (text: string) => store.commit(events.uiStateSet({ newTodoText: text }))
  const createTodo = () =>
    store.commit(
      events.todoCreated({ id: crypto.randomUUID(), text: newTodoText }),
      events.uiStateSet({ newTodoText: '' }),
    )

  const addSampleTodos = () => {
    const todos = Array.from({ length: 5 }, (_, index) => ({
      id: crypto.randomUUID(),
      text: `Todo ${index + 1}`,
    }))
    store.commit(...todos.map((todo) => events.todoCreated(todo)))
  }

  return (
    <View style={{ gap: 12 }}>
      <TextInput value={newTodoText} onChangeText={updateText} placeholder="What needs to be done?" />
      <Button title="Add todo" onPress={createTodo} />
      <Button title="Add sample todos" onPress={addSampleTodos} />
    </View>
  )
}

import { queryDb } from '@livestore/livestore'

import { tables } from './schema.ts'

export const uiState$ = queryDb(tables.uiState.get(), { label: 'uiState' })

export const visibleTodos$ = queryDb(
  (get) => {
    const { filter } = get(uiState$)

    return tables.todos.where({
      deletedAt: null,
      completed: filter === 'all' ? undefined : filter === 'completed',
    })
  },
  { label: 'visibleTodos' },
)

import { Events, makeSchema, Schema, SessionIdSymbol, State } from '@livestore/livestore'

export const tables = {
  todos: State.SQLite.table({
    name: 'todos',
    columns: {
      id: State.SQLite.text({ primaryKey: true }),
      text: State.SQLite.text({ default: '' }),
      completed: State.SQLite.boolean({ default: false }),
      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
    },
  }),
  uiState: State.SQLite.clientDocument({
    name: 'uiState',
    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
  }),
}

export const events = {
  todoCreated: Events.synced({
    name: 'v1.TodoCreated',
    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
  }),
  todoCompleted: Events.synced({
    name: 'v1.TodoCompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoUncompleted: Events.synced({
    name: 'v1.TodoUncompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoDeleted: Events.synced({
    name: 'v1.TodoDeleted',
    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
  }),
  todoClearedCompleted: Events.synced({
    name: 'v1.TodoClearedCompleted',
    schema: Schema.Struct({ deletedAt: Schema.Date }),
  }),
  uiStateSet: tables.uiState.set,
}

const materializers = State.SQLite.materializers(events, {
  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
})

const state = State.SQLite.makeState({ tables, materializers })

export const schema = makeSchema({ events, state })

Queries

To retrieve data from the database, first define a query using queryDb from @livestore/livestore. Then, execute the query with the useQuery hook from @livestore/react.

Consider abstracting queries into a separate file to keep your code organized, though you can also define them directly within components if preferred.

Here’s an example:

ListTodos.tsx queries.ts schema.ts

import { useQuery, useStore } from '@livestore/react'
import { type FC, useCallback } from 'react'
import { Button, ScrollView, Text, View } from 'react-native'

import { visibleTodos$ } from '../livestore/queries.ts'
import { events, type tables } from '../livestore/schema.ts'

export const ListTodos: FC = () => {
  const { store } = useStore()
  const todos = useQuery(visibleTodos$)

  const toggleTodo = useCallback(
    ({ id, completed }: typeof tables.todos.Type) => {
      store.commit(completed ? events.todoUncompleted({ id }) : events.todoCompleted({ id }))
    },
    [store],
  )

  const clearCompleted = () => store.commit(events.todoClearedCompleted({ deletedAt: new Date() }))

  return (
    <View style={{ flex: 1, gap: 16 }}>
      <ScrollView contentContainerStyle={{ gap: 12 }}>
        {todos.map((todo) => (
          <View
            key={todo.id}
            style={{
              borderRadius: 12,
              borderColor: '#d4d4d8',
              borderWidth: 1,
              padding: 16,
              gap: 8,
            }}
          >
            <Text style={{ fontSize: 16, fontWeight: '600' }}>{todo.text}</Text>
            <Text>{todo.completed ? 'Completed' : 'Pending'}</Text>
            <View style={{ flexDirection: 'row', gap: 12 }}>
              <Button title={todo.completed ? 'Mark pending' : 'Mark done'} onPress={() => toggleTodo(todo)} />
              <Button
                title="Delete"
                onPress={() => store.commit(events.todoDeleted({ id: todo.id, deletedAt: new Date() }))}
              />
            </View>
          </View>
        ))}
      </ScrollView>
      <Button title="Clear completed" onPress={clearCompleted} />
    </View>
  )
}

import { queryDb } from '@livestore/livestore'

import { tables } from './schema.ts'

export const uiState$ = queryDb(tables.uiState.get(), { label: 'uiState' })

export const visibleTodos$ = queryDb(
  (get) => {
    const { filter } = get(uiState$)

    return tables.todos.where({
      deletedAt: null,
      completed: filter === 'all' ? undefined : filter === 'completed',
    })
  },
  { label: 'visibleTodos' },
)

import { Events, makeSchema, Schema, SessionIdSymbol, State } from '@livestore/livestore'

export const tables = {
  todos: State.SQLite.table({
    name: 'todos',
    columns: {
      id: State.SQLite.text({ primaryKey: true }),
      text: State.SQLite.text({ default: '' }),
      completed: State.SQLite.boolean({ default: false }),
      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
    },
  }),
  uiState: State.SQLite.clientDocument({
    name: 'uiState',
    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
  }),
}

export const events = {
  todoCreated: Events.synced({
    name: 'v1.TodoCreated',
    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
  }),
  todoCompleted: Events.synced({
    name: 'v1.TodoCompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoUncompleted: Events.synced({
    name: 'v1.TodoUncompleted',
    schema: Schema.Struct({ id: Schema.String }),
  }),
  todoDeleted: Events.synced({
    name: 'v1.TodoDeleted',
    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
  }),
  todoClearedCompleted: Events.synced({
    name: 'v1.TodoClearedCompleted',
    schema: Schema.Struct({ deletedAt: Schema.Date }),
  }),
  uiStateSet: tables.uiState.set,
}

const materializers = State.SQLite.materializers(events, {
  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
})

const state = State.SQLite.makeState({ tables, materializers })

export const schema = makeSchema({ events, state })

Devtools

To open the devtools, run the app and from your terminal press shift + m, then select LiveStore Devtools and press Enter.

This will open the devtools in a new tab in your default browser.

Use the devtools to inspect the state of your LiveStore database, execute events, track performance, and more.

Database location

With Expo Go

To open the database in Finder, run the following command in your terminal:

open $(find $(xcrun simctl get_app_container booted host.exp.Exponent data) -path "*/Documents/ExponentExperienceData/*livestore-expo*" -print -quit)/SQLite

With development builds

For development builds, the app SQLite database is stored in the app’s Library directory.

Example: /Users/<USERNAME>/Library/Developer/CoreSimulator/Devices/<DEVICE_ID>/data/Containers/Data/Application/<APP_ID>/Documents/SQLite/app.db

To open the database in Finder, run the following command in your terminal:

open $(xcrun simctl get_app_container booted [APP_BUNDLE_ID] data)/Documents/SQLite

Replace [APP_BUNDLE_ID] with your app’s bundle ID. e.g. dev.livestore.livestore-expo.

Further notes

• LiveStore doesn’t yet support Expo Web (see #130)