2026-07-04 19:36:04 +05:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00
2026-07-04 19:36:04 +05:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00
2026-07-04 14:25:02 +00:00

🌐 Muaz Bhutta — Portfolio

A simple, zero-dependency personal portfolio built with plain HTML, CSS & JavaScript

HTML5 CSS3 JavaScript

No build step. No framework. No CI/CD. No node_modules. Just clean HTML/CSS/JS you can open in a browser.


What's inside

  • 🌗 Great themes — Light, Dark, and Auto modes. Auto follows your system setting and switches live if you change it.
  • Fully static — zero dependencies beyond Google Fonts, so it loads instantly.
  • 📜 Scroll-reveal timeline — an animated, fully responsive career timeline.
  • 🗂️ Single-file content — everything lives in data.js. Edit one file, never touch the markup.
  • 📱 Responsive — looks good from desktop down to mobile.

📁 File Structure

portfolio/
├── index.html    → page structure
├── style.css     → design & theme tokens
├── script.js     → renders data.js into the page (no need to edit)
└── data.js       → ⭐ EDIT THIS FILE to add your content

✏️ Making it yours

All your content lives in data.js — name, about text, skills, projects, and credentials are just objects in arrays. To add a new project, add an object to the PROJECTS array:

{
  id: "unique-id",
  title: "Project Name",
  summary: "12 line description.",
  stack: ["Tech1", "Tech2"],
  link: "https://...",   // or "#" if there's no link
  status: "production",  // "production" or "lab"
},

💡 Skills, credentials, About paragraphs, and the timeline all work the same way — add or edit an object in the matching array. Nothing in index.html, style.css, or script.js needs to change.


🚀 Running it

These are static files, so "running" it just means opening it in a browser.

Option A (simplest): double-click index.html

Option B (recommended):

python3 -m http.server 8000

Then open http://localhost:8000.

That's it — no build, no dependencies, no pipeline.


🙌 Want to use it?

Go for it! Feel free to clone or download this project and use it as a starting point for your own portfolio. Just swap out the content in data.js for your own and you're done.


📬 Contact

Muaz Bhutta — Cloud & Network Infrastructure Engineer

Description
No description provided
Readme 86 KiB
Languages
JavaScript 54.2%
HTML 36.2%
CSS 9.6%