Nathan's AI is a unique twist on the traditional portfolio. Instead of scrolling through pages of information, visitors can simply ask questions to learn about my career, skills, projects, and experiences. Built with Next.js, Tailwind CSS, and Vercel’s AI SDK, this chatbot acts as an interactive resume, letting you explore my journey in a conversational way.
The chatbot is designed to be simple and user-friendly. You can ask about my tech stack, past projects, where I studied, or anything else you'd find on a typical portfolio – and Nathan's AI will respond based on what it knows about me. It even has a friendly message for when you hit the rate limit, to keep things light-hearted.
This project showcases my skills in frontend development and my passion for creating engaging user experiences. It’s my portfolio, reimagined as a conversation.
This project uses the following services:
- Anthropic Claude: AI API
- Sentry: Error tracking
- Vercel: Hosting platform
- Vercel kv: Redis database (for rate limiting)
- Vercel postgres: Postgres database (for saving conversations)
- Empty Screen: Cal.com
- Messages animation: Build UI
- Title animation: @jh3yy
- Themes: ui/jln
- Themes picker: shadcn/ui
- Clone the repository:
https://github.com/NathanBrodin/Chat.git- Navigate to the project folder:
cd Chat- Install packages using Bun:
bun install- Set up environment variables:
On macOS/Linux:
cp .env.example .env.localOn Windows:
Copy-Item .env.example .env.local
-
Get your Anthropic api key and paste it in
.env.local. -
Create a kv database on Vercel and paste environment variables it in
.env.local. -
Create a postgres database on Vercel so you can save the conversations.
-
Run the dev server:
bun run devThat's it, you are all set!
This project is deployed on Vercel. Click the button below to deploy the chat in seconds!