Hey dev community! 👋
I just finished building my portfolio as an AI Engineer, and I wanted to share the tech stack and some cool features I implemented.
🔗 Live Site: www.chihebnouri.live
The Stack
- Framework: Next.js 15 (App Router)
- Database: Supabase (PostgreSQL)
- Styling: Tailwind CSS 4
- AI Features: Groq API (Llama 3.3)
- Hosting: Vercel
- Diagrams: Mermaid.js
Features I'm Most Proud Of
1. AI Chatbot That Knows My Work
There's a chatbot that can answer questions about my projects, experience, and skills. It pulls context from my database so it always has accurate info.
2. Deep Dive Project Chat
Each project has its own AI assistant. Click "Deep Dive" on any project and you can ask technical questions about the architecture, challenges, and implementation.
3. Interactive Terminal Mode
Press the terminal icon and you get a CLI-style interface to explore my portfolio. Type help to see commands.
4. Smart Project Creator (Admin)
In the admin panel, I can paste a LinkedIn post or project description, and AI generates the full project structure - title, tags, highlights, tech stack, everything.
5. Mermaid Diagrams
Each project has an auto-generated data flow diagram showing the architecture visually.
Tech Highlights
- Real-time data: Everything comes from Supabase, so I can update content without redeploying
- Voice input: The chatbot supports speech-to-text
- Text-to-speech: AI responses can be read aloud
- Scroll animations: Smooth reveal animations as you scroll
- Dark mode: Full dark theme support
What I Learned
Building this taught me a lot about:
- Integrating LLMs into web apps
- Structuring data for AI context
- Making AI responses feel natural and conversational
- Optimizing for both SEO and user experience
About Me
I'm an AI Engineer from Tunisia specializing in computer vision. I've built production systems for shoplifting detection, violence monitoring, facial recognition, and automated retail checkout. Featured at HANNOVER MESSE 2025.
Check out the portfolio and let me know what you think! Happy to answer any questions about the implementation.
🌐 Portfolio: www.chihebnouri.live
💼 LinkedIn: linkedin.com/in/chiheb-nouri
🐙 GitHub: github.com/chih3b
Top comments (0)