Media-Review: Cloud based collaborative media review application
Tags: hackwithdg, python, webdev, django
Published: 2022-04-09 20:28:24

<!-- Please delete anything appearing between angle brackets and create your own title before publishing your submission post.  -->

<!-- [Instructions]: # (To submit to the Deepgram Hackathon on DEV, please select the template that corresponds with the challenge you are submitting to and delete the content for the other submission type. You are encouraged to submit as many times as you would like, but please create a separate submission template for each project.) -->

<!-- ✨Pro Tip: You can link all of your submissions together by adding `series: {your series name here}` to each post in the header section – right between “tags” and “description. ✨ -->

— 

<!-- [Template 1: Build Challenge]: # (Select this submission template if you have built an application using Deepgram for this hackathon.) -->


### Overview of My Submission
Media-Review PWA (Progressive Web App) is a platform for review media by team collaboration in cloud, integrates reviewers, creators, content and tools needs to be more engaged and effective review process.
I have been building this application for quite a long time, when I see the Deepgram x DEV Hackathon, I knew that I can use Deepgram in this application for practical use. 
In the Media-Review app user creates a feedback by typing text or draw annotation.
Here Deepgram is a perfect match for feedback creation. Instead of typing feedback, user can use Speech-to-Text for creating feedback (especially user with an iPhone on the go).
Under the hood it uses MediaRecorder Web API on front-end for recording audio then it sends to the back-end for Deepgram, once the Deepgram response with transcript, back-end send back the transcript to the front-end.
This is a monolithic application and big, so below I have provided the right files on Github that point to the only Deepgram part of this application:

#####Front-end: React with Redux
React component to record audio and send to back-end: 
https://github.com/memoryInject/media-review-app/blob/main/frontend/src/components/TranscriptModal.js

MediaRecorder Web API integration:
https://github.com/memoryInject/media-review-app/blob/main/frontend/src/utils/captureAudio.js

#####Back-end: Django and Django REST framework
Deepgram view: 
https://github.com/memoryInject/media-review-app/blob/main/backend/transcript/views.py

#####NOTE: 
I am a back-end developer, apologies for my messy front-end code (it's much harder for me to refactor React front-end code).
 

[Note]: # (Please make sure the project links to the appropriate GitHub repository, and includes the [Apache-2 permissive license](https://www.apache.org/licenses/LICENSE-2.0)  and README.)


### Submission Category: 
Accessibility Advocates
<!-- [Note]: # (Accessibility Advocates, Analytics Ambassadors, Gram Gamers, Wacky Wildcards) -->


### Link to Code on GitHub
{% github https://github.com/memoryInject/media-review-app %}
<!-- [Note]: # (Our markdown editor supports pretty embeds. Try this syntax: `{% github link_to_your_repo %}` to share a GitHub repository) -->
<!-- [Note]: # (Your repository must include a README) -->
<!-- [Note]: # (You must use and list a permissive license for your code: MIT, Apache-2) -->


### Additional Resources / Info
Full product demo:
{% embed https://youtu.be/-kcfAHRd4jM %}

Deepgram feature demo:
{% embed https://youtu.be/eIB7KKYd2H0 %}

<!-- [Note:] # Screenshots/demo videos are encouraged! -->


—


<!-- [Reminder]: # (Submissions are due on April 11, 2022 @ 11:59 PM UTC) -->