💼 Personal Portfolio — Abilasha Selvanayakam

A personal portfolio website built with React, TypeScript, and Tailwind CSS, showcasing my projects, skills, and background as a Junior Full-Stack Developer.

🚀 Live Demo

🔗 Site: https://my-portfolio-webapp-ashy.vercel.app/

✨ Features

• 🏠 Home — introduction and quick overview
• 👤 About — background, skills, and education
• 💻 Projects — showcase of featured projects (AuraShop, Tamil Farmer Assistant, SmartFit, Student Score Prediction) with custom SVG project icons
• ✍️ Blog — writing/notes section
• 📬 Contact — functional contact form with a Gmail compose link
• 🎬 Scroll-triggered reveal animations throughout the site
• 📱 Fully responsive, mobile-first layout

🛠️ Tech Stack

• Framework: React 18 + TypeScript
• Build Tool: Vite
• Styling: Tailwind CSS
• Routing: React Router
• Icons: Lucide React
• Backend/Data: Supabase
• Deployment: Vercel

🏗️ Project Structure

my-portfolio
├── src/
│   ├── pages/         # Home, About, Projects, Blog, Contact
│   ├── components/     # Navbar, Footer, ProjectIcons, Reveal, ScrollToTop
│   ├── data/          # projects.ts, blogs.ts — content data
│   ├── context/
│   └── hooks/
├── public/
└── vercel.json

🏃 Getting Started

1. Clone the repository

git clone https://github.com/abilasha24/my-portfolio.git
cd my-portfolio

2. Install dependencies

npm install

3. Run locally

npm run dev

4. Build for production

npm run build

📌 Project Highlights

• Built with a modern React + TypeScript + Vite stack
• Custom scroll animations and hand-drawn SVG project icons
• Content-driven structure (projects/blogs defined as typed data, not hardcoded JSX)
• Deployed on Vercel with a working contact flow

👩‍💻 Author

Abilasha Selvanayakam

• GitHub: https://github.com/abilasha24
• LinkedIn: https://www.linkedin.com/in/abilashaselvanayakam2k06/
• Portfolio: https://my-portfolio-webapp-ashy.vercel.app/