Skip to content

puneetnith28/Portfolio-Website

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌟 3D Portfolio Website

React Three.js Styled Components Framer Motion

A Modern, Interactive & Responsive Portfolio Website Built with React.js

Live Demo · Report Bug · Request Feature


🎯 About The Project

This is a modern, fully responsive portfolio website designed to showcase skills, projects, experience, education, and achievements in an interactive and visually appealing manner. Built with cutting-edge web technologies, it features stunning 3D graphics, smooth animations, and a clean user interface.

The portfolio is designed for developers, engineers, and tech enthusiasts who want to make a strong impression with a professional online presence.

✨ Key Highlights

  • 🎨 3D Animated Star Field Background - Built with Three.js and React Three Fiber
  • 📱 Fully Responsive Design - Works seamlessly on all devices
  • 🎭 Dynamic Typewriter Effect - Eye-catching hero section
  • 🎨 Modern UI/UX - Clean, minimalistic design with styled-components
  • 🚀 Fast Performance - Optimized for speed and efficiency
  • 🔗 Social Media Links - Easy access to LinkedIn, Instagram, and Resume

🚀 Features

Core Features

  • Interactive Hero Section with typewriter animation displaying multiple roles
  • 3D Starfield Background using Three.js for immersive visual experience
  • Skills Showcase with organized categories (Technical & Tools)
  • Experience Timeline displaying professional journey with detailed descriptions
  • Project Gallery with live links and GitHub repositories
  • Certificates Section to highlight achievements
  • Education Timeline showing academic background
  • Contact Footer with social media integration
  • Smooth Scroll Navigation with sticky navbar
  • Mobile-Responsive Menu with hamburger icon
  • Framer Motion Animations for elegant page transitions
  • Theme Support with styled-components theming system

Technical Features

  • 🔧 Component-Based Architecture for maintainability
  • 🔧 Reusable Card Components for consistent design
  • 🔧 Centralized Data Management via constants file
  • 🔧 Optimized Performance with React best practices
  • 🔧 SEO Friendly structure
  • 🔧 Clean Code with proper organization

🛠️ Tech Stack

<<<<<<< HEAD

Frontend

  • React.js
  • React Router
  • Styled Components
  • Material UI

3D & Animations

  • Three.js
  • @react-three/fiber & drei
  • Framer Motion

=======

Frontend Framework & Libraries

Technology Version Purpose
React.js 18.2.0 Core frontend framework
React DOM 18.2.0 DOM rendering
React Router DOM 6.22.1 Client-side routing
Styled Components 6.1.8 CSS-in-JS styling

3D Graphics & Animation

Technology Version Purpose
Three.js 0.161.0 3D graphics library
@react-three/fiber 8.15.16 React renderer for Three.js
@react-three/drei 9.99.0 Helper components for R3F
Framer Motion 11.0.5 Animation library
maath 0.10.7 Math utilities for 3D

UI Components & Utilities

Technology Version Purpose
Material-UI 5.15.10 UI components library
React Icons 5.5.0 Icon library
React Vertical Timeline 3.6.0 Timeline component
React Tilt 1.0.2 Tilt effect component
Typewriter Effect 2.21.0 Typing animation
React Scroll 1.9.0 Smooth scrolling

Build Tools

Technology Version Purpose
React Scripts 5.0.1 Build configuration
Web Vitals 2.1.4 Performance metrics

eb3f2a0 (Updating)

About

A modern developer portfolio built using React.js and Styled-Components for a sleek, responsive design.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors