Portfolio

A 3D-Portfolio Designed Using Vite - React along with Tailwind CSS for Designs, Three JS for 3D-Models, Email JS for Mail Management and FramerMotions for Diffrent Animation.

Installations

Installing Node Js and NPM:

Recommended : 18.16.0 LTS and above

Installing Dependencies

Note: --legacy-peer-deps is used for version Controls.

Creating a React Template via Vite:

npm create vite@latest ./ -- --template react

Installing and Initializing Tailwind CSS:

npm install -D tailwindcss

npx tailwindcss init

Installing Requirments:

npm install --legacy-peer-deps @react-three/fiber @react-three/drei maath react-tilt react-vertical-timeline-component @emailjs/browser framer-motion react-router-dom

Initializing Tailwind CSS Compatible for Vite:

npm install --legacy-peer-deps  -D postcss autoprefixer

npx tailwindcss init -p

Installing three:

npm install --legacy-peer-deps three

Additional Installations (Not Mandatory)

Visual Studio Code

Other Requirments

Creating and using a Service from Email.JS:

Outputs Required from the Services are:

SERVICE_KEY

TEMPLATE_KEY

PUBLIC_KEY

And Use the Above Three Here

Run Locally

Clone the project

  git clone https://github.com/k-arthik-r/Portfolio_main.git

Go to the project directory

  cd my-project

Install dependencies

  npm install

Start the server

  npm run start

Can also use

npm run dev

Deployment

To deploy this project run

  npm run deploy

Hosting

Usables:

The Current Project is Built and deployed Using Github Pages on live:

Features

Usage of 3D Models
Usage of Framer Motions
Usage of Email JS Services for Mailing System
Form Validations
Usage of Vertical Timeline and Tilt Cards

License

Output

Check out the Output site for the Project Here

Inspirations

Adrian

Feedback

If you have any feedback, please reach out to us at voidex.developer@gmail.com

k-arthik-r/Portfolio-Karthik