https://github.com/tharun977/my3dportfolio
A 3d parallax responsive portfolio website built on react-vite with three.js and framer-motion components.
https://github.com/tharun977/my3dportfolio
framer-motion portfolio-website react-vite responsive-design threejs
Last synced: 3 months ago
JSON representation
A 3d parallax responsive portfolio website built on react-vite with three.js and framer-motion components.
- Host: GitHub
- URL: https://github.com/tharun977/my3dportfolio
- Owner: tharun977
- License: mit
- Created: 2025-03-28T06:04:42.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-28T10:43:44.000Z (over 1 year ago)
- Last Synced: 2025-03-28T11:35:06.791Z (over 1 year ago)
- Topics: framer-motion, portfolio-website, react-vite, responsive-design, threejs
- Language: JavaScript
- Homepage: https://my3dportfoliowebsite.vercel.app
- Size: 9.35 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Responsive 3D Portfolio Website

## Introduction
This is the official code repository for my 3D developer portfolio website.
I built this 3D portfolio to showcase my work, skills, and experience in an interactive and visually stunning way. This website serves as a dynamic representation of my abilities, featuring Three.js animations, interactive elements, and parallax effects. My goal is to make an immediate impact on visitors, whether they are potential employers, clients, or collaborators.
## Video Guide
I built this portfolio website on the base of this Youtube video by ForrestKnight also it's one of the most simple ways to start getting into 3d design integration and three.js.I've added many other features which are not demonstrated in this video to make this my version and test my limits so if you want feel free to contact me if any queries about the project through the contact page on the website or by an issue.
[](https://youtu.be/f_ZxgQQ74Lc)
## Technologies Used
- **Vite** - Fast build tool for modern web projects
- **JavaScript** - Core programming language
- **React** - Library for building interactive UIs
- **Tailwind CSS** - Utility-first CSS framework for styling
- **Three.js** - 3D graphics and animations
- **Framer Motion** - Smooth animations and interactions
- **EmailJS** - Contact form email integration
- **GitHub** - Version control and CI/CD
## Features
- **3D Animated Background** - Fully interactive environment powered by Three.js
- **Parallax Effects** - Smooth motion for an immersive user experience
- **Responsive Design** - Optimized for all screen sizes and devices
- **Contact Form** - Users can send messages directly via EmailJS
- **Smooth Animations** - Enhanced user interactions using Framer Motion
## Resources & Inspiration
- [Spaceman Model by wallmasterr](https://sketchfab.com/3d-models/tenhun-falling-spaceman-fanart-9fd80b6a259f41fd99e6f56eee686dc5)
- [Planet Surface by jongjawi](https://stock.adobe.com/images/landscape-surface-of-planet-sky-space-science-fiction-fantasy-illustration/330880441?asset_id=330880441)
- [Position Animation by Teshank](https://github.com/teshank2137/portfolio)
## Installation & Usage
To run this project locally:
1. Clone the repository:
```sh
git clone https://github.com/tharun977/My3dportfolio.git
```
2. Navigate into the project directory:
```sh
cd My3dportfolio
```
3. Install dependencies:
```sh
npm install
```
4. Start the development server:
```sh
npm run dev
```
## Contact
If you have any questions or suggestions, feel free to reach out:
- **Email**: tharunraman10@gmail.com
- **GitHub**: [tharun977](https://github.com/tharun977)
- **LinkedIn**: [Tharun Raman](https://www.linkedin.com/in/tharunraman)
---
This project is a continuous work in progress. Contributions and feedback are always welcome!