aframe-react-starter icon indicating copy to clipboard operation
aframe-react-starter copied to clipboard

A-Frame + React starter kit.

aframe-react-starter

An aframe-react starter kit with BrowserSync for auto-reloading.

Getting Started

To get started:

npm install
npm run dev

BrowserSync should open http://localhost:4200. To test on your phone, check your local network IP (http://192.168.x.x:4200).

Using Components

A-Frame uses attributes to render components so if you want to use the sky component:

<a-sky src="sky.png"></a-sky>

translate to:

<Entity
  geometry="primitive: sphere;
            radius: ${radius};
            segmentsWidth: ${segments-width};
            segmentsHeight: ${segments-height}"
  material="shader: flat;
            src: url(${src});
            color: ${color};
            fog: false"
  scale="-1 1 1">
</Entity>