✅ How to Build a Personal Portfolio Website 🌐💼 

This project shows your skills, boosts your resume, and helps you stand out. Follow these steps:

1️⃣ Setup Your Environment 
• Install VS Code 
• Create a folder named portfolio 
• Add index.html, style.css, and script.js

2️⃣ Create the HTML Structure (index.html) 

html
<!DOCTYPE html>
<html>
<head>
  <title>Your Name</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <header>
    <h1>Your Name</h1>
    <nav>
      <a href="#about">About</a>
      <a href="#projects">Projects</a>
      <a href="#contact">Contact</a>
    </nav>
  </header>

  <section id="about">
    <h2>About Me</h2>
    <p>Short intro, skills, and goals</p>
  </section>

  <section id="projects">
    <h2>Projects</h2>
    <div class="project">Project 1</div>
    <div class="project">Project 2</div>
  </section>

  <section id="contact">
    <h2>Contact</h2>
    <p>Email: your@email.com</p>
  </section>

  <footer>© 2025 Your Name</footer>
</body>
</html>

3️⃣ Add CSS Styling (style.css) 

css
body {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
  background: #f5f5f5;
  color: #333;
}

header {
  background: #222;
  color: white;
  padding: 1rem;
  text-align: center;
}

nav a {
  margin: 0 1rem;
  color: white;
  text-decoration: none;
}

section {
  padding: 2rem;
}

.project {
  background: white;
  padding: 1rem;
  margin: 1rem 0;
  box-shadow: 0 0 5px rgba(0,0,0,0.1);
}

footer {
  text-align: center;
  padding: 1rem;
  background: #eee;
}

4️⃣ Add Interactivity (Optional - script.js) 
• Add smooth scroll, dark mode toggle, or animations if needed

5️⃣ Host Your Site 
• Push code to GitHub 
• Deploy with Netlify or Vercel (connect repo, click deploy)

6️⃣ Bonus Improvements 
• Make it mobile responsive (media queries) 
• Add a profile photo and social links 
• Use icons (Font Awesome)

💡 Keep updating it as you learn new things!