DEV Community

Cover image for How to perfectly use Deepgram in React-JS? 😲
Jackson Kasi
Jackson Kasi Subscriber

Posted on β€’ Edited on

6 2

How to perfectly use Deepgram in React-JS? 😲

Simple speech recognition AI with Deepgram in React-JS 😁


Overview of My Submission: πŸ‘€

React developers' contribution to the Deepgram hackathon was minimal, so I created this.

Also in a lot of projects, does not handle browser audio properly. i.e. once the mic recording is turned on and then I can't turn off it.

I am not criticizing anyone for any project, I just say it could probably help others.
please forgive me if I offended you.

I hope this simple project of mine will help.

I would be very happy if anyone found this project helpful :)


Submission Category: 🎊

Wacky Wildcards


GitHub πŸ‘¨β€πŸ’»

Simple AI Speech Recognition with Deepgram on React-JS πŸ±β€πŸ’»

img

Deployment commands πŸ”§

Create a new directory, navigate to that directory in a terminal and clone the GitHub repository

git clone https://github.com/jacksonkasi0/simple-speech-recognition-with-deepgram-in-reactjs.git
Enter fullscreen mode Exit fullscreen mode

Change directory to the pattern directory:

cd simple-speech-recognition-with-deepgram-in-reactjs
Enter fullscreen mode Exit fullscreen mode

From the command line, you should Enter:

npm install 
Enter fullscreen mode Exit fullscreen mode

Past your Deepgram secret key on .env

REACT_APP_DEEPGRAM_KEY=< secret-key >

npm start
Enter fullscreen mode Exit fullscreen mode

happy coding πŸ€—πŸŽ‰


Web link πŸ”—:

https://ai-speech-recognition.netlify.app

Read more πŸ“–:

https://dev.to/jacksonkasi

About this application 🧐:

https://dev.to/jacksonkasi/how-to-perfectly-use-deepgram-in-react-js-1cef

Some life saving info πŸ€”πŸ’­:




Additional Resources / Info πŸ“–

Top comments (2)

Collapse
 
techjmi profile image
MD SHAMIM AKHTER β€’

bro i tried it is not working.... i am getting error like connection failed with websocket..

Collapse
 
jacksonkasi profile image
Jackson Kasi β€’

Hi @techjmi, it was built it, two years ago. I recommend checking the document once, as some things might have changed for the latest version of Deepgram models.

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

πŸ‘₯ Ideal for solo developers, teams, and cross-company projects

Learn more

AWS GenAI LIVE!

GenAI LIVE! is a dynamic live-streamed show exploring how AWS and our partners are helping organizations unlock real value with generative AI.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❀️