Folders and files

Name		Name	Last commit message	Last commit date
Latest commit History 762 Commits
.github		.github
public		public
src		src
.env.example		.env.example
.gitignore		.gitignore
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE.md		LICENSE.md
README.md		README.md
SECURITY.md		SECURITY.md
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
postcss.config.cjs		postcss.config.cjs
tailwind.config.ts		tailwind.config.ts
tsconfig.json		tsconfig.json
tsconfig.tsbuildinfo		tsconfig.tsbuildinfo
vite.config.ts		vite.config.ts
yarn.lock		yarn.lock

Repository files navigation

Modern 3D Portfolio using React, Three.js and Typescript

📔 Table of Contents

‼️ Folder Structure

Here is the folder structure of this app.

3d-portfolio/|- public/|-- desktop_pc/|-- planet/|-- apple-touch-icon.png|-- favicon.ico|-- favicon16.png|-- favicon32.png|- src/|-- assets/|--- company/|--- projects/|--- socials/|--- tech/|--- testimonials/|--- index.ts|-- components/|--- canvas/|--- about.tsx|--- banner.tsx|--- contact.tsx|--- experience.tsx|--- feedbacks.tsx|--- footer.tsx|--- hero.tsx|--- index.ts|--- loader.tsx|--- navbar.tsx|--- tech.tsx|--- works.tsx|-- constants/|--- index.ts|-- hoc/|--- index.ts|--- section-wrapper.tsx|-- utils/|--- lib.ts|--- motion.ts|-- app.tsx|-- env.d.ts|-- index.css|-- main.tsx|-- styles.ts|- .env|- .env.example|- .gitignore|- index.html|- package-lock.json|- package.json|- postcss.config.cjs|- tailwind.config.ts|- tsconfig.json|- vite.config.ts

🧰 Getting Started

Make sureGit andNodeJS is installed.
Clone this repository to your local computer.
Create.env file inroot directory.
Contents of.env:

# .env# email js configurationVITE_APP_SERVICE_ID=XXXXXXXXXXXXXXXXVITE_APP_TEMPLATE_ID=XXXXXXXXXXXXXXXXVITE_APP_EMAILJS_KEY=XXXXXXXXXXXXXXXXVITE_APP_EMAILJS_RECIEVER=your@email.com

Service ID (Replace VITE_APP_SERVICE_ID):

Visit the website where you are obtaining the service ID.
Log in to your account or sign up if needed.
Navigate to the section related to API keys or services.
Find and copy the Service ID associated with your account.

Template ID (Replace VITE_APP_TEMPLATE_ID):

VisitEmailJS Website.
Log in to your account or sign up if necessary.
Access the section for email templates or integration.
Locate the template you want to use and copy its Template ID.

EmailJS Public Key (Replace VITE_APP_EMAILJS_KEY):

Go to the EmailJS website.
Log in to your account or create one if you haven't.
Navigate to the dashboard or settings page.
Look for API keys or integration settings.
Copy the Public Key associated with your account.

EmailJS Receiver (Replace VITE_APP_EMAILJS_RECIEVER):

Choose the email address where you want to receive emails.
If needed, create an email address or use an existing one.
Ensure that the chosen email address is accessible and ready to receive emails.

Open terminal in root directory. Runnpm install --legacy-peer-deps oryarn install --legacy-peer-deps.
Now app is fully configured 👍 and you can start using this app using either one ofnpm run dev oryarn dev.

NOTE: Please make sure to keep your API keys and configuration values secure and do not expose them publicly.

📷 Screenshots:

⚙️ Tech Stack

🔧 Stats

🙌 Contribute

You might encounter some bugs while using this app. You are more than welcome to contribute. Just submit changes via pull request and I will review them before merging. Make sure you follow community guidelines.