Personal Portfolio Website 🌐

📋 Table of Contents

1. 🤖 Introduction
2. ⚙️ Tech Stack
3. 📂 Project Structure
4. 🔋 Features
5. 🤸 Quick Start
   • Prerequisites
   • Cloning the Repository
   • Installation
   • Running the Project
6. 🔗 Links
7. 🚀 More

🤖 Introduction

This project is a personal portfolio website built using React.js. The portfolio highlights your education, experience, projects, and skills in a modern, visually appealing format. It includes responsive design, reusable components, and efficient code architecture.

⚙️ Tech Stack

Technology	Purpose
React.js	Frontend framework for building UI
Vite	Modern development server for React projects
CSS	Styling the website
ESLint	Code quality and linting

📂 Project Structure

The project follows an organized file structure:

src
├── components
│   ├── Card
│   │   ├── EducationCard.jsx
│   │   ├── ExperienceCard.jsx
│   │   └── ProjectCard.jsx
│   ├── Contact
│   │   └── index.jsx
│   ├── Education
│   │   └── index.jsx
│   ├── Experience
│   │   └── index.jsx
│   ├── Footer
│   │   └── index.jsx
│   ├── HeroBgAnimation
│   │   ├── HeroBgAnimationStyle.jsx
│   │   └── index.jsx
│   ├── HeroSection
│   │   └── index.jsx
│   ├── Navbar
│   │   └── index.jsx
│   ├── ProjectDetails
│   │   └── index.jsx
│   ├── Projects
│   │   └── index.jsx
│   └── Skills
│       └── index.jsx
├── data
│   └── constants.js
├── images
│   ├── favicon.jpeg
│   ├── heroImage.jpg
│   ├── heroImage2.jpg
│   └── heroImage3.jpg
├── utils
│   └── Themes.js
├── App.css
├── App.jsx
├── main.jsx
├── .eslintrc.cjs
├── .gitignore
├── LICENSE
├── README.md
├── index.html
├── package-lock.json
├── package.json
└── vite.config.js

🔋 Features

• 💻 Responsive Design: Ensures optimal viewing on all devices.
• 🔄 Reusable Components: Modular and maintainable code for scalability.
• 🖼️ Animated Backgrounds: Engaging hero section animation using HeroBgAnimation.
• 📝 Detailed Sections: Separate sections for education, experience, projects, and skills.
• 📇 Interactive Cards: Custom Card components for better data presentation.
• 🎨 Theme Support: Easily adjustable themes using Themes.js.

🤸 Quick Start

Get your portfolio up and running on your local environment by following these steps:

Prerequisites

Ensure you have the following installed:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

Clone the repository with:

git clone https://github.com/yourusername/your-portfolio-repo.git
cd your-portfolio-repo

Installation

Install the dependencies using npm:

npm install

Running the Project

Start the development server:

npm run dev

Navigate to http://localhost:5173 to view your portfolio.

🔗 Links

• Live Demo: Link
• GitHub Repository: Portfolio Repo

Author Sarthak Sachdev

• Website - Sarthak Sachdev
• LinkedIn - Sarthak Sachdev
• Twitter - @sarthak_sach69

🚀 More

Feel free to explore and contribute! Future updates may include new sections and more advanced animations.

Happy coding!! 😇👍🏻