Book Image

Getting Started with React VR

By : John Gwinner
Book Image

Getting Started with React VR

By: John Gwinner

Overview of this book

This book takes you on a journey to create intuitive and interactive Virtual Reality experiences by creating your first VR application using React VR 2.0.0. It starts by getting you up to speed with Virtual Reality (VR) and React VR components. It teaches you what Virtual Reality (VR) really is, why it works, how to describe 3D objects, the installation of Node.js (version 9.2.0) and WebVR browser. You will learn 3D polygon modeling, texturing, animating virtual objects and adding sound to your VR world. You will also discover ways to extend React VR with new features and native Three.js. You will learn how to include existing high-performance web code into your VR app. This book will also take you through upgrading and publishing your app. By the end of this book, you'll have a deep knowledge of Virtual Reality and a full-fledged working VR app to add to your profile!
Table of Contents (20 chapters)
Title Page
About the Author
About the Reviewers
Customer Feedback

Native modules and views

Maybe you do know three.js and need to use it. React Native modules are how your code can directly include raw three.js programming. This is very useful if you need to programmatically create native three.js objects, modify material attributes, or use other three.js code that isn't directly exposed by React VR.

You may have some JavaScript code that does business logic, and don't want to, or can't rewrite that as React VR components. You might need to access three.js or WebVR components from React VR. You might need to build a high-performance database query with multiple threads so that the main rendering loop doesn't slow down. All of these things are possible with React Native.

This is a fairly advanced topic and will not normally be required to write engaging, effective WebVR demos; still, it's fantastic knowing that React VR and React are so extensible. 

Making a three.js cube demo

First, let's take a look at a simple box demo. Let's start with a freshly generated...