Skip to content
Illustrated.dev logo
AboutResourcesFAQ

Illustrated Notes

Building VR Apps with React360 Notes

Published or updated on May 14, 2019

Turns out you can build almost anything in React now... including VR and AR apps inside a web browser.

There's a version of React called 'React 360' that simplifies the otherwise niche and overly-complex challenge of making things fly around in virtual 3D space.

Tomasz Lakomy made an entire egghead course that walks you through building VR Applications Using React 360

Course illustration of objects in 3D space

I've been sketching out notes on some of the basic concepts while watching the lessons.

VR apps with React 360

Let's us build 3D and VR apps on the web - without needing to learn crazy complex tools like WebGL. Instead we can just use React!

Uses flexbox for layouts. On the web it flexes across rows by default. But in VR it flexes downwards in a stacked columns. To add CSS styles to our views, we make a special React 360 stylesheet and then we pass them to the style tag.

Add 3D models to your components with the Entity tag. We can apply CSS transforms to these.


The Whole Illustrated Note


The full React 360 illustrated note

Want to learn more?

A high-res & printable version of the notes, plus the full course is avaliable here on the VR Applications Using React360 page.