Extra Documentação Técnica com Markdown • Trilha Progressiva em 4 Níveis


🎯 Nível 1: Fundamentos

Problema 12.1 — Construção de Frontmatter Canônico para Post Técnico

Contexto: Criar o cabeçalho YAML obrigatório para um artigo técnico com layout post, título, data no padrão ISO 8601 e lista de tags.

Requisitos de Execução:

  1. Iniciar na linha 1 com ---.
  2. Incluir campos: layout, title, date, tags (mínimo de 2 tags).
  3. Fechar o bloco com ---.

Resultado Esperado

---
layout: post
title: "Introdução a Contêineres com Podman"
date: 2026-09-01
tags: [devops, linux, containers]
---

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_12_1_SeuNome.md
  2. Envie na tarefa: Atividade Cap 12 - Frontmatter YAML
🔑 Gabarito de Código & Solução Comentada
---
layout: post
title: "Introdução a Contêineres com Podman"
date: 2026-09-01
tags: [devops, linux, containers]
---

Comentário: O delimitador --- deve ser a primeiríssima linha do arquivo (sem linhas vazias ou espaços antes).


🎯 Nível 2: Prática

Problema 12.2 — Metadados Open Graph e SEO para Compartilhamento em Redes

Construa um frontmatter contendo atributos específicos para Open Graph e Twitter Cards (description, image, author_twitter, canonical_url).

🔑 Gabarito de Código & Solução Comentada
---
layout: default
title: "Guia Avançado de Otimização SQL"
description: "Aprenda a analisar planos de execução EXPLAIN ANALYZE e criar índices parciais no PostgreSQL."
image: "/assets/banners/otimizacao_sql.png"
canonical_url: "https://meusite.dev/artigos/otimizacao-sql"
twitter:
  card: "summary_large_image"
  creator: "@engenharia_dev"
---

🎯 Nível 3: Integração

Problema 12.3 — Variáveis Customizadas Consumidas por Templates Liquid

Escreva um frontmatter com parâmetros customizados de controle de página (sidebar: true, toc: true, math: true, comments: false) e um trecho Liquid demonstrando como renderizar condicionalmente a barra lateral.

🔑 Gabarito de Código & Solução Comentada
---
layout: default
title: "Análise Numérica com Python"
toc: true
sidebar: true
math: true
---

<!-- No template do layout (default.html): -->
{% if page.sidebar %}
  <aside class="sidebar-lateral">
    {% include sumario.html %}
  </aside>
{% endif %}

🎯 Nível 4: Desafio

Problema 12.4 — Parser de Frontmatter em Python Puro com Extração de Markdown

Implemente uma função em Python que receba o conteúdo de um arquivo .md, separe o cabeçalho YAML do corpo do texto e retorne uma tupla (dicionario_metadados, texto_markdown) utilizando a biblioteca yaml.

🔑 Gabarito de Código & Solução Comentada
# frontmatter_parser.py
import yaml
import re

def extrair_frontmatter_e_corpo(conteudo_arquivo):
    padrao = r"^---\s*\n(.*?)\n---\s*\n(.*)$"
    match = re.match(padrao, conteudo_arquivo, re.DOTALL)
    if not match:
        return {}, conteudo_arquivo
    
    yaml_raw = match.group(1)
    corpo_md = match.group(2)
    
    metadados = yaml.safe_load(yaml_raw) or {}
    return metadados, corpo_md

if __name__ == "__main__":
    doc = """---
title: Teste de Frontmatter
layout: slide
tags: [python, yaml]
---
# Conteúdo do Slide
Corpo do arquivo markdown."""
    meta, corpo = extrair_frontmatter_e_corpo(doc)
    print("Metadados YAML Extraídos:", meta)
    print("Corpo Markdown:", corpo.strip())