https://github.com/majid-l/3d-portfolio
A responsive 3D React app featuring Three.js and serving as a portfolio site for my Github projects.
https://github.com/majid-l/3d-portfolio
react react-three-drei react-three-fiber react-three-postprocessing
Last synced: 8 months ago
JSON representation
A responsive 3D React app featuring Three.js and serving as a portfolio site for my Github projects.
- Host: GitHub
- URL: https://github.com/majid-l/3d-portfolio
- Owner: majid-L
- Created: 2023-02-19T06:00:10.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-06-12T10:34:09.000Z (over 2 years ago)
- Last Synced: 2024-12-28T04:23:49.294Z (10 months ago)
- Topics: react, react-three-drei, react-three-fiber, react-three-postprocessing
- Language: JavaScript
- Homepage: https://majid-L.github.io/3D-portfolio/
- Size: 31.1 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 3D React single-page application
Welcome to another one of my 3D projects with Three.js! This time, I have created a 3D scene that is mainly based on drei's text component and various image filter effects from three.js's postprocessing libraries.
The purpose of this app is to display the various projects I've worked on and to provide links to the repositories and hosted apps.
## App features:
- Interactive camera with fully controllable position and zoom.
- Control buttons to cycle through different projects.
- Various postprocessing effects, including bloom, scan lines, noise and a glitch effect.
- Loading screen utilising React's suspense component.
## Libraries used:
- Three.js
- React-three/fiber
- React-three/drei
- postprocessing & React-three/postprocessing
### A note on performance
This app is powered by **WebGL** and should run well on most modern browsers, including Chrome, Firefox, Internet Explorer, Opera and Safari. However, there is a small chance that you may experience poor performance on some browsers which do not properly support WebGL, such as Brave Web Browser.
On the off chance that you experience poor frame rates or stuttering animations on your chosen browser, switch to Google Chrome for best results.