A modern, interactive portfolio website showcasing my journey as a Computer Science Engineering student, competitive programmer, and full-stack developer.
- Interstellar-inspired theme with space aesthetics
- Smooth parallax scrolling effects
- Custom cursor with glitter trail effects
- Dark/Light mode toggle with smooth transitions
- Responsive design optimized for all devices
- Framer Motion animations throughout
- Real-time LeetCode stats fetched from API
- 600+ problems solved
- Contest rating: 1695+ (Top 13% globally)
- Live difficulty breakdown (Easy/Medium/Hard)
- Project metrics with performance indicators
- Interactive project cards with hover effects
- Dynamic greetings based on time of day
- Performance optimized with lazy loading
- SEO friendly with meta tags
- Google Analytics integration
- Email contact form with EmailJS
- AI-powered suggestions in contact form
- Smooth page transitions
- React 18 - UI library
- TypeScript - Type safety
- Vite - Build tool & dev server
- Tailwind CSS - Utility-first styling
- Framer Motion - Animations
- Lucide React - Icon library
- Typed.js - Typing animations
- React Intersection Observer - Scroll animations
- EmailJS - Contact form functionality
- React GA4 - Google Analytics
- LeetCode API - Real-time coding stats
- Hugging Face API - AI suggestions
portfolio/
βββ public/
β βββ profile-2.jpg # Profile photo
β βββ resume.pdf # Resume (add your own)
β βββ [project-images] # Project screenshots
βββ src/
β βββ components/
β β βββ HeroSection.tsx # Landing section
β β βββ AboutSection.tsx # About me with skills
β β βββ ProjectsSection.tsx # Projects showcase
β β βββ BlogSection.tsx # Achievements & certifications
β β βββ ContactSection.tsx # Contact form
β β βββ Navigation.tsx # Navbar
β β βββ ResumeDownloadButton.tsx # Resume CTA
β β βββ ...
β βββ contexts/
β β βββ ThemeContext.tsx # Dark/Light mode
β βββ services/
β β βββ leetcodeApi.ts # LeetCode data fetching
β β βββ analytics.ts # Google Analytics
β βββ config/
β β βββ emailjs.ts # Email configuration
β βββ App.tsx # Main app component
βββ .env # Environment variables
βββ package.json
- Node.js 18+ and npm
-
Clone the repository
git clone https://github.com/Akshayy67/portfolio.git cd portfolio -
Install dependencies
npm install
-
Set up environment variables
Create a
.envfile in the root directory:VITE_EMAILJS_SERVICE_ID=your_service_id VITE_EMAILJS_TEMPLATE_ID=your_template_id VITE_EMAILJS_PUBLIC_KEY=your_public_key VITE_GA_TRACKING_ID=your_ga_tracking_id
-
Add your resume
Place your
resume.pdfin thepublic/folder -
Start development server
npm run dev
Open http://localhost:5173 in your browser
npm run buildThe optimized build will be in the dist/ folder.
npm run deployThis will deploy to GitHub Pages automatically.
- Animated name with typing effect
- Profile photo with glow effect
- Social media links (GitHub, LinkedIn)
- Dynamic greeting based on time
- FAANG-optimized developer profile
- Competitive programming achievements
- Technical skills with proficiency levels
- Solar system visualization
- Resume download button
- 12+ projects with live demos
- Performance metrics for each project
- Tech stack badges
- GitHub links
- "More Projects" expandable section
Featured Projects:
- SuperApp - AI-powered academic assistant (500+ users)
- LRU Cache - O(1) visualization tool
- URL Shortener - 1000+ req/sec throughput
- Contact Manager - Trie-based search (O(k) complexity)
- AVL Tree Visualizer - Self-balancing BST animations
- And more...
- Live LeetCode Dashboard
- Real-time problem count
- Difficulty breakdown
- Clickable to profile
- Hackathon wins
- Certifications (ML, ServiceNow CSA, Juniper Networks)
- Email contact form with validation
- AI-powered message suggestions
- Direct contact information
- Resume download option
- LinkedIn integration
- Lighthouse Score: 95+ (Performance, Accessibility, Best Practices, SEO)
- First Contentful Paint: < 1.5s
- Time to Interactive: < 3s
- Bundle Size: Optimized with code splitting
- Mobile Responsive: 100%
- Create account at EmailJS
- Create email service and template
- Add credentials to
.envfile
- Create GA4 property
- Get tracking ID
- Add to
.envfile
The portfolio automatically fetches stats from:
https://leetcode-api-faisalshohag.vercel.app/akshayjuluri
Update the username in src/services/leetcodeApi.ts to use your profile.
The portfolio uses an orange theme. To customize:
- Edit Tailwind config in
tailwind.config.js - Update CSS variables in
src/index.css
- Profile: Update
src/components/AboutSection.tsx - Projects: Update
src/components/ProjectsSection.tsx - Skills: Modify skills array in
AboutSection.tsx - Achievements: Update
src/components/BlogSection.tsx
- Place images in
public/folder - Reference as
/image-name.jpgin components
The portfolio tracks:
- Page views
- Section views (Hero, About, Projects, Contact)
- Button clicks
- Form submissions
- Resume downloads
View analytics in your Google Analytics dashboard.
This is a personal portfolio, but feel free to:
- Fork the repository
- Use it as a template for your own portfolio
- Submit issues for bugs
- Suggest improvements
This project is open source and available under the MIT License.
I'm Akshay Juluri, a Computer Science Engineering student at SNIST with a passion for:
- π§© Competitive Programming - 600+ LeetCode problems, Top 13% globally
- π» Full-Stack Development - React, Node.js, Python, Flutter
- π€ Machine Learning - Stanford/DeepLearning.AI certified
- π Hackathons - Winner of SNIST Summer Hackathon
- π CGPA: 8.1/10
- πͺ LeetCode: 600+ problems solved
- π Contest Rating: 1695+
- π Projects: 12+ deployed applications
- π Certifications: ML, ServiceNow CSA, Juniper Networks
- Email: akshayjuluri6704@gmail.com
- LinkedIn: akshay-juluri
- GitHub: @Akshayy67
- LeetCode: akshayjuluri
- Portfolio: akshayy67.github.io/portfolio
- Design inspiration from Interstellar movie aesthetics
- Icons from Lucide React
- Animations powered by Framer Motion
- LeetCode API by Faisal Shohag
β Star this repo if you found it helpful!
Made with β€οΈ by Akshay Juluri