Overview
This post is a quick look at how I made this portfolio website.
The main idea behind the website was simple. I wanted one place that shows my cybersecurity learning, projects, certifications, blog posts, book reviews, and anything I build later in a clean and organized way.
Technologies Used
I built the website using Astro.
I chose Astro because it works well for content-focused websites like portfolios and blogs. Since most of the website is static, Astro helps keep everything fast and lightweight.
The main technologies used are:
Astro for the website structure and routing.
Markdown for writing and managing blog posts.
CSS for styling and layout.
Content Collections for organizing blog content and generating pages automatically.
Development Process
Most of the work went into building reusable components and organizing content.
I created separate components for sections such as the navigation bar, project cards, blog cards, and footer. This made it easier to update parts of the website without changing multiple files.
For the blog, I used Astro Content Collections so posts could be written in Markdown and automatically displayed on the site. This made adding new posts much simpler because I only need to create a new Markdown file.
I also added features such as blog filtering, search functionality, and a dark mode toggle for reading posts. These features required some JavaScript, but I tried to keep everything lightweight and simple.
One thing I learned while building the site is that organizing files early saves a lot of time later. Keeping components, pages, and content separated made the project easier to maintain as it grew.
Challenges
The biggest challenge was not writing the code itself but deciding how everything should be structured.
As more sections were added, I had to make sure the website stayed organized and easy to navigate. I also spent time testing layouts on different screen sizes to make sure the site worked well on both desktop and mobile devices.
What I Learned
Building this website helped me learn more about Astro, content management with Markdown, and organizing a larger frontend project.
It also showed me the importance of planning a project structure early. A good structure makes it much easier to add new features and content later.
What Comes Next
The next step is to keep adding content.
I plan to publish more cybersecurity lab writeups, book reviews, and project updates while continuing to improve the website over time.