Building a Professional Portfolio with Quarto and GitHub Pages

This presentation explores how to create a professional portfolio using Quarto and GitHub Pages. A portfolio showcases your work, boosts visibility, and builds your personal brand. Key sections include projects, blogs, and talks, tailored to highlight your expertise in data science, academia, or industry. With dynamic content and regular updates, your portfolio becomes a powerful tool for networking and career growth.

Author

Brian Cervantes Alvarez

Published

January 8, 2025

Modified

April 8, 2025

I built a professional portfolio using Quarto and GitHub Pages to effectively showcase my data science and analytics projects, enhance professional branding, and increase visibility through interactive online presentations. I established a structured workflow, implemented best practices for version control using Git, and created an engaging, customizable website featuring clear sections for projects, blogs, and talks. This approach not only improved immediate visibility and recruiter engagement but also provided long-term career advantages through demonstrated expertise in HTML, CSS, JavaScript, and modern web development frameworks.

---
title: "Building a Professional Portfolio with Quarto and GitHub Pages"
author: "Brian Cervantes Alvarez"
date: '01-08-2025'
date-modified: today
image: /assets/images/portfolio.png
description: "This presentation explores how to create a professional portfolio using Quarto and GitHub Pages. A portfolio showcases your work, boosts visibility, and builds your personal brand. Key sections include projects, blogs, and talks, tailored to highlight your expertise in data science, academia, or industry. With dynamic content and regular updates, your portfolio becomes a powerful tool for networking and career growth."
format:
  html:
    code-tools: true
    html-math-method: katex
    page-layout: full
execute: 
  warning: false
  message: false
ai-summary:
  banner-title: "Yapper Labs | AI Summary"
  model-title: "Model: ChatGPT 4.5"
  model-img: "/assets/images/OpenAI-white-monoblossom.svg"
  summary: "I built a professional portfolio using Quarto and GitHub Pages to effectively showcase my data science and analytics projects, enhance professional branding, and increase visibility through interactive online presentations. I established a structured workflow, implemented best practices for version control using Git, and created an engaging, customizable website featuring clear sections for projects, blogs, and talks. This approach not only improved immediate visibility and recruiter engagement but also provided long-term career advantages through demonstrated expertise in HTML, CSS, JavaScript, and modern web development frameworks."
---


:::{.column-page}

```{=html}
<div style="
  position: relative;
  width: 100%;
  height: 70vh;        /* 70% of the viewport height */
  min-height: 10vh;   /* fallback on very short screens */
  overflow: hidden;
  border-radius: 15px;
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px,
              rgba(0, 0, 0, 0.3) 0px 7px 13px -3px,
              rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
  margin: 1rem 0;
">
  <iframe 
    src="https://bcervantesalvarez.github.io/Presentations/BuildAQuartoPortfolio/"
    title="Build a Quarto Portfolio"
    style="
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: none;
    ">
  </iframe>
</div>
```
:::