Getting Started
Learn how to build with Bun React Framework
Installation
bun installCreating Routes
To create a new route, simply create a folder in the src/app directory and add either an index.tsx or page.tsx file.
// src/app/about/page.tsx
export default function AboutPage() {
return <div>About</div>;
}Nested Layouts
Create a layout.tsx file in any directory to wrap child routes with a layout component.
// src/app/dashboard/layout.tsx
export default function DashboardLayout({
children
}: {
children: React.ReactNode
}) {
return (
<div>
<nav>Dashboard Nav</nav>
{children}
</div>
);
}Static Pages
Use definePage() to create static pages:
import { definePage } from "~/framework/shared/page";
export default definePage({
type: 'static',
loader: async () => {
const data = await fetchData();
return { data };
},
component: ({ data }) => (
<div>{data.title}</div>
)
});Next Steps
Explore the interactive demos to see all features in action: