Post de Teste: Demonstração e Componentes

· 2 min de leitura

DemonstraçãoTestePixel ArtComponentes

Introdução

Este é um post de demonstração para testar todos os elementos visuais, blocos de código, tabelas, imagens e alertas disponíveis na renderização do blog.

Header cotoo.dev

Alertas do GitHub (Callouts)

Abaixo estão os cinco tipos de alertas disponíveis, estilizados com ícones em pixel art:

Blocos de Código e Copiar Comandos

Cada bloco de código exibe a linguagem no cabeçalho e possui um botão retrô para copiar comandos:

bash 
# Atualizar repositórios e instalar dependências
sudo apt update && sudo apt upgrade -y
curl -fsSL https://get.docker.com | sh   # Script oficial de instalação
sudo usermod -aG docker $USER            # Permissão sem sudo

Outro exemplo em JavaScript:

javascript 
// Exemplo de debounce em JavaScript vanilla
function debounce(fn, delay = 200) {
  let timer;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}

E um arquivo de configuração Docker Compose:

yaml 
version: "3.8"
services:
  web:
    image: nginx:alpine
    ports:
      - "8080:80"
    restart: always

Imagens e Mídia

As imagens são responsivas e adaptadas ao layout centralizado:

Ícone do Projeto

Tabelas Comparativas

As tabelas contam com barra de rolagem horizontal responsiva quando necessário:

Comando Descrição Escopo
docker run Cria e inicia um novo container Instância
docker ps -a Lista todos os containers locais Sistema
docker compose up Sobe múltiplos serviços coordenados Orquestração
docker system prune Remove recursos órfãos e limpa disco Manutenção

Listas e Formatações

  • Item de lista com texto em negrito e itálico.
  • Suporte a comandos inline como docker ps e links externos como Docker Docs.
  • Subitens aninhados:
    • Nível 2 com informação detalhada.
    • Outro detalhe com código npm run build.
  1. Primeiro passo da execução.
  2. Segundo passo com validação de saída.
  3. Terceiro passo com conclusão bem-sucedida.