How I Built My Website with HTML, CSS, JS, Flask, and Azure Blob Storage š
AbdulKoomson.com is the fifth website I've builtāand easily the most functional. It started as a basic static site but has grown into a Flask-powered platform with backend integration using Azure Blob Storage to serve files and projects.
šØāš» My Web Development Journey
Several years ago, I took a beginner-friendly frontend development course. It taught me the basics: structure with HTML, styling with CSS, and interactivity with JavaScript.
After that, I built two simple demo websites. Nothing fancyājust enough to grasp the core concepts. Since then, Iāve built five websites. Two are currently live (which Iāll share in an upcoming post), and my first live project went online about three years ago.
š§ Tech Stack Behind AbdulKoomson.com
Frontend ā HTML, CSS & JavaScript
I hand-coded the site using semantic HTML, styled it with custom CSS, and used JavaScript for basic interactivity. Itās responsive, lightweight, and fastāno frameworks or dependencies, just clean markup.
Backend ā Flask
I integrated Flask to serve dynamic content and route project file downloads. Flaskās simplicity makes it ideal for personal sites and prototypes, and it pairs well with Python-based workflows.
File Sharing with Azure Blob Storage
To store and serve downloadable resources (like project samples and templates), I use
Azure Blob Storage. Through the Azure SDKās BlobServiceClient,
my Flask app connects to Azure and dynamically fetches files for users.
This keeps the site lightweight and scalableāno large files on the server, just clean blob references.
š Useful Links
- š My Website
- š Source Code on GitHub
- šØāš» My GitHub Profile
š Quick Primer: HTML, CSS & JS
What is HTML?
HTML (HyperText Markup Language) is the foundation of any web page. It defines the structure of the contentāheadings, paragraphs, buttons, forms, links, etc.
What is CSS?
CSS (Cascading Style Sheets) controls how that content looks. Itās responsible for colors, fonts, layout, and responsiveness across devices.
What is JavaScript?
JavaScript adds behavior. Want to show/hide something, validate a form, or update content without reloading the page? JS handles that magic.
š Whatās Next?
- Build an admin portal with Flask for blog publishing
- Pull project metadata dynamically from Azure
- Launch a public download section for open-source code
š§ Final Thoughts
Donāt underestimate the power of starting with the basics. HTML, CSS, and JS laid the foundation, and Flask + Azure took it further. This setup gives me full control over both frontend and backend with zero dependencies on heavy CMSs.
If you're just starting your web dev journey, I highly recommend building your own portfolio site from scratch. Itās the best way to truly understand how the web works.
Have questions about integrating Flask with Azure Blob or setting up your own personal site? Reach out anytime.