Mask Chatbot

Make every a promote engineer

Comment

Inspiration

Welcome to the Mask Chatbot project! AI is revolutionizing our lives through advancements such as ChatGPT and other language models. A well-crafted prompt can significantly improve the results obtained with these models. This is where prompt engineers come in - their expertise lies in creating high-quality prompts. But what if we could make prompt engineering accessible to everyone? There is the Mask Chatbot, which makes everyone a prompt engineer.

What it does

At Mask Chatbot, we strongly believe in the power of reusable prompts. Our platform is designed to automatically generate prompts for you, allowing anyone to become a proficient prompt engineer, even if they are new to the field. Gone are the days of struggling to create effective prompts from scratch.

With Mask Chatbot, you can save time and effort by leveraging our prompt generation capabilities. We ensure that you get the most out of your AI interactions, while also encouraging you to custom your own prompt. What's more, we support sharing your chat history including the prompts.

By the way, don't worry about information leakage. Chat history and custom prompts are isolated from different users.

How we built it

Mask Chatbot built on Vercel and TiDB serverless.

Vercel provides a powerful infrastructure for hosting websites and services, making it an ideal choice for building and deploying the Mask Chatbot.

  1. Radix, Tailwindcss, Nextjs, and React are what we used as UI and frontend and deploy on Vercel.
  2. Next-auth GitHub provider powered by Vercel is used as auth.
  3. Vercel AI SDK is used to build interactive conversations.
  4. serverless function and edge function are used as our backend.

As for TiDB serverless, it brings htap abilities with high performance and low latency, enabling dynamic workloads of Mask Chabot. With it, not only we can provide service for a large number of people, but also we can do online analysis for the whole data.

  1. Use TiDB serverless to manage prompt, including the preset and the custom.
  2. Use TiDB serverless to store chat history for every user, so that users can share chats with a temp link.

Challenges we ran into

  1. As a backend engineer, UI design and front-end development takes a lot of time. We need to be familiar with next-js and UI component library

  2. Using TiDB serverless on Vercel is also a challenge for us. Firstly, we can not build a TCP connection with mysql2 driver to TiDB serverless from Vercel page directly. Secondly, nextjs fetch does not provide digest auth, preventing us from using the TiDB data service. The best practice is to build TCP connections or use TiDB data service in Serverless function rather than the edge function or page.

  3. How to initialize data for anyone who wants to build his own mask chatbot: we use Prisma to load schema and data during the build time.

Accomplishments that we're proud of

  1. We provide lots of preset prompts and enable the user to custom prompt. We also integrate the AI dialog box, so that users need not switch from different apps. Share chat with a temporary link is also supported with user isolation. In general, mask chatbot allows you to use AI more effectively, making everyone a prompt engineer.

  2. Based on Vercel, TiDB serverless integration, and Prisma. You can deploy a mask chatbot with one click: all you need to do is provide openAI API key and create a GitHub OAuth app for auth.

What's next for mask chatbot

  1. Different UI for different masks to optimize the user experience
  2. Personal data analysis panel for every user. For example, what problem do they prefer to ask or how many times do they share?

Built With

  • next-js
  • openai
  • prisma
  • tailwindcss
  • tidb-serverless
  • vercel
Share this project:

Updates