Skip to main content
Hero image for How I Built an AI Chat App with the Help of AI: A Look Under the Hood

How I Built an AI Chat App with the Help of AI: A Look Under the Hood


Hey everyone, I’m excited to share the story behind my latest project, ChatLima. It’s an AI chatbot that I’ve poured a ton of effort into, but here’s the twist: I’m not a developer. I’m a digital creator who, with the help of AI, was able to bring this project to life.

This entire project was written in Cursor, an AI-first code editor, with the heavy lifting done by my AI assistants, Claude Sonnet 3.5/4. It’s been an incredible journey of learning and creating, and it’s a testament to the power of AI as a creative partner.

I also want to give a huge shoutout to Zaid Mukaddam. This project was originally forked from his work, and his initial foundation was what made all of this possible.

A lot of you have been curious about how it all works, so I wanted to pull back the curtain and show you the tech that’s powering ChatLima.

The Foundation: Next.js and React

When I started, I knew I needed a framework that was powerful but also had a great community and a lot of resources. Next.js was the perfect choice. It’s a fantastic React framework that let me get up and running quickly. With the help of my AI assistants, I was able to learn the ropes of Next.js and take advantage of its powerful features like server-side rendering and API routes.

And of course, it’s all built on React. The component-based architecture of React made it easy for me to break down the UI into manageable pieces and build them one by one.

My Secret Weapon: TypeScript

As a non-developer, the idea of writing type-safe code was a bit intimidating at first. But with the help of AI, I was able to embrace TypeScript. It’s been a lifesaver. It helped me catch so many errors and understand the structure of the code much better.

Making It Look Good: The UI Stack

I’m not a designer, but I wanted ChatLima to have a clean and polished look. I used a combination of tools to get there:

  • Tailwind CSS: I love Tailwind. It let me experiment with different designs and build a custom UI without writing a single line of custom CSS.
  • Radix UI: This is a fantastic library of accessible, unstyled components that I used as the building blocks for my UI.
  • Lucide React: For a clean and consistent icon set.
  • Framer Motion: I used this to add some subtle animations and make the app feel more alive.
  • Sonner: For clean and simple toast notifications.

The Magic: The AI Stack

This is the heart of ChatLima. I wanted to create an app that could connect to a wide range of AI models, and here’s how I did it:

  • Vercel AI SDK: This SDK is amazing. It handles all the tricky parts of streaming responses from AI models, which is what makes the chat feel so interactive.
  • Connecting to the Brains: I’ve integrated a bunch of AI providers directly, like OpenAI, Anthropic, Google, and Groq. I’m also using OpenRouter and Requesty to access an even wider range of models. It’s been a blast playing with all of them and seeing what they can do.

Handling the Data: Neon, Drizzle, and React Query

The data layer was another area where I leaned heavily on AI to help me understand and implement the best solutions:

  • Neon: I’m using Neon for my database. It’s a serverless PostgreSQL provider, which is perfect for a solo creator like me. It’s cost-effective and scales automatically.
  • Drizzle ORM: This is a TypeScript ORM that gives me type-safe database queries. It’s been a huge help in preventing bugs and making sure my data is consistent.
  • React Query: For data fetching on the frontend, I’m using React Query. It makes the app feel fast and responsive.

Keeping It Secure: Authentication

For authentication, I’m using Better Auth. It was easy to set up and integrate with Next.js.

Keeping It Real: How I Test

Even though I’m not a traditional developer, I know how important testing is. With the help of AI, I was able to set up a testing suite with Playwright for end-to-end tests and Jest with React Testing Library for unit tests.

Final Thoughts

Building ChatLima has been one of the most challenging and rewarding experiences of my life. It’s shown me that with the right tools and the power of AI, anyone can build software. You don’t need to be a seasoned developer to bring your ideas to life.

I hope this has been inspiring! If you want to see the code for yourself, you can check it out on GitHub. And of course, I’d love for you to give ChatLima a try.