Learning React VR

1h 10mIntermediate2017-10-09

Authors

Emmanuel Henri

Executive with 20+ years of experience in programming and design

Course details

Developers who want to create virtual reality worlds have a new option: React VR. Facebook has extended its innovative JavaScript library, React, to immersive 3D. This new framework lets you deliver powerful VR experiences over the web, for a variety of devices, using declarative components. Join Emmanuel Henri in this course for an introduction to React VR. Learn how to work with the 3D coordinate system and transform commands; add and position primitives, static images, and models; integrate sound; and add interactivity such as clickable buttons. Emmanuel also provides some inspiration for taking the 360-degree panorama you build in the course to the next level, using your new React VR skills.

Learning objectives
Finding inspiration on the web
Testing projects with a Gear VR headset
Working with 3D coordinates and transforms
Building a 360-degree background
Adding primate components and 3D models
Adding sound and interactivity

Skills covered

Virtual RealityCross-Platform DevelopmentReact.jsMetaMobile DevelopmentVisualization and Real-TimeLearning

Concepts

0. Introduction

01 - Welcome
02 - What you should know
03 - Using the exercise files

1. Setting Up

04 - Introduction to React VR
05 - Testing with your browser
06 - VR content on the web for inspiration
07 - Initialization of the project
08 - Testing with your Gear VR headset

2. Overview of React VR Basics

09 - Project structure
10 - React concepts with React VR
11 - 3D coordinates and transforms
12 - React VR components overview

3. Build Our VR Components

13 - Add a 360-degree background with pano
14 - Add primitive components to the scene
15 - Add 3D models to the scene
16 - Add sound in 3D space
17 - Add VrButton for interactivity
18 - Change state and environment with button

Conclusion

19 - Next steps