Building My First Portfolio Website with HTML, CSS, and JS
July 7, 2025
Before I ever touched React or any modern frameworks, I decided to build something from scratch: my own developer portfolio. No templates, no build tools just handcrafted HTML, CSS, and vanilla JavaScript.
I wanted to understand how the web actually works behind the scenes. Looking back, this project feels like the most important learning experience I’ve had so far.
You can still see the code on GitHub. Even though I’ve moved on to bigger projects, this little site was where it all began.
🛠 What I Built
- A clean homepage introducing who I am and what I’m passionate about
- A projects section to showcase my earliest experiments
- Fully responsive design using only CSS and media queries
- Smooth navigation and basic interactivity with vanilla JavaScript
- Simple, fast performance without any external dependencies
🧠 What I Learned
1. Mastering the Basics
This project taught me how powerful the fundamentals are. Understanding how HTML structures content, CSS controls presentation, and JavaScript drives interactivity has made me a stronger developer in every project since.
2. Real Responsive Design
I had to think critically about layout using flexbox, percent-based widths, and media queries to make sure the site looked good on phones, tablets, and desktops.
3. Version Control and Deployment
I learned how to set up a GitHub repository, commit changes properly, and use GitHub Pages to publish my site with a custom domain. Seeing my work live on the internet for the first time was an incredible feeling.
4. Debugging Without a Safety Net
No frameworks meant no abstractions to hide behind. Every bug, every broken layout, and every JavaScript error was mine to figure out. Spending hours in browser DevTools taught me patience and precision.
🎨 Screenshot
🔗 Explore It Yourself
📌 Final Thoughts
This wasn’t just a portfolio site it was the project that made me fall in love with building for the web. It taught me how to think like a developer and gave me the confidence to keep going.
If you’re just starting out, I’d recommend building something simple and real like this. No fancy frameworks, no shortcuts. Just you and the browser, learning by doing.
Thanks for reading! If you’d like to share your own first projects or swap ideas, feel free to reach out.
— Maruf