メインコンテンツまでスキップ

PlayCanvas React

PlayCanvas React は、PlayCanvas 3D エンジンのパワーを React エコシステムにもたらすモダンなライブラリです。使い慣れた React パターンを使用して、インタラクティブな 3D アプリケーションを構築するための宣言的でコンポーネントベースのアプローチを提供します。

詳細については、公式ドキュメントを参照するか、GitHub リポジトリをご覧ください。

細かい説明はひとまず置いて、まずは触ってみましょう。PlayCanvas React で試せる例をいくつか紹介します。

なぜ React なのか?

React は現代の Web 開発の中心であり、3D コンテンツはもはやゲームのためだけのものではありません。PlayCanvas React は、リアルタイム 3D を React エコシステムにもたらし、開発者がすでに使用しているツールやパターンを使って没入型の体験を構築できるようにします。フック、コンテキスト、コンポーネントコンポジションのサポートにより、これこそが React 流の 3D です。

詳細については、サンプルギャラリーをご覧ください。

エンジンの全能力、React のシンプルさ

PlayCanvas React は、直感的な React コンポーネントを介して PlayCanvas エンジン全体へのアクセスを提供し、強力なすべての機能がサードパーティライブラリを必要とせずに組み込まれています。

  • 物理エンジン – 完全な Ammo.js 統合
  • Gaussian Splats – 最先端の 3D ポイントクラウドレンダリング
  • ポインターイベント – React スタイルのイベント伝播とバブリング
  • アセットシステム – 宣言的および命令的なアセットのロード
  • スクリプト – 必要に応じたカスタムロジックのエスケープハッチ

クイックスタート

最も速い開始方法は、StackBlitz テンプレートを利用することです。これは、カメラとキューブを含む基本的なシーンをワンクリックで起動します。コードをフォーク、編集、またはクローンして、自分好みに変更してください。

または、始めるガイドに従うか、プロジェクトに直接インストールしてください:

npm install @playcanvas/react

その後、最初のシーンのチュートリアルに従って、PlayCanvas React コンポーネントと API を使用してシーンを構成する方法を学びましょう。

詳細

PlayCanvas React を使って次世代の 3D ウェブ体験を構築している開発者の成長するコミュニティに参加しましょう!