Skip to content

brandon-julio-t/t3-chat-clone

Repository files navigation

Challenge accepted: https://cloneathon.t3.chat

🛠️ Development

Step 1: Setup Infra

# setup .env
# [!] remember to setup `BETTER_AUTH_SECRET`, hint: try `npx nanoid` or something
# [!] need to se4tup `BLOB_READ_WRITE_TOKEN` from vercel KV
cp .env.example .env

# Install dependencies
bun install

# Setup DB
# Ideally prisma migrate dev, but for speed we use prisma db push
bun prisma db push

Step 2: Run the App

# Run Caddy reverse proxy to enable HTTP/2 to fix electric sql performance issue
# https://electric-sql.com/docs/guides/troubleshooting#slow-shapes-mdash-why-are-my-shapes-slow-in-the-browser-in-local-development
caddy run

# Start Docker containers (PostgreSQL and Electric SQL)
docker compose up

# Run development server
bun dev

AI Chat App Requirements

Core Requirements (Required)

  • Chat with Various LLMs: Implement support for multiple language models and providers

✅ OpenRouter

  • Authentication & Sync: User authentication with chat history synchronization

✅ Better-Auth + anonymous plugin

  • Browser Friendly: Ensure web-based functionality without native app requirements

✅ tailwindcss + shadcn/ui

  • Easy to Try: Provide simple way for users to test the application

https://t3-chat-clone-sigma.vercel.app/

Bonus Features

  • Attachment Support: Allow users to upload files (images and pdfs)

✅ AI SDK (experimental_attachments) + OpenRouter

image

Screen.Recording.2025-06-13.at.20.32.13.mp4
  • Image Generation Support: Add AI-powered image generation capabilities

✅ LangDB

image

  • Syntax Highlighting: Implement beautiful code formatting and highlighting

✅ React Shiki

image

  • Resumable Streams: Enable continuing generation after page refresh

✅ Electric SQL

Screen.Recording.2025-06-13.at.20.27.22.mp4

💡 Note: the refresh are triggered by me (CMD+R)

  • Chat Branching: Create alternative conversation paths

✅ Real world usage of linked list

Screen.Recording.2025-06-13.at.19.51.25.mp4
  • Chat Sharing: Allow sharing conversations with others

✅ Freeze the linked list

image

image

  • Web Search: Integrate real-time web search functionality

✅ OpenRouter

image

image

  • Bring Your Own Key: Support for custom API keys

✅ OpenRouter + Next.js cookie

image

image

  • Mobile App: Develop mobile version alongside web app

🚧 WIP, Thinking...

  • Custom Features: Add your own unique and creative features

🚧 WIP, Thinking...


Create T3 App

This is a T3 Stack project bootstrapped with create-t3-app.

What's next? How do I make an app with this?

We try to keep this project as simple as possible, so you can start with just the scaffolding we set up for you, and add additional things later when they become necessary.

If you are not familiar with the different technologies used in this project, please refer to the respective docs. If you still are in the wind, please join our Discord and ask for help.

Learn More

To learn more about the T3 Stack, take a look at the following resources:

You can check out the create-t3-app GitHub repository — your feedback and contributions are welcome!

How do I deploy this?

Follow our deployment guides for Vercel, Netlify and Docker for more information.

About

The "cloneathon” (https://cloneathon.t3.chat) to recreate LLM Chat UI (t3.chat, chatgpt.com, perplexity.com, claude.com, etc.)

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published