React-360: How exactly do I incorporate react 360 into a larger js app (create-react-app)

Created on 21 Aug 2019  路  18Comments  路  Source: facebookarchive/react-360

Description

I need clarification to integrating react 360 into a larger application. For example, what files do I need to place in create-react-app? The documentation is not specific as to what to place where?

Reproduction

I have a fresh create-react-app folder structure:
Screen Shot 2019-08-21 at 12 23 23 PM

The following are quotes from the documentation:

  1. If you want to add your runtime code into part of a larger JS application, you can take the code found in your client.js file and place it into your app.

My issue is WHERE exactly do I place the client.js code in the application. Does it go in the src folder? In public? in its own separate folder?

  1. What about my index.js file? Where exactly do I place that file? Can I copy the contents of the index.js file and incoporate it into create-react-app's index.js file? It's not clear to me how that works.

  2. Do I need to create a separate div to attach?

This is what create-react-app attaches to <div id="root"></div>. How do I get my react 360 code to attach to that? Or do I need to create a separate attachment div inside of that one like the following?

`<div id="root">
    <div id="container"></div> #attach react code?
</div>`

Also, what is meant by this quote:

The recommended manner of embedding React 360 content into a larger web page is to use an Iframe. Point the src attribute of your