🚀 React Animated Portfolio

A modern, fully responsive portfolio website built with React and GSAP animations. This project demonstrates smooth scroll-based animations, reusable React components, and a clean, professional UI/UX design.

✨ Features

Fully responsive design for all screen sizes (desktop, tablet, mobile)

Smooth GSAP animations triggered on scroll

Reusable React components for modular design

Optimized build for fast performance

Easy to customize and extend

🛠 Tech Stack

React 19

Vite (or Create React App)

Tailwind CSS for styling

GSAP (GreenSock Animation Platform) for animations

React Router for routing between sections/pages

📦 Installation & Setup 1️⃣ Clone the repository git clone https://github.com/AnkitPradhan2004/Portfolio.in.git

2️⃣ Navigate into the project folder cd react-animated-portfolio

3️⃣ Install dependencies npm install

4️⃣ Start the development server npm start

Open your browser and go to http://localhost:5173 (Vite) or http://localhost:3000 (CRA) to view your portfolio.

📁 Folder Structure react-animated-portfolio/ ├─ public/ # Static assets ├─ src/ │ ├─ assets/ # Images, icons, and media files │ ├─ components/ # Reusable React components │ ├─ sections/ # Portfolio sections like Hero, About, CTA │ ├─ App.jsx # Main React component │ ├─ main.jsx # Entry point (Vite) │ └─ index.css # Global styles ├─ package.json # Dependencies & scripts └─ README.md # Project documentation

🎨 Customisation

Colors & theme: Edit Tailwind CSS classes or tailwind.config.js

Fonts: Update via index.css or import Google Fonts

Sections: Add/remove sections inside src/sections

Animations: Modify GSAP animations in components using useGSAP or gsap

🚀 Deployment

Build the production-ready app:

npm run build

Deploy using Netlify, Vercel, or GitHub Pages.

Example for Netlify:

Drag and drop the dist/ folder (Vite) into Netlify deploy dashboard.

Or connect GitHub repo and set npm run build as build command.

📜 License

This project is open-source and free to use for personal or professional purposes.

💬 Author

Ankit Kumar Pradhan

GitHub: https://github.com/AnkitPradhan2004

LinkedIn: (https://www.linkedin.com/in/2004ankitpradhan/)