https://github.com/nuhptr/threejs-portfolio
✅🚀 JSM Building portfolio website using three @react-three/fiber and other library using reactjs and tailwindcss
https://github.com/nuhptr/threejs-portfolio
react-three-fiber reactjs tailwindcss threejs
Last synced: 2 months ago
JSON representation
✅🚀 JSM Building portfolio website using three @react-three/fiber and other library using reactjs and tailwindcss
- Host: GitHub
- URL: https://github.com/nuhptr/threejs-portfolio
- Owner: nuhptr
- Created: 2023-10-23T10:03:14.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-04-16T15:38:29.000Z (about 2 years ago)
- Last Synced: 2025-01-21T08:44:41.580Z (over 1 year ago)
- Topics: react-three-fiber, reactjs, tailwindcss, threejs
- Language: JavaScript
- Homepage: https://threejs-portfolio-example.vercel.app/
- Size: 18.1 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Threejs Portfolio
Create a portfolio using threejs with some cool animations and effects.
## Getting Started
- Create Project (npm create vite@latest ./ -- --template react)
## Init Tailwind
- npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
- npx tailwindcss init -p
- update `content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],`
- index.css -> @tailwind base; @tailwind components; @tailwind utilities;
## Dependencies
- [three](https://docs.pmnd.rs/react-three-fiber/getting-started/introduction) - npm install three @react-three/fiber (3D Library)
- [react-three/drei](https://docs.pmnd.rs/drei/introduction) - npm install @react-three/drei (3D Library)
- [maath](https://github.com/pmndrs/maath) - npm install maath (Math Library)
- [react-tilt](https://www.npmjs.com/package/react-tilt) - npm install react-tilt (Tilt Effect / follow mouse effect)
- [react-vertical-timeline-component](https://www.npmjs.com/package/react-vertical-timeline-component) - npm install react-vertical-timeline-component (Timeline Library)
- [@emailjs/browser](https://www.npmjs.com/package/@emailjs/browser) - npm install @emailjs/browser (Sending Emails.)
- [framer-motion](https://www.npmjs.com/package/framer-motion) - npm install framer-motion (Animation Library)
- [react-router-dom](https://www.npmjs.com/package/react-router-dom) - npm install react-router-dom (Routing Library)