This Website

This website is built as a modern, fast, and easy-to-maintain personal site using a framework called Astro.

What the website is made of

The site is built with several pieces working together:

• Astro: a static site builder that turns text and templates into a fast website.
• Markdown content: the pages and blog posts are written in simple text files under src/content/.
• Tailwind CSS: a styling system that makes the site look good and responsive on different devices.
• Pagefind: a search tool that lets visitors search the site without needing a separate search server.
• Satori and Sharp: tools used to create social preview images automatically for blog posts.

How the content is organized

Most of the text content lives in the src/content/ folder.

• src/content/pages/ contains pages like the About and Experience sections.
• src/content/posts/ contains the blog posts.

Because the content is written in Markdown, it is easy to update without editing complicated code. The site reads these files and turns them into web pages when it is built.

The main configuration files

There are two important configuration files in this project:

• astro.config.ts: tells Astro how to build the site, what plugins to use, and how to process Markdown.
• astro-paper.config.ts: contains the site settings like the site title, description, author name, language, and some feature switches.

These files help keep the website behavior separate from the content.

How the site is built

The project uses pnpm, a fast package manager. The main commands are:

• pnpm dev: start a local development site on your computer.
• pnpm build: create the final, ready-to-publish website.
• pnpm preview: preview the built site locally.

During the build step, Astro checks the code, converts Markdown files into HTML pages, and creates a static version of the site that can be served by a web host.

How the site looks and behaves

The site uses Tailwind CSS for styling, built on top of the AstroPaper theme architecture. That means it is designed to be:

• clean and readable,
• responsive on mobile and desktop,
• accessible to keyboard users and screen readers,
• easy to customize.

It also supports light and dark mode and includes a local search experience through Pagefind.

How search and images work

Search is handled by Pagefind, which creates a small search index during the build. This means search works instantly in the browser without a separate search server.

For social sharing, the site can create dynamic Open Graph images using code in src/pages/og.png.ts and src/pages/posts/[...slug]/index.png.ts. These images are generated automatically for blog posts when needed.

Deployment and hosting

The site configuration and public URL confirm the official deployment workflow and hosting infrastructure. There is no ambiguity: the platform is hosted on Azure Static Web Apps and is fully integrated with GitHub for continuous deployment.

Infrastructure Details

• Hosting Provider: Azure Static Web Apps
• Deployment Automation: GitHub Actions (CI/CD)
• Production Environment URL: tabacaru.lu

Deployment Workflow

The application employs a Git-based workflow with automated deployments:

1. Code Repository: Hosted on GitHub.
2. CI/CD Pipeline: Powered by GitHub Actions workflows (typically located in .github/workflows/azure-static-web-apps-*.yml).
3. Trigger: Every push or merged pull request to the primary deployment branch (such as main or master) automatically initiates the build and deployment process.
4. Live Update: Once the GitHub Actions run completes successfully, the latest changes are instantly live at the production URL.

Why this approach is useful

This project is built to be easy to update and maintain:

• content and posts are stored in text files,
• styling and layout are handled by reusable components,
• the build system creates a fast static website,
• search is local and private,
• images can be generated automatically for social sharing.

If you want to update the website, the most common changes are:

• edit Markdown files in src/content/,
• update site settings in astro-paper.config.ts,
• change styles or layout in src/components/ or src/styles/.

Credits & Base Template

This website is not built entirely from scratch. Its core layout, styling framework, and excellent typography are built upon the open-source AstroPaper public template created by Sat Naing.

Huge thanks to the original creator and the open-source community for providing such a well-structured, accessible, and high-performance foundation.