Welcome to my personal portfolio! This is a modern, interactive showcase of my work as a developer, built with cutting-edge technologies. Explore my projects, skills, and experiences through an immersive interface featuring stunning 3D animations and smooth interactions.
I'm a passionate Computer Engineering undergraduate with expertise in modern web technologies, 3D web development, and creating engaging user experiences. This portfolio demonstrates my technical skills and creative approach to solving problems. Each section is carefully crafted to showcase different aspects of my work and capabilities.
- 3D Hero Section: An interactive 3D scene that welcomes visitors with animated models and engaging visual effects
- Project Showcase: A curated selection of my best projects with descriptions and links
- Skills & Tech Stack: Animated display of technologies I'm proficient in
- Testimonials: Client feedback and recommendations
- Contact Section: Get in touch with me directly through an integrated contact form
- Responsive Design: Works seamlessly on all devices - desktop, tablet, and mobile
- High Performance: Optimized for speed with lazy loading and code splitting
- Frontend Framework: React 19
- Build Tool: Vite 7
- Styling: Tailwind CSS 4
- 3D Graphics: Three.js with React Three Fiber
- Animations: GSAP 3
- Email Service: EmailJS
- Backend/Database: Supabase
- Security: Cloudflare Turnstile
- UI Utilities: React Responsive, React CountUp
- Post-Processing: React Three Postprocessing
- Linting: ESLint
Want to run this portfolio locally or fork it for your own use? Follow these steps:
- npm or yarn package manager
- Clone the repository:
git clone https://github.com/ShamiD-1904/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_TURNSTILE_SITE_KEY=your_turnstile_key
VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_ANON_KEY=your_supabase_keyStart the development server:
npm run devOpen your browser and visit http://localhost:1904
npm run buildThe optimized production build will be in the dist folder.
portfolio/
├── src/
│ ├── components/ # Reusable React components
│ │ ├── HeroModels/ # 3D hero section components
│ │ └── Models/ # 3D model components
│ ├── sections/ # Main page sections
│ ├── styles/ # CSS stylesheets
│ ├── hooks/ # Custom React hooks
│ ├── lib/ # Utility libraries (email, supabase)
│ ├── animations/ # Animation utilities
│ ├── constants/ # Application constants
│ ├── App.jsx # Main App component
│ └── main.jsx # Entry point
├── public/ # Static assets
│ ├── images/
│ ├── models/ # 3D model files
│ ├── robots.txt
│ └── sitemap.xml
├── vite.config.js # Vite configuration
├── eslint.config.js # ESLint rules
├── package.json # Dependencies & scripts
└── README.md # This file
Hero Section An immersive 3D introduction with animated graphics and smooth transitions that sets the tone for the portfolio.
Project Showcase Browse through my selected projects with descriptions, technologies used, and links to live demos or repositories.
Skills An animated and 3d display showcasing my technical proficiencies and the tech stack I work with daily.
Testimonials Client and colleague feedback providing insights into my work style and impact.
Contact Reach out directly through the contact form. Messages are secure and spam-protected with Turnstile CAPTCHA.
##Configuration
The project includes optimized Vite settings with:
- Code splitting for vendor libraries (React, Three.js, GSAP)
- ES2020 target for modern browsers
- esbuild minification
- Source maps for debugging
Configured with Tailwind CSS 4 using the Vite plugin for better performance.
Visit my portfolio: shamiska darshana
I chose these technologies because they represent the modern web development landscape:
- React & Vite: Fast development experience and optimal performance
- Three.js & GSAP: Create stunning visual experiences that engage users
- Tailwind CSS: Build responsive, beautiful interfaces efficiently
- EmailJS & Supabase: Backend services that don't require a dedicated server
- Built with Vite for lightning-fast development
- Uses React Suspense for intelligent code splitting
- Implements GSAP animations for smooth, performant interactions
- Features Three.js for immersive 3D experiences
- Optimized for all devices with responsive design
- Includes comprehensive SEO with sitemap and meta tags
- Source maps enabled for easy debugging
This project is licensed under the MIT License - see the LICENSE file for details.
I'd love to hear from you! Whether you have questions about my work, want to collaborate, or just want to say hi:
📧 Email: [email protected]
💼 LinkedIn: Shamiska Darshana
🐙 GitHub: @ShamiD-1904
🌐 Portfolio: Visit Live
- React - For building amazing user interfaces
- Vite - For blazing fast development
- Three.js - For 3D graphics magic
- GSAP - For smooth animations
- Tailwind CSS - For beautiful, responsive design
- React Three Fiber - For React-friendly 3D
- EmailJS - For secure email delivery
- Supabase - For backend services
Made with ❤️ by Shamishka Darshana