description |
---|
How to setup RemixVR |
There are couple of things you need to understand about how RemixVR is setup before you start.
There are 3 main parts to RemixVR.
In the next section, you can see how to setup each part of RemixVR on your computer.
To make sure the projects runs on your machine, you need to have the following items installed on your machine.
First, we need to clone this Github repo and open the folder.
git clone https://github.com/teliportme/remixVR.git
cd remixVR
Once you're inside this folder, you can see 3 main folders which you should be aware of.
- Frontend
- Backend
- Templates
- Node.js
- Yarn
Install node.js on your machine. We'll be using node.js for running our development server and building our project using webpack.
We'll use yarn as our dependency manager. If you don't have yarn
on your machine, make sure to install yarn.
Once these are installed, go into the frontend folder.
cd frontend
Here we have to install the dependencies.
yarn install
This will download the project dependencies to node_modules
folder. Once it is complete, you can use the following command to start the frontend.
yarn start
The frontend part of RemixVR will now be available at http://localhost:3000/.
- Python 3
- Virtualenv
For RemixVR backend, we're using Flask framework. To install flask and all the dependencies, make sure you have Python 3 installed on your computer. If you're not sure you have Python installed, you can run the following command in your terminal.
python --version
If you have Python 3 installed, you'll get something like 3.x.x
as the result. If you get an error saying Python is not installed or if the Python version is 2.x.x
, then install Python 3.
Once you're ready with Python on your computer, you can go to the backend folder inside RemixVR directory.
cd backend
Once here, we'll first setup virtualenv
for our project. To install virtualenv
, run the following command.
pip install virtualenv
Once you've installed virtualenv
, create a new environment inside the backend
directory.
virtualenv env
This will create a new folder called env which will save all the python dependencies there. Once the setup is complete, you'll need to run the following command to start using the correct dependencies in env folder.
source env/bin/activate
Now you're ready to install the rest of Python dependencies. Since we're using virtualenv
, Python will use the version of dependency specified in env folder for our project.
When we finish working with backend, we can stop using the dependency versions in env folder by running the following command.
deactivate
If we didn't use virtualenv
, then all the dependencies will be shared with rest of the python projects, which makes it difficult to use correct version of dependency for your project.
Inside requirements folder, you can see there are two files, called dev.txt for development environment and prod.txt for __production __environment.
For our local machine, we'll download the dependencies in dev.txt. This includes additional packages used for development, compared to production environment.
pip install -r requirements/dev.txt
Once the installation is complete, all the backend dependencies for your project are installed.
There are couple more steps needed before we start our application.
First, set your app's secret key as an environment variable. For example, add the following to .bashrc
or .bash_profile
.
export remixvr_SECRET='something-really-secret'
Before running shell commands, set the FLASK_APP
and FLASK_DEBUG
environment variables
export FLASK_APP=/path/to/autoapp.py
export FLASK_DEBUG=1
{% hint style="warning" %}
In the above command, make sure FLASK_APP points to autoapp.py in your backend folder. For example, /projects/remixVR/backend/autoapp.py
{% endhint %}
Run the following commands to create your app's database tables and perform the initial migration
flask db init
flask db migrate
flask db upgrade
To run the web application use:
flask run --with-threads
This will start the backend at http://localhost:5000/
Templates in RemixVR is what makes VR possible inside RemixVR. All the VR based code lives inside templates.
To develop on templates shipped with RemixVR, you need to go inside templates folder inside remixvr directory.
cd templates
The templates in this directory share the dependencies in a common node_modules
folder by using yarn workspaces.
This reduces the amount of space used by dependencies when common dependencies are involved.
Once inside templates folder, run the following command to install the dependencies.
yarn install
All the templates are placed inside packages folder inside the templates folder.
cd packages
Inside packages folder, you can see the a folder for each of the template. You can go to any of the folder (for example, 360vr) and run the following command to open the template in development mode.
cd 360vr
yarn start
This will open the VR template in development mode inside your browser.
You can run the following command to build the template and get it ready for production.
yarn build
To learn more about templates and about how to create VR templates, you can learn them at Template section.