VisMOOC+

Video hosting and clickstream analysis

VisMOOC+ is an experimental attempt to redesign the original VisMOOC of HKUST VisLab. It hosts video and collects clickstream data generated by the viewers. The main purpose is to help instructors to improve teaching through visualizing the collected data. More ambiously, try to provide visual analytics to students on their own generated data, to improve their learning.

Deployment

Prerequisite: Need to have docker and docker-compose ](https://docs.docker.com/compose/) installed on system.

First, create/edit web/config/production.js, you can take web/config/default.js as a reference. All the attributes of production.js will be merged to default.js to become a full config object. This project is based on Parse Server, all the configuration can be found on the Parse Server project page. Moreover, configuration is done by node-config, all valid ways of passing your configuration through node-config will be valid as well.

Second, you need build frontend distribution files. Edit front/config/prod.env.js to your configuration, and then install dependencies with yarn and build with npm run build. To avoid any mistakes being made, you need to copy the front/dist directory to the root directory of this project with name dist, alongside with the docker-compose.yaml files.

Prepare a video directory as well. You can ignore this if hosting video files on some other servers.

Run docker-compose -f docker-compose.prod.yaml up -d to spin up all the containers. Visit localhost:3000 to access the system, localhost:3000/dashboard to access Parse Dashboard. Add a reverse proxy if needed.

Security

Once system is up, and have access to parse dashboard, you will need to setup appropriate permissions to secure the server. Follow the steps to do so:

1. Go to the homepage and signup a user.
2. Go to dashboard and add a column admin with Boolean type.
3. Set the admin attribute of your user account as true.
4. Refresh the lecture page, there will be a link "Go to studio".
5. Create a lecture and visit it once.
6. Now, all the class schema should be ready. Go to dashboard, set Lecture class with only read access for Public, and full access for your admin user. Set Event class as only create access for Public.
7. Done.

Development

You can utilize the docker-compose.yaml file to spin up development environment. Be minded that you will need to install dependencies in the first run.

Simply run docker-compose up to spin up the development environment. You may edit docker-compose.yaml to run different commands.