Enkato’s mission is to enhance the quality of online videos by creating a better experience for students to watch the videos in. When creating an online education platform, it is a mix of designing features that can only be done in an online setting, while also pulling some of the techniques that are tried and tested in classic in-person educational settings.
One feature that will be a part of our video watching experience is the ability to ask questions while watching the video. This is because while students are learning in a class, questions are used to clarify misunderstandings that may occur at any point during the lecture. Additionally, students often learn a lot from hearing other questions that students may have. However, current online videos do not support easy ways to clarify understanding during the video and instead are usually watched through to completion before questions are asked.
For this project we would like you to design and implement a system for asking questions within educational videos. The system should have the following functionality:
- Ability to ask questions at any point during the video
- Ability to view other questions asked around a given point in a video/on a specific topic in the video
- Ability to create responses to questions; there shouldn’t be a limit on the number of responses per question.
- … etc? Feel free to be creative and implement anything else that you think would be good/cool/helpful.
You are provided with a base django-backend/react-frontend application that already allows users to embed Youtube videos and index them by topics. You should implement your question-asking functionality within the existing framework. The database is a local sqlite DB and the models for questions are already defined in backend/models.py. You may modify these as you see fit. Note: for simplicity we have excluded user login functionality so everything will be done anonymously. There is a field in the question/response table for “name” which you may include as part of the form to ask/respond to questions.
This is an extremely open ended project so there is no correct or incorrect way to do this. Additionally, this will probably be challenging if you don't have experience with these technologies. Just do your best and don't spend more than 3 - 4 hours. We just want to see how you go about getting started and designing the feature.
This project will be used to give us insight into three main things:
- Your thought process around the design and how you think about online education
- Your ability to develop within an existing infrastructure
- Your ability to problem-solve on your own and utilize resources to figure out technologies/methodologies that you may not have experience with already.
Just to be clear, don't worry if you don't finish and/or things are slightly broken. We just want to see what your thought process is and we'll talk more about that during the in-person interview. Just do your best and don't stress about it :) Additionally, don’t worry too much about the visual design. Focus on functionality and the user experience (i.e. how they interact and flow through the question-answering).
The following links are resources that you may find helpful to understanding the technologies involved. You will probably have to find more help from Googling but these can be a good starting point on broad topics:
- ReactJS tutorial: https://facebook.github.io/react/docs/tutorial.html
- Django docs: https://docs.djangoproject.com/en/1.9/
- Youtube Javascript API docs: https://developers.google.com/youtube/iframe_api_reference
First, setup a python virtualenv (pip install virtualenv) with the following command:
virtualenv name_of_project
Then go into the environment and activate it with the following command (MACS):
source bin/activate
(PC):
cd Scripts/
activate
cd ..
Now clone the repository into your virtualenv:
git clone https://github.com/rnvarma/enkato-swe-application
Now change into the repository folder for the next steps.
Run the following commands while your virtualenv is activated and you are in the top level directory of the repository:
sudo pip install -r requirements.txt
npm install
Create a file in the top-level called 'mac-pc-compatability.js'.
If you are using a mac, paste the following code into the file: module.exports = "."
If you are using a pc, paste the following code into the file: module.exports = "../.."
To launch server you need to launch the webpack server + django server:
Webpack cmd (MAC):
./node_modules/.bin/webpack --config webpack.config.js --watch
Webpack cmd (PC): first change directories into node_modules/.bin/ and run the following
webpack --config ../../webpack.config.js --watch
Django cmd:
python manage.py runserver