https://github.com/codebucks27/next.js-creative-portfolio-website
Interactive 3D Portfolio Website with Next.js, Three.js & Tailwind CSS | Checkout the tutorial link ⚡
https://github.com/codebucks27/next.js-creative-portfolio-website
ai-images emailjs framer-motion nextjs portfolio portfolio-website react-hook-form sonner tailwindcss threejs
Last synced: 11 days ago
JSON representation
Interactive 3D Portfolio Website with Next.js, Three.js & Tailwind CSS | Checkout the tutorial link ⚡
- Host: GitHub
- URL: https://github.com/codebucks27/next.js-creative-portfolio-website
- Owner: codebucks27
- Created: 2024-03-06T09:49:04.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-08T11:32:21.000Z (2 months ago)
- Last Synced: 2025-03-27T05:11:25.375Z (27 days ago)
- Topics: ai-images, emailjs, framer-motion, nextjs, portfolio, portfolio-website, react-hook-form, sonner, tailwindcss, threejs
- Language: JavaScript
- Homepage: https://next-js-creative-portfolio-website.vercel.app
- Size: 11.9 MB
- Stars: 319
- Watchers: 5
- Forks: 105
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
Awesome Lists containing this project
README
# Next.js Creative Portfolio Tutorial: Build Amazing Portfolio Website with Next.js, Three.js, and Tailwind CSS 🔥
This repository contains **final code** for Next.js Creative Portfolio website built using Next.js and Three.js.
For Demo checkout following link👇:
[Nextjs Creative Portfolio Website Demo](https://next-js-creative-portfolio-website.vercel.app/)
Starter Code Files👇:
➡ Link 💚: [Nextjs Creative Portfolio Website Starter Code](https://github.com/codebucks27/Nextjs-Creative-Portfolio-Starter-Code-Files)
If you want to learn how to create it please follow below tutorial👇:
➡ Tutorial Link 💚: [Personal Portfolio Website with Next.js, Three.js & Tailwind CSS Tutorial](https://youtu.be/T5t46vuW8fo)
[](https://youtu.be/T5t46vuW8fo)
💚 Checkout my personal website [DevDreaming](https://devdreaming.com)
---
# ⭐DO NOT FORGET TO STAR THIS REPO⭐
---
## Images of The Portfolio Website:
#### Home
#### About
#### Projects
#### Contact
#### Mobile Version
## Resources Used in This Project
#### 3D Models
- ["Tim Mckee - Boy Wizard"](https://skfb.ly/6YATu) by [elbertwithane is licensed under Creative Commons Attribution ](http://creativecommons.org/licenses/by/4.0/).
- ["Stylized wizard hat"](https://skfb.ly/ozxOQ) by [Enkarra is licensed under Creative Commons Attribution](http://creativecommons.org/licenses/by/4.0/).
- ["Wizard Staff"](https://skfb.ly/6QYZw) by [Toymancer Studio is licensed under Creative Commons Attribution](http://creativecommons.org/licenses/by/4.0/).
#### AI Images
- Created with the help of [Playground AI](https://playgroundai.com/)
#### Github Stats & Details
- [Github ReadMe Stats](https://github.com/anuraghazra/github-readme-stats)
- [Skills Icons](https://github.com/tandpfun/skill-icons)
- [Github Readme Streak Stats](https://github.com/denvercoder1/github-readme-streak-stats)
#### Development Resources
- Fonts from [Google Fonts](https://fonts.google.com/)
- Icons from [Lucide Icons](https://lucide.dev/)
- Notifications from [Sonner](https://sonner.emilkowal.ski/)
- Form created using [react-hook-form](https://react-hook-form.com/)
- Animations using [framer-motion](https://www.framer.com/motion/)
- Emails using [Emailjs](https://www.emailjs.com/)
- Convert 3d models to JSX using [Gltf JSX](https://github.com/pmndrs/gltfjsx)
#### Audio
- Music by Shiden Beats Music from Pixabay
---
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
## Getting Started
First, install the dependencies and run the development server:
```bash
npm run install # to install all dependencies
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.