Installation
Template Installation
Start from a template for JavaScript or TypeScript. Replace my-project
with your desired directory name.
JavaScript
$ npx degit almadoro/react-just/templates/node-js my-project
$ pnpx degit almadoro/react-just/templates/node-js my-project
$ bunx degit almadoro/react-just/templates/node-js my-project
TypeScript
$ npx degit almadoro/react-just/templates/node-ts my-project
$ pnpx degit almadoro/react-just/templates/node-ts my-project
$ bunx degit almadoro/react-just/templates/node-ts my-project
Manual Installation
Follow the steps below to manually install React Just in your project.
Packages Installation
Install React packages:
$ npm install [email protected] [email protected]
$ pnpm add [email protected] [email protected]
$ bun add [email protected] [email protected]
React 19.1.x recommended
The underlying APIs for React Server Components are not yet stable. The React team warns that these APIs may change between minor versions.
React Just has been tested with React 19.1 and should work with any patch version (19.1.x
). Compatibility with future versions is not guaranteed.
Install Vite and React Just as dev dependencies:
$ npm install -D vite@7 react-just
$ pnpm add -D vite@7 react-just
$ bun add -D vite@7 react-just
TypeScript Configuration (Optional)
For a minimal TypeScript setup, use the following configuration:
{
"compilerOptions": {
"moduleResolution": "bundler",
"module": "esnext",
"jsx": "preserve"
}
}
Vite Configuration
Create a Vite config file that uses the React Just plugin:
import react from "react-just/vite";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [react()],
});
Minimal App Component
For a working project, you need to add an App Component. Add a minimal version.
import { AppProps } from "react-just";
export default function App(props: AppProps) {
return (
<html>
<body>
<h1>Hello, World!</h1>
</body>
</html>
);
}
/**
* @param {import('react-just').AppProps} props
*/
export default function App(props) {
return (
<html>
<body>
<h1>Hello, World!</h1>
</body>
</html>
);
}
Development Server
Start the development server with the vite
command. For convenience, add the following script to your package.json
:
{
"scripts": {
"dev": "vite"
}
}
Then start the development server with:
$ npm run dev
$ pnpm dev
$ bun dev