A starter project to run your local server, and start sending voice packets to Deepgram

Overview

Deepgram Starter Kit

Hey all 👋

If you are here, then you probably got inspired by the amazing work that Deepgram has done with it's Speech-to-Text service.

Here is a simple guide how to get started with this project and have yourself speaking into you browser in no time!

If for some reason you found this repository with no context, watch both of these videos in order, and you should be up to date. 😉

Coding a website with my voice - Part 1

Coding a website with my voice - Part 2


Step #1

Create an account with Deepgram here, to get yourself $150 free credits (no credit card required).

Step #2

Once your account is created, generate yourself an API key. They have great instructions on their website which you can follow.

Step #3

Fork this repository and Clone it into you local folder on you machine.

Step #4

Add the newly generated API Key in the place of DEEPGRAM_API_KEY in the script.js file.

Step #5

Navigate to the project folder. Install all the dependancies by running npm install

Step #6

After the dependancies have installed, you can run the project with npm run dev to obtain your local IP address.

Step #7

As the Media Capture and Streams API requres a secure HTTPS connection to interact with your microphone, you will need to install some SSL certificates for your project.
Generate the certificates by running: mkcert YOUR_IP_HERE localhost
You can provide more than one IP address.

Step #8

Once those have been generated, you want to make sure they are placed in the root of your project.
Navigate to the /bundler/webpack.dev.js file, and replace YOUR_SSL_CERT_KEY and YOUR_SSL_CERT with a path to your certificate and key file generated in the previous step.

Step #9

Make sure all your files have been saved and run npm run dev again. Allow the browser to use your microphone.

Step #10

Say something! Hurray! Your text should be visible on the screen! Now it's your time to experiment! Happy coding!!! 🚀

You might also like...

A simple Vue3, Nuxt3 and Tailwind3 Starter Template

Nuxt 3 + Tailwind CSS 3 Starter This is a minimal starter template for Nuxt 3 projects with Tailwind CSS 3. It includes a simple template pages/index.

Feb 11, 2022

A Next + TypeScript Starter. Featuring Styled-Components, ESLint, Prettier, Axe a11y monitoring, Fathom analytics, sitemap generation, and more!

Next + TypeScript Starter A Next + TypeScript Starter by Justin Juno. Featuring Styled-Components, ESLint, Prettier, Axe a11y monitoring, Fathom analy

Dec 13, 2022

A highly opinionated and complete starter for Next.js projects ready to production

A highly opinionated and complete starter for Next.js projects ready to production

The aim for this starter is to give you a starting point with everything ready to work and launch to production. Web Vitals with 100% by default. Folder structure ready. Tooling ready. SEO ready. SSR ready.

Nov 27, 2022

Minimal Electron Starter Kit built with Typescript, React, Webpack 5 and Babel 7

electron-webpack-boilerplate Minimal Electron Starter Kit built with Typescript, React, Webpack 5 and Babel 7 To create a JS library, check out js-lib

Aug 16, 2022

React Starter Kit — isomorphic web app boilerplate (Node.js, Express, GraphQL, React.js, Babel, PostCSS, Webpack, Browsersync)

React Starter Kit — isomorphic web app boilerplate (Node.js, Express, GraphQL, React.js, Babel, PostCSS, Webpack, Browsersync)

React Starter Kit — "isomorphic" web app boilerplate React Starter Kit is an opinionated boilerplate for web development built on top of Node.js, Expr

Jan 1, 2023

A full-stack dApp starter built on Ethereum (Solidity) with Next.js (React).

A full stack dApp starter built on Ethereum (Solidity) with Next.js (React) This repo contains boilerplate code for interacting with a simple smart co

Dec 30, 2022

Next.js + Tailwind CSS + TypeScript starter packed with useful development features

Next.js + Tailwind CSS + TypeScript starter packed with useful development features

🔋 ts-nextjs-tailwind-starter Next.js + Tailwind CSS + TypeScript starter packed with useful development features. Made by Theodorus Clarence Features

Nov 12, 2022

Fastify + Typescript starter

Fastify + Typescript starter A really basic API template powered by: Fastify Typescript EsLint + Prettier Jest + Supertest Available scripts: npm run

Aug 24, 2022

NextJS Starter Example for Running Zesty.io CMS

NextJS Starter Example for Running Zesty.io CMS

Zesty.io + NextJS Getting Started Node and NPM need to be installed. From your command line.

Dec 8, 2022
Owner
Filip Grebowski
Computer Science graduate. Software Engineer at Cisco. YouTube creator, Getty Images contributor and a serious programmer.
Filip Grebowski
NodeJS library develop quick start: TypeScript + CI/CD + Release Workflow + Linter + Changelog + ...

node-lib-starter Start NodeJS + TypeScript library developing with ease, have fun! Include Lint Git Hooks Release workflow CI/CD Changelog Configurati

LinbuduLab 22 Oct 28, 2022
Very minimalistic boilerplate to start most Typescript Express projects. Includes Mongodb connection via Mongoose with a sample post model.

Minimalist express-typescript-boilerplate Available Scripts - `tsc' - builds the tsc project to the dist folder - `build` - cleans the previous build

Black Axe 16 Dec 13, 2022
A simple environment to start building on Starknet with Cairo

Starknet Boilerplate A simple environment to start building on Starknet with Cairo. Uses Nile for compilation/deployment and Starknetjs for contract i

threepwave 19 Dec 11, 2022
The deck, starter project, & final demo for @lachlanjc’s talk at PrideMakers 2021.

PrideMakers 2021 The deck, starter project, & final demo for @lachlanjc’s talk at PrideMakers 2021. Starter on Glitch: https://glitch.com/~pridemakers

Lachlan Campbell 3 Sep 24, 2021
Starting a new JS app? Build, test and run advanced apps with kyt 🔥

kyt Every sizable JavaScript web app needs a common foundation: a setup to build, run, test and lint your code. kyt is a toolkit that encapsulates and

The New York Times 1.9k Dec 26, 2022
Hi there! This is a react native starter which used to build a awesome Event Booking App based on the Figma design. You can download or clone it to speed up your projects.

mcrn-event-booking-app-starter Hi there! This is a react native starter which used to build a awesome Event Booking App based on the Figma design. You

Roy Chen 43 Dec 19, 2022
🚀 A well-structured boilerplate and Starter for Next.js 12+, Tailwind CSS 3, Redux, Redux Thunk, and TypeScript

?? A well-structured boilerplate and Starter for Next.js 12+, Tailwind CSS 3, Redux, Redux Thunk, and TypeScript ⚡️ Made with developer experience first ESLint + Prettier + Lint-Staged + VSCode setup

null 4 Nov 28, 2022
React + Redux starter kit / boilerplate with Babel, hot reloading, testing, linting and a working example app built in

A comprehensive starter kit for rapid application development using React. Why Slingshot? One command to get started - Type npm start to start develop

Cory House 9.8k Jan 3, 2023
A Gatsby starter using the latest Shopify plugin showcasing a store with product overview, individual product pages, and a cart

Gatsby Starter Shopify Kick off your next Shopify project with this boilerplate. This starter creates a store with a custom landing page, individual f

Brent Jackson 12 May 12, 2021
A Remix starter with intuitive defaults, like support for internationalization and localized URLs

?? Remix Starter A Remix starter with intuitive defaults, like support for internationalization and localized URLs. Coming soon: Authentication and au

Anand Chowdhary 51 Jan 8, 2023