Skip to content
General

Build Facial Recognition and Chatbot AIs using TypeScript with Jack Herrington

Published Nov 11, 2024

Updated Nov 11, 2024

2 min read

In this JS Drop, Danny Thompson is joined by YouTuber Jack Herrington to explore a unique TypeScript and AI project that lets you recognize TV show characters in real time. Just point your camera at a character, and instantly get their details or even chat with them as if they were real! Jack walks through the tech, explaining how client-side face recognition and server-side AI work together to make this possible using the Versal AI library. They discuss prompt engineering, building efficient APIs, and ensuring smooth, interactive AI responses. Jack also shares potential real-world applications, from entertainment to security.

Chapters

  • 0:32 Project Overview – Jack explains the AI-powered character recognition project
  • 2:17 Setting Up the Project – Overview of how the application is structured and initial setup
  • 3:04 Client-Side AI – How face detection and character recognition work on the client side
  • 5:12 Switching to Server Side – Jack demonstrates server-side AI and setting up API endpoints
  • 8:20 Explaining AI Tooling – How tools and prompts are used to give context to the AI
  • 10:01 Detailed Prompt Structure – Breaking down the prompt and character context for AI responses
  • 12:40 Client-Server Interaction – Using the Versal AI library to manage streaming responses
  • 15:09 Handling Character Data – Training the AI on specific character images and details
  • 18:15 Practical Use Cases – Discussing potential real-world applications for the face recognition tool
  • 21:34 Challenges and Lessons Learned – Jack shares obstacles he faced and how he overcame them
  • 25:45 Building the API – Tips and considerations for creating reliable API endpoints
  • 28:40 Handling User Inputs – Testing unexpected questions and how the AI responds
  • 32:00 Using Advanced AI Models – Jack talks about choosing GPT-4 and issues with smaller models
  • 35:47 Introducing ProNextJS.dev – Jack discusses his new Next.js course, covering advanced topics
  • 37:20 Closing Thoughts – Danny and Jack wrap up with final thoughts and a link to the GitHub repo

Follow Jack Herrington on Social Media Twitter: https://x.com/jherr Linkedin: https://www.linkedin.com/in/jherr/ YouTube: https://www.youtube.com/@jherr

Sponsored by This Dot: thisdot.co

This Dot is a consultancy dedicated to guiding companies through their modernization and digital transformation journeys. Specializing in replatforming, modernizing, and launching new initiatives, we stand out by taking true ownership of your engineering projects.

We love helping teams with projects that have missed their deadlines or helping keep your strategic digital initiatives on course. Check out our case studies and our clients that trust us with their engineering.

Let's innovate together!

We're ready to be your trusted technical partners in your digital innovation journey.

Whether it's modernization or custom software solutions, our team of experts can guide you through best practices and how to build scalable, performant software that lasts.

Prefer email? hi@thisdot.co