A React renderer for PlayCanvas β build interactive 3D applications using Reactβs declarative paradigm.
A React renderer for PlayCanvas β build interactive 3D applications using React's declarative paradigm.
@playcanvas/react is a thin React wrapper around the PlayCanvas 3D engine. It allows developers to create interactive 3D applications and games using React components and hooks, bringing the declarative and component-based architecture of React to PlayCanvas.
By leveraging React's features, you can build complex 3D scenes with reusable components, manage state efficiently, and create interactive experiences with ease.
Install the package via npm:
npm install @playcanvas/react
Ensure that you have the peer dependencies installed:
npm install react react-dom playcanvas
Here's a simple example to get you started with @playcanvas/react.
import React from 'react';
import { createRoot } from 'react-dom/client';
import { Application, Entity } from '@playcanvas/react'
import { Camera } from "@playcanvas/react/components"
import { OrbitControls } from "@playcanvas/react/scripts"
function App() {
return (
<Application>
<Entity>
<Camera/>
<OrbitControls />
</Entity>
<Entity >
<Render type='box' />
</Entity>
</Application>
);
}
const root = createRoot(document.getElementById('root'));
root.render(<App />);
We welcome contributions! Please read our Contributing Guide to get started.
If you encounter any issues or have questions, please open an issue on our GitHub repository.
Happy coding!