CompletedNext.jsReactTypeScript+3 more
AI Chatbot
A Next.js + DeepSeek-powered engineering assistant with streaming responses and syntax-highlighted code blocks.
Timeline
2 weeks
Role
Full Stack
Team
Solo
Status
CompletedTechnology Stack
Next.js
React
TypeScript
Tailwind CSS
Framer Motion
DeepSeek API
Key Challenges
- Streaming API responses
- Code syntax highlighting
- Responsive design
- Animation performance
Key Learnings
- DeepSeek API integration
- Streaming responses handling
- Framer Motion animations
- Mobile-first design
AI Chatbot: Engineering Assistant
Overview
An AI-powered engineering assistant built with Next.js and DeepSeek API, featuring streaming responses and syntax-highlighted code blocks for improved developer readability.
Key Features
- Streaming Responses: Real-time streaming of AI responses for reduced perceived latency
- Syntax Highlighting: Code blocks with proper syntax highlighting for various languages
- Responsive Design: Optimized for both desktop and mobile experiences
- Smooth Animations: Framer Motion powered text-generation animations
Tech Stack
- Next.js for the frontend framework
- React for UI components
- TypeScript for type safety
- Tailwind CSS for styling
- Framer Motion for animations
- DeepSeek API for AI responses
Development Highlights
- Built a modular React UI with Tailwind CSS and Framer Motion
- Enabled rapid iteration and smooth text-generation animations
- Implemented streaming API responses for better UX
- Created a polished, production-ready interface