Welcome to my portfolio! This is a modern, high-performance web application built with React.js. It features a unique Aura Glow design system, interactive UI components, and integrated AI/IoT project showcases.
Experience the Aura Glow effect and smooth Carousel transitions in action:
NITHINS._.portfolio_website.-.Google.Chrome.2026-02-21.13-18-44.1.mp4
Click the badge above to view the screen recording of the interface.
Unlike standard portfolios, this site uses a custom-engineered Aura Glow effect.
- Dynamic Interactivity: Headers and cards react to user presence with multi-layered CSS text-shadows and radial gradients.
- Cohesive Design: A unified visual language across About, Skills, Projects, and Publications.
- Theme Intelligence: Context-aware variables that adapt glow intensity based on Light or Dark mode.
A dedicated research showcase with advanced logic:
- Hybrid Layout: Displays a 2-card desktop view for readability and a single-card mobile view for focus.
- Adaptive Visibility: Long descriptions are automatically hidden on mobile to maintain a sleek, scroll-friendly interface.
- Interactive Metadata: Clickable ISBN badges and Citation buttons with integrated clipboard logic.
- Verified Credentials: Integrated SweetAlert2 popups for a smooth, high-end user experience when interacting with certificates.
- Orbiting Visuals: A creative "Gravity" component in the Resume section where core tech icons orbit your central profile.
| Category | Technologies |
|---|---|
| Core | React.js (Hooks, Context API), Vite, JavaScript (ES6+) |
| Styling | CSS3 (Modern Flexbox/Grid), Custom Aura Glow Design System |
| Communication | EmailJS SDK (Serverless Contact Handling) |
| Libraries | SweetAlert2, Lucide-React, Font-Awesome 6 |
| Performance | Optimized asset loading & cubic-bezier animations |
PORTFOLIO_WEBSITE/
┣ public/ # Static assets (PDFs, Profile Images)
┣ src/
┃ ┣ assets/ # React SVGs and media
┃ ┣ components/ # Core UI Components
┃ ┃ ┣ About.jsx # Personal Bio & Educational Details (with Aura Headings)
┃ ┃ ┣ Publications.jsx # ISBN Carousel & Adaptive Mobile View
┃ ┃ ┣ Internships.jsx # Industry experience timeline
┃ ┃ ┣ Contact.jsx # EmailJS Integrated Form
┃ ┃ ┗ ThemeContext.jsx # Global Light/Dark mode logic
┃ ┣ App.jsx # Main component orchestration
┃ ┗ index.css # Global design tokens and root variables
┣ vercel.json # Deployment configuration
┗ vite.config.js # Build optimization and proxy settings
- Clone the repository
git clone [https://github.com/NKumar-B/Portfolio.git](https://github.com/NKumar-B/Portfolio.git)
cd Portfolio
- Install dependencies
npm install
- Install UI Enhancements
npm install sweetalert2 lucide-react react-icons @emailjs/browser
- Launch Development Server
npm run dev
To make the contact form functional for your own use:
- Create a free account at EmailJS.
- Create a Service ID (Gmail) and an Email Template.
- Replace the Service ID, Template ID, and Public Key inside src/components/Contact.jsx.
The portfolio is meticulously optimized for all screen sizes:
- Desktop: Full "Aura" intensity with multi-column layouts.
- Laptop/Tablet: Fluid resizing of grids and carousels.
- Mobile: Minimalist view with hidden non-essential text (descriptions) and touch-optimized navigation buttons.
- Email: nithinkumarbadduluri@gmail.com
- LinkedIn: @Nithin Kumar Badduluri
- GitHub: @NKumar-B