A modern, responsive portfolio website showcasing my skills, projects, and experience as a Full Stack Developer. Built with Next.js, TypeScript, and Next.js API routes.
- Website: devrakshit.me
- Modern Design: Clean, responsive UI with dark/light mode
- Interactive Elements: Smooth animations with Framer Motion
- AI Chatbot: Intelligent chatbot powered by Google Gemini AI
- Contact Form: Email integration using Nodemailer
- API Routes: Server-side functionality with Next.js API routes
- Responsive Layout: Works perfectly on all devices
- SEO Optimized: Built-in SEO and performance optimization
- TypeScript: Full type safety and better development experience
- Framework: Next.js 14 with App Router
- Language: TypeScript
- Styling: Tailwind CSS
- Animations: Framer Motion
- Icons: Lucide React
- Email: Nodemailer
- AI Integration: Google Gemini API
- Deployment: Vercel
- Node.js 18+
- Git
-
Clone the repository
git clone https://github.com/rakshitjain23/portfolio_tagda.git cd portfolio_tagda -
Install dependencies
cd frontend npm install -
Set up environment variables
# Create .env.local file with your API keys # See ENVIRONMENT_SETUP.md for details
-
Run the development server
npm run dev
Application will be available at
http://localhost:3000
portfolio_tagda/
├── frontend/ # Next.js application
│ ├── app/ # App router pages and API routes
│ │ ├── page.tsx # Home page
│ │ ├── about/ # About page
│ │ ├── resume/ # Resume page
│ │ ├── projects/ # Projects page
│ │ ├── contact/ # Contact page
│ │ └── api/ # API routes
│ │ ├── contact/ # Contact form API
│ │ └── chat/ # AI chatbot API
│ ├── components/ # Reusable React components
│ │ ├── layout/ # Layout components (Navbar, etc.)
│ │ ├── chatbot.tsx # AI Chatbot component
│ │ └── ... # Other components
│ ├── public/ # Static assets
│ │ ├── profile.jpg # Profile image
│ │ └── resume.pdf # Resume file
│ ├── ENVIRONMENT_SETUP.md # Environment variables guide
│ └── DEPLOYMENT.md # Vercel deployment guide
│ └── package.json # Dependencies
└── README.md # This file
Create a .env.local file in the frontend directory:
# Email Configuration
EMAIL_USER=[email protected]
EMAIL_PASS=your-app-password
# AI Chatbot Configuration
GEMINI_API_KEY=your-gemini-api-keySee ENVIRONMENT_SETUP.md for detailed setup instructions.
- Connect your GitHub repository to Vercel
- Set environment variables in Vercel dashboard:
EMAIL_USER: Your Gmail addressEMAIL_PASS: Your Gmail app passwordGEMINI_API_KEY: Your Google Gemini API key
- Deploy automatically on push to main branch
- Hero section with animated profile
- Featured projects showcase
- Skills overview
- Call-to-action sections
- Personal introduction
- Skills grid with icons
- Journey timeline
- Professional background
- Interactive PDF viewer (desktop)
- Mobile-optimized download options
- Skills summary
- Contact information
- Project showcase with details
- GitHub links
- Live demo links
- Technology stack for each project
- Contact form with validation
- Email integration
- Social media links
- Professional contact information
- Intelligent responses about portfolio
- Real-time chat interface
- Mobile-responsive design
- Powered by Hugging Face AI
- Responsive Design: Works on all devices and screen sizes
- Dark/Light Mode: Toggle between themes
- Performance Optimized: Fast loading and smooth animations
- SEO Friendly: Built-in SEO optimization
- Accessibility: WCAG compliant design
- Modern UI/UX: Clean, professional design
- AI Chatbot: Portfolio-specific AI assistant powered by Google Gemini
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Email: [email protected]
- Phone: +91 7014518699
- Location: Jaipur, India
- Website: devrakshit.me
This project is open source and available under the MIT License.
⭐ Star this repository if you found it helpful !
Built with ❤️ by Rakshit Jain