Static portfolios are a thing of the past. They present a one-sided, lifeless view of a developer's journey. I decided to build yuvraj.bio to break that mold.
This project is an AI-powered, interactive portfolio that transforms the "About Me" page into a dynamic, engaging conversation. Instead of forcing recruiters, developers, and friends to scroll endlessly through information, it invites them to ask questions and receive answers tailored specifically to them.
It’s a portfolio that doesn't just show—it communicates.
- 🗣️ Interactive AI Avatar: Engage in real-time conversation. Ask anything from my tech stack to my hobbies and get instant, context-aware answers.
- 🧠 Context-Aware Engine: The AI's personality and responses adapt based on who it's talking to—whether you're a recruiter, a fellow developer, or a friend.
- 🎨 Dynamic & Responsive UI: A sleek, modern interface built with TailwindCSS and brought to life with Framer Motion animations.
- 🚀 Built for Everyone: Crafted to provide a unique experience for tech recruiters, potential collaborators, and curious friends alike.
- 💬 No More Boring Bios: This portfolio talks back.
| Category | Technology |
|---|---|
| Frontend | Next.js, React, Tailwind CSS, Framer Motion |
| Backend | Node.js, Next.js API Routes |
| AI & APIs | OpenAI API, Mistral API, GitHub API |
| Deployment | Vercel |
| Package Manager | pnpm |
Want to get this project running on your local machine? Follow these simple steps.
- Node.js (v18 or higher)
- pnpm package manager
- Mistral API Token
- GitHub API Token
-
Clone the repository:
git clone https://github.com/yuvraj0412s/Yuvi_portfolio.git cd Yuvi_portfolio -
Install dependencies:
pnpm install
-
Set up your environment variables: Create a
.env.localfile in the root of your project and add the following keys:MISTRAL_API_KEY="your_mistral_api_key_here" GITHUB_TOKEN="your_github_token_here"
- Get your Mistral API Key from admin.mistral.ai.
- Generate your GitHub Token at github.com/settings/tokens.
-
Run the development server:
pnpm dev
-
Open your browser and navigate to
http://localhost:3000.
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
- Fork the Project.
- Create your Feature Branch (
git checkout -b feature/AmazingFeature). - Commit your Changes (
git commit -m 'Add some AmazingFeature'). - Push to the Branch (
git push origin feature/AmazingFeature). - Open a Pull Request.
Please feel free to open an issue if you find a bug or have a feature suggestion.
For security issues, see SECURITY.md.
- Add more AI personality "modes"
- Integrate a project showcase with live demos
- Implement a light/dark theme toggle
- Add multilingual support for the AI chat
This project is open-sourced under the MIT License. See the LICENSE file for more information.
Yuvraj Singh - Let's connect!
#AIPortfolio #NextJS #React #Portfolio #Vercel #OpenAI #MistralAI #DeveloperPortfolio #WebDevelopment #InteractiveUI