Project Setup

Date: 06 June 2025

This document explains how this portfolio website was created.

1. Starting with MkDocs and uv

The project was set up using uv, a fast Python package installer and resolver. Here are the initial steps:

• Initialize uv: The project was initialized with uv init.
• Create a virtual environment: A virtual environment was created to manage project dependencies.
• Install mkdocs: The mkdocs package was added to the environment using uv add mkdocs.
• Create the project: A new mkdocs project was created with uv run mkdocs new ..

This gave us a simple starting point with a few files:

• mkdocs.yml: The main configuration file for the website.
• docs/index.md: The main page of the website.

2. Using the Custom Theme

To make the website look better, we used Tailwind CSS. Instead of writing a lot of custom CSS, we used Tailwind's utility classes directly in our HTML files. We included Tailwind CSS using a CDN, which is a simple way to add it to a website without needing to install it locally.

3. Adding Content and Features

With the theme in place, we added the content for the portfolio, including:

• About Me: A section for a personal introduction.
• Projects: A page to showcase work, with placeholder images for each project.
• Skills: A section to list technical and soft skills.
• Contact Information: Email and social media links.

We also added some cool features like:

• Mermaid Diagrams: To create diagrams like mind maps and flowcharts from text.
• Font Awesome Icons: For the social media links.
• Google Fonts: To use a modern font called "Inter".

This process allowed us to create a unique and personal portfolio website that can be easily updated by editing the Markdown files.

4. Build and Publish

To build the website, we can use the following command:

uv run mkdocs build

This will create a site directory with all the static files for the website.

To publish the website, we can use a service like GitHub Pages. The mkdocs tool has a built-in command to deploy the site to GitHub Pages:

uv run mkdocs gh-deploy

This command will build the site and push it to the gh-pages branch of the GitHub repository.