Interactive 3D portfolio showcasing frontend development expertise with a focus on modern web technologies and immersive user experiences. Built with React 18, Three.js, and TypeScript to demonstrate advanced technical capabilities.

View Portfolio →

• Frontend: React 18, TypeScript, Next.js
• 3D Graphics: Three.js, React Three Fiber, React Three Drei
• Styling: Tailwind CSS, SCSS
• Animation: Framer Motion, GSAP
• State Management: Context API, React Hooks
• Integration: EmailJS for contact functionality
• Deployment: Vercel with CI/CD

• Immersive Three.js scenes with custom lighting and materials
• Smooth 60fps animations across all devices
• Interactive 3D models and camera controls

• Lazy loading for 3D assets
• Optimized bundle size with code splitting
• Excellent Core Web Vitals scores
• Mobile-first responsive design

• Functional contact form with EmailJS
• Real-time form validation
• Professional email template system

• Scroll-triggered animations
• Parallax effects and micro-interactions
• Clean, minimalist design approach
• Cross-browser compatibility

abdelrahman-samy-dev/
├── src/
│   ├── components/          # Reusable React components
│   ├── scenes/             # Three.js 3D scenes
│   ├── hooks/              # Custom React hooks
│   ├── utils/              # Helper functions
│   ├── styles/             # Global styles and themes
│   └── assets/             # Static assets and 3D models
├── public/                 # Public assets
└── docs/                   # Documentation

• Type Safety: Full TypeScript implementation with strict type checking
• Component Architecture: Modular, reusable component design patterns
• 3D Performance: Optimized Three.js rendering with proper disposal and cleanup
• Responsive Design: Mobile-first approach with seamless cross-device experience
• SEO Optimized: Semantic HTML structure with proper meta tags

• Lighthouse Score: 95+ across all categories
• First Contentful Paint: < 1.5s
• Largest Contentful Paint: < 2.5s
• Cumulative Layout Shift: < 0.1

# Clone repository
git clone https://github.com/abdelrahman-samy-dev/abdelrahman-samy-dev.git

# Navigate to project directory
cd abdelrahman-samy-dev

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

Deployed on Vercel with automatic deployments from the main branch. The production build includes:

• Optimized asset bundling
• Automatic image optimization
• Global CDN distribution
• SSL certificate management

Frontend Developer with 1+ year of specialized experience in:

• React Ecosystem: React 18, Next.js 13/14, TypeScript
• 3D Web Development: Three.js, React Three Fiber
• E-commerce Solutions: Full-stack applications with Stripe integration
• Modern UI/UX: Advanced animations and responsive design

Full-featured e-commerce platform with authentication, cart management, and Stripe payments.

Modern AI-themed landing page with advanced CSS animations and responsive design.

CRUD application with TypeScript interfaces and modular component architecture.

Premium product showcase with Apple-inspired design and micro-interactions.

• Email: [email protected]
• Phone: +20 114 139 3811
• Location: Cairo, Egypt
• LinkedIn: Connect on LinkedIn

This project is licensed under the MIT License - see the LICENSE file for details.

Crafted with precision using React, Three.js, and TypeScript | © 2024 Abdelrahman Samy Ali