Curio, a web application which is serving as an open platform where anyone can come and translate their favourite YouTube videos in their desired languages to help bridge the gap of language and communication between mentors & learners. The web application in its initial stage of development contains the function of translation and view which will further be extended to machine dub as a future development.
- Frontend For the Frontend we are using ReactJs & NodeJs in order to bring functionality to it and for styling purposes we have used CSS3 along with some SASS. We are also making use of a number of react compatible modules to optimise things i.e. React Router DOM, RSuite, Semantic UI React etc.
- API We are taking use of Youtube V3 api to get the video data & search results based on the query & along with that we have also made a couple of APIs in order to connect the frontend to the backend usin AXIOS.
- Backend We have powered our backend with AWS thus we are using Amazon S3 buckets to store the recorded audios and to further retrieve them according to the respective video.
The idea is to link the students who are studying different languages to provide a platform where they can come and test their language skills by audio dubbing videos in the languages they are learning. The dub made by them will have to pass through a VALIDATION where they will get a review of their dub and can access their skills by the same.
We will compare the transcript of the dubbed audio and the converted transcript of the original audio in the dubbed language using google translator. If the matching percentage of the dub satisfies the minimum percentage criteria (we will decide the criteria using some algorithm) then we will accept it, otherwise the dubbing will be rejected.
- Make Sure You have
nodeJs
installed on your system & if not install it from here - Check the version of
node
on your system by running :
node --version
- Check the version of
npm
on your system by running :
npm --version
It should log the version of npm installed on your machine which means you're good to go.
- Clone the repository locally using:
git clone https://github.com/arjxn-py/Curio.git
- Now Go to the project directory & run:
npm i
- One installation command runs successfully, run:
npm start
It will automatically open up the application in the browser locally at http://localhost:3000
Congratulations, you've now successfully installed Curio locally.
Note: Replace your Youtube V3 API Key with process.env.REACT_APP_YT;
here
How to generate a Youtube API Key?
Component tree for contributors:
.
├── App
└── components/ └── comments/
├── AddComment
├── Comment
├── Comments
└── CommentsHeader └── Footer/
├── Footer
└── Twilio └── Header/
└── Header └── Recorder/
├── Recorder
└── UploadAudio └── UnderHeader/
├── APIError
├── Feature
├── SearchBar
└── UnderHeader └── Video/
├── Player
├── VideoItem
├── VideoList
└── translatedAudio |
See the website Curio
Watch Translated Video
Steps to play translated Video:
Go on our watch page and click on the 'Get Translated Audio' button.
Then play the youtube video with the translated audio.