Integration with Expo
Starting from Expo SDK 50, and App Router v3, Expo allows us to create API route directly in an Expo app.
- Create app/[...slugs]+api.ts
- Define an Elysia server
- Export Elysia.fetch name of HTTP methods you want to use
import { Elysia, t } from 'elysia'
const app = new Elysia()
.get('/', 'hello Expo')
.post('/', ({ body }) => body, {
body: t.Object({
name: t.String()
})
})
export const GET = app.fetch
export const POST = app.fetch
You can treat the Elysia server as if normal Expo API route.
Prefix
If you place an Elysia server not in the root directory of the app router, you need to annotate the prefix to the Elysia server.
For example, if you place Elysia server in app/api/[...slugs]+api.ts, you need to annotate prefix as /api to Elysia server.
import { Elysia, t } from 'elysia'
const app = new Elysia({ prefix: '/api' })
.get('/', 'Hello Expo')
.post('/', ({ body }) => body, {
body: t.Object({
name: t.String()
})
})
export const GET = app.fetch
export const POST = app.fetch
This will ensure that Elysia routing will work properly in any location you place it in.
Eden
We can add Eden for end-to-end type safety similar to tRPC.
- Export
type
from the Elysia server
import { Elysia } from 'elysia'
const app = new Elysia()
.get('/', 'Hello Nextjs')
.post(
'/user',
({ body }) => body,
{
body: treaty.schema('User', {
name: 'string'
})
}
)
export type app = typeof app
export const GET = app.fetch
export const POST = app.fetch
- Create a Treaty client
import { treaty } from '@elysiajs/eden'
import type { app } from '../app/[...slugs]+api'
export const api = treaty<app>('localhost:3000/api')
- Use the client in both server and client components
import { api } from '../lib/eden'
export default async function Page() {
const message = await api.get()
return <h1>Hello, {message}</h1>
}
Deployment
You can either directly use API route using Elysia and deploy as normal Elysia app normally if need or using experimental Expo server runtime.
If you are using Expo server runtime, you may use expo export
command to create optimized build for your expo app, this will include an Expo function which is using Elysia at dist/server/_expo/functions/[...slugs]+api.js
TIP
Please note that Expo Functions are treated as Edge functions instead of normal server, so running the Edge function directly will not allocate any port.
You may use the Expo function adapter provided by Expo to deploy your Edge Function.
Currently Expo support the following adapter: