Portfolio Website

A modern, responsive portfolio website built with React.js. This portfolio showcases your projects, skills, and provides a way for visitors to get in touch.

Features

• 🎨 Modern and beautiful UI design
• 📱 Fully responsive (mobile, tablet, desktop)
• ⚡ Smooth scrolling and animations
• 🎯 Clean and organized code structure
• 🚀 Fast and optimized performance

Sections

• Hero: Eye-catching introduction with call-to-action buttons
• About: Personal information and statistics
• Skills: Technical skills with progress bars
• Projects: Portfolio of your work with project cards
• Contact: Contact form and social media links

Getting Started

Prerequisites

• Node.js (v14 or higher)
• npm or yarn

Installation

1. Install dependencies:

npm install

2. Start the development server:

npm start

3. Open http://localhost:3000 in your browser.

Build for Production

npm run build

This creates an optimized production build in the build folder.

Customization

Update Personal Information

1. Hero Section (src/components/Hero.js):

   • Change "Your Name" to your actual name
   • Update the subtitle and description

2. About Section (src/components/About.js):

   • Update the about text with your story
   • Modify the statistics (projects, experience, clients)

3. Skills Section (src/components/Skills.js):

   • Update the skills array with your technologies
   • Adjust skill levels (0-100)

4. Projects Section (src/components/Projects.js):

   • Replace project data with your actual projects
   • Update links to your live demos and GitHub repositories

5. Contact Section (src/components/Contact.js):

   • Update social media links with your profiles
   • Change email address in the mailto link

Styling

• Main styles: src/App.css
• Component-specific styles: Each component has its own CSS file in src/components/

Colors

The main color scheme uses a purple gradient. To change colors:

• Primary gradient: #667eea to #764ba2 (used throughout the site)
• Update these values in the CSS files to match your brand

Project Structure

Portfelio/
├── public/
│   └── index.html
├── src/
│   ├── components/
│   │   ├── Header.js & Header.css
│   │   ├── Hero.js & Hero.css
│   │   ├── About.js & About.css
│   │   ├── Skills.js & Skills.css
│   │   ├── Projects.js & Projects.css
│   │   └── Contact.js & Contact.css
│   ├── App.js
│   ├── App.css
│   ├── index.js
│   └── index.css
├── package.json
└── README.md

Technologies Used

• React 18
• CSS3 (with modern features like Grid, Flexbox, and animations)
• React Scripts (Create React App)

License

This project is open source and available for personal use.

Contact

Feel free to customize this portfolio to match your style and showcase your work!