react-server675fbba4
react-servertreemaindocssrcpagesen(pages)guidequick-start.mdx
docs/src/pages/en/(pages)/guide/quick-start.mdxmdx3.0 KiBb2535bb3

title: Quick Start order: 0 contents: false

import { Tabs, Tab } from "../../../../components/Tabs.jsx"; import Pnpm from "../../../../components/pnpm.jsx"; import Deno from "../../../../components/Deno.jsx";

Quick Start

Welcome to the @lazarv/react-server documentation! To start using this runtime, just create a file exporting a React Server Component as default and run the @lazarv/react-server command using npx with the path to the file. You need nothing else to start your first server-side rendered React application! Painfully simple, right?

export default function App() {
  return <h1>Hello, World!</h1>;
}
<Tabs name="runtime">

<Tab title={<><Pnpm className="w-4 max-h-4" />pnpm</>}>

pnpx @lazarv/react-server ./App.jsx
</Tab>

<Tab title={<><img src="/npm.svg" alt="npm" className="w-4" />npm</>}>

npx @lazarv/react-server ./App.jsx
</Tab>

<Tab title={<><img src="/yarn.svg" alt="yarn" className="w-4" />Yarn</>}>

yarn dlx @lazarv/react-server ./App.jsx
</Tab>

<Tab title={<><img src="/bun.svg" alt="bun" className="w-4" />Bun</>}>

bunx --bun @lazarv/react-server ./App.jsx
</Tab>

<Tab title={<><Deno className="w-4 max-h-4" />Deno</>}>

deno run -A npm:@lazarv/react-server ./App.jsx
</Tab></Tabs>

Continue your journey by exploring the guide and tutorials sections or learn more details about the features, the file-system based router or how you can deploy your app to a cloud provider. If you have any questions or need help, feel free to open an issue on GitHub. We are happy to help you!

To bootstrap your @lazarv/react-server project, you can also use @lazarv/create-react-server, the official CLI tool to create a new project and add initial tools, features and third-party integrations to your project with ease, just by answering a few questions. To use the tool, run:

<Tabs name="create">

<Tab title={<><Pnpm className="w-4 max-h-4" />pnpm</>}>

pnpx @lazarv/create-react-server
</Tab>

<Tab title={<><img src="/npm.svg" alt="npm" className="w-4" />npm</>}>

npx @lazarv/create-react-server
</Tab>

<Tab title={<><img src="/yarn.svg" alt="yarn" className="w-4" />Yarn</>}>

yarn dlx @lazarv/create-react-server
</Tab>

<Tab title={<><img src="/bun.svg" alt="bun" className="w-4" />Bun</>}>

bunx --bun @lazarv/create-react-server
</Tab>

<Tab title={<><Deno className="w-4 max-h-4" />Deno</>}>

deno run -A npm:@lazarv/create-react-server
</Tab></Tabs>

Completing the wizard, follow the instructions in your terminal to explore your new project and have fun!

Coming soon: third-party integrations for UI libraries, database providers, state management, authentication, and more — seamlessly available when bootstrapping your project with @lazarv/create-react-server. Stay tuned!

In the next chapter, you can find instructions on how to start from scratch with @lazarv/react-server.