lucasrguerra/ESPDocs
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 11 Wiki Activity
Files
f9b64b3354784a126c842fa53f999cb23c138c25
ESPDocs/public/formacoes/1/index.html
T
Lucas RayanandClaude Opus 5.5 1860e34cbb
Release / Plano (reaproveitar a imagem?) (push) Successful in 7s
Details
CI / Lint e auditorias (push) Successful in 1m48s
Details
CI / Trivy (dependências e segredos) (push) Successful in 12s
Details
CI / Imagem Docker (linux/arm64) (push) Failing after 2m27s
Details
Release / ci (push) Failing after 4m31s
Details
Release / Publica a imagem (linux/arm64) (push) Skipped
Details
Release / Cria a release no Gitea (push) Skipped
Details
feat(formacoes): módulo 2 (DHT22 + LCD 16x2 no Wokwi), PDFs e página de entrada 
- Formação 2 da LASER: slides visuais, apostila, projeto do Wokwi e scanner
  I2C, validados no simulador (leitura normal, temperatura negativa e sensor
  desconectado). Circuito com pull-ups de 10 kΩ e 4,7 kΩ para 3V3 e aviso
  sobre os pull-ups de 5 V da plaquinha PCF8574.
- PDFs prontos dos slides e das apostilas dos módulos 1 e 2;
  slides-pdf agora também exporta a apostila.
- Página de entrada em /formacoes e /formacoes/N, gerada por
  scripts/formacoes-viewer.mjs a partir do formacao.json de cada pasta.
- A apostila passou de index.html para apostila.html.
- Corrige o link do Fritzing da apostila 1 (/apostilas/1 não existe).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-11-02 13:11:28 -03:00

253 lines
15 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>LASER · Formação em ESP32 · Módulo 1: Conhecendo a família ESP32</title>
<meta name="description" content="Slides, apostila e arquivos do módulo 1 da formação em ESP32 da LASER: arquitetura, as doze séries da família e uma prática com DHT11 e ESP32-S3.">
<meta name="author" content="Lucas Rayan Guerra">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="/marca/espdocs-marca.svg">
<link rel="stylesheet" href="/formacoes/assets/viewer.css">
</head>
<body>
<!-- Gerado por scripts/formacoes-viewer.mjs a partir do formacao.json. Não edite à mão. -->
<header class="topo">
<div class="envoltorio">
<a href="/formacoes"><img src="/formacoes/assets/laser.svg" alt="LASER"></a>
<span class="topo-liga">Liga Acadêmica de Sistemas Embarcados<br>Centro de Informática · UFPE</span>
<nav><a href="#arquivos">Arquivos</a><a href="#como-usar">Como usar</a><a href="/formacoes">Formações</a></nav>
</div>
</header>
<main>
<section class="abertura">
<div class="envoltorio">
<div>
<div class="selo">Formação em ESP32 · Módulo 1</div>
<h1>Conhecendo a<strong>família ESP32</strong></h1>
<p class="abertura-sub">Do silício à bancada: como esses microcontroladores funcionam por dentro, o que cada uma das doze séries faz e não faz, e como escolher o chip certo. Termina com um DHT11 lendo temperatura e umidade num ESP32-S3.</p>
<ul class="fichas"><li>Duração: <b>3 horas</b></li><li>Formato: <b>presencial</b></li><li>Placa: <b>ESP32-S3-DevKitC-1</b></li><li>Prática: <b>DHT11 + monitor serial</b></li></ul>
<div class="acoes">
<a class="botao primario" href="/formacoes/1/slide.html"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 5v14l11-7z"/></svg>Apresentar os slides</a>
<a class="botao" href="/formacoes/1/apostila.html"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 6c-2-1.5-5-2-8-1.5v14c3-.5 6 0 8 1.5 2-1.5 5-2 8-1.5v-14c-3-.5-6 0-8 1.5zM12 6v14"/></svg>Ler a apostila</a>
<a class="botao" href="#baixar"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v12M6 10l6 6 6-6M5 20h14"/></svg>Baixar em PDF</a>
</div>
</div>
<div class="previas">
<a class="p-apostila" href="/formacoes/1/apostila.html" aria-label="Abrir a apostila"><img src="/formacoes/1/previa-apostila.jpg" alt="Capa da apostila do módulo 1" width="640" height="905"></a>
<a class="p-slides" href="/formacoes/1/slide.html" aria-label="Abrir os slides"><img src="/formacoes/1/previa-slides.jpg" alt="Capa dos slides do módulo 1" width="960" height="540"></a>
</div>
</div>
</section>
<hr class="feixe">
<section class="bloco" id="baixar">
<div class="envoltorio">
<p class="rotulo">Comece por aqui</p>
<h2>Três formas de usar este material</h2>
<p class="bloco-sub">Para apresentar, para estudar e para pôr a mão no circuito. Os PDFs são a versão final, para quem só quer o material pronto.</p>
<div class="portas">
<article class="porta">
<a class="porta-imagem" href="/formacoes/1/slide.html"><img src="/formacoes/1/previa-slides.jpg" alt="" loading="lazy"></a>
<div class="porta-corpo">
<h3>Slides</h3>
<p>60 slides para projetar direto do navegador, com navegação por teclado e panorama.</p>
<div class="porta-meta">PDF · 60 págs · 4,6 MB</div>
<div class="acoes">
<a class="botao pequeno primario" href="/formacoes/1/slide.html"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 5v14l11-7z"/></svg>Apresentar</a>
<a class="botao pequeno" href="/formacoes/1/LASER-ESP32-Modulo-1-Slides.pdf" download><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v12M6 10l6 6 6-6M5 20h14"/></svg>PDF</a>
</div>
</div>
</article>
<article class="porta">
<a class="porta-imagem" href="/formacoes/1/apostila.html"><img src="/formacoes/1/previa-apostila.jpg" alt="" loading="lazy"></a>
<div class="porta-corpo">
<h3>Apostila</h3>
<p>O conteúdo completo, com explicações, tabelas e o código comentado, paginado em A4.</p>
<div class="porta-meta">PDF · 39 págs · 3,2 MB</div>
<div class="acoes">
<a class="botao pequeno primario" href="/formacoes/1/apostila.html"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 6c-2-1.5-5-2-8-1.5v14c3-.5 6 0 8 1.5 2-1.5 5-2 8-1.5v-14c-3-.5-6 0-8 1.5zM12 6v14"/></svg>Ler</a>
<a class="botao pequeno" href="/formacoes/1/LASER-ESP32-Modulo-1-Apostila.pdf" download><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v12M6 10l6 6 6-6M5 20h14"/></svg>PDF</a>
</div>
</div>
</article>
<article class="porta">
<a class="porta-imagem clara" href="/formacoes/1/pratica.png" target="_blank" rel="noopener"><img src="/formacoes/1/pratica.png" alt="" loading="lazy"></a>
<div class="porta-corpo">
<h3>Prática na bancada</h3>
<p>Esquema de ligação do DHT11 ao ESP32-S3, com o arquivo editável do Fritzing para montar ou adaptar.</p>
<div class="porta-meta">Fritzing · capítulo 9 da apostila</div>
<div class="acoes"><a class="botao pequeno primario" href="/formacoes/1/pratica.png"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg>Ver esquema</a><a class="botao pequeno" href="/formacoes/1/pratica.fzz" download><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v12M6 10l6 6 6-6M5 20h14"/></svg>Baixar .fzz</a></div>
</div>
</article>
</div>
</div>
</section>
<section class="bloco" id="roteiro">
<div class="envoltorio">
<p class="rotulo">Roteiro da aula</p>
<h2>10 partes, 60 slides</h2>
<p class="bloco-sub">Cada parte abre os slides direto no ponto em que ela começa.</p>
<ol class="roteiro">
<li><a href="/formacoes/1/slide.html#4"><b>1</b><span>O que é o ESP32<small>slide 4 · 5 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#9"><b>2</b><span>Anatomia do chip<small>slide 9 · 9 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#18"><b>3</b><span>Boot e execução<small>slide 18 · 5 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#23"><b>4</b><span>As 12 séries<small>slide 23 · 5 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#28"><b>5</b><span>Segurança em hardware<small>slide 28 · 5 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#33"><b>6</b><span>Comparando plataformas<small>slide 33 · 4 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#37"><b>7</b><span>Fortes e limitações<small>slide 37 · 4 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#41"><b>8</b><span>Escolhendo a série<small>slide 41 · 5 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#46"><b>9</b><span>Prática: DHT11<small>slide 46 · 11 slides</small></span></a></li>
<li><a href="/formacoes/1/slide.html#57"><b>10</b><span>Próximos passos<small>slide 57 · 4 slides</small></span></a></li>
</ol>
</div>
</section>
<section class="bloco" id="arquivos">
<div class="envoltorio">
<p class="rotulo">Todos os arquivos</p>
<h2>O que tem nesta formação</h2>
<p class="bloco-sub">Tudo o que foi usado na aula, com o que é cada arquivo e para que serve.</p>
<div class="grupo-arquivos">
<h3>Material de aula</h3>
<ul class="arquivos">
<li class="arquivo">
<div class="icone "><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M3 5h18v12H3z"/><path d="M8 21h8M12 17v4"/></svg></div>
<div>
<div class="arquivo-nome">slide.html</div>
<div class="arquivo-desc">Os slides da formação. Abrem no navegador, em tela cheia, prontos para projetar.</div>
</div>
<div class="arquivo-tam">107 KB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/slide.html">Abrir</a></div>
</li>
<li class="arquivo">
<div class="icone "><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 4.5A1.5 1.5 0 0 1 5.5 3H20v16H5.5A1.5 1.5 0 0 0 4 20.5z"/><path d="M4 20.5A1.5 1.5 0 0 0 5.5 22H20"/></svg></div>
<div>
<div class="arquivo-nome">apostila.html</div>
<div class="arquivo-desc">A apostila completa, paginada em A4 no próprio navegador, com glossário e capítulos extras.</div>
</div>
<div class="arquivo-tam">96 KB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/apostila.html">Abrir</a></div>
</li>
</ul>
</div>
<div class="grupo-arquivos">
<h3>Para baixar e imprimir</h3>
<ul class="arquivos">
<li class="arquivo">
<div class="icone pdf"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M14 3H6v18h12V7z"/><path d="M14 3v4h4"/><path d="M9 13h6M9 17h4"/></svg></div>
<div>
<div class="arquivo-nome">LASER-ESP32-Modulo-1-Slides.pdf</div>
<div class="arquivo-desc">Os slides em PDF 16:9, um slide por página.</div>
</div>
<div class="arquivo-tam">60 págs · 4,6 MB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/LASER-ESP32-Modulo-1-Slides.pdf" target="_blank" rel="noopener">Abrir</a><a href="/formacoes/1/LASER-ESP32-Modulo-1-Slides.pdf" download>Baixar</a></div>
</li>
<li class="arquivo">
<div class="icone pdf"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M14 3H6v18h12V7z"/><path d="M14 3v4h4"/><path d="M9 13h6M9 17h4"/></svg></div>
<div>
<div class="arquivo-nome">LASER-ESP32-Modulo-1-Apostila.pdf</div>
<div class="arquivo-desc">A apostila em PDF A4, pronta para imprimir.</div>
</div>
<div class="arquivo-tam">39 págs · 3,2 MB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/LASER-ESP32-Modulo-1-Apostila.pdf" target="_blank" rel="noopener">Abrir</a><a href="/formacoes/1/LASER-ESP32-Modulo-1-Apostila.pdf" download>Baixar</a></div>
</li>
</ul>
</div>
<div class="grupo-arquivos">
<h3>Prática</h3>
<ul class="arquivos">
<li class="arquivo">
<div class="icone "><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="4" y="4" width="16" height="16" rx="2"/><path d="M8 8h3v3H8zM13 13h3v3h-3zM11 9.5h3.5V13"/></svg></div>
<div>
<div class="arquivo-nome">pratica.fzz</div>
<div class="arquivo-desc">Montagem do DHT11 com o ESP32-S3, editável no Fritzing.</div>
</div>
<div class="arquivo-tam">41 KB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/pratica.fzz" download>Baixar</a></div>
</li>
<li class="arquivo">
<div class="icone imagem"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="2"/><circle cx="9" cy="10" r="2"/><path d="m21 17-5-5-9 8"/></svg></div>
<div>
<div class="arquivo-nome">pratica.png</div>
<div class="arquivo-desc">O mesmo esquema em imagem, para consultar sem instalar nada.</div>
</div>
<div class="arquivo-tam">76 KB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/pratica.png" target="_blank" rel="noopener">Abrir</a></div>
</li>
</ul>
</div>
<div class="grupo-arquivos">
<h3>Imagens</h3>
<ul class="arquivos">
<li class="arquivo">
<div class="icone imagem"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="2"/><circle cx="9" cy="10" r="2"/><path d="m21 17-5-5-9 8"/></svg></div>
<div>
<div class="arquivo-nome">esp32-s3-blocos.png</div>
<div class="arquivo-desc">Diagrama de blocos do ESP32-S3, usado no capítulo 2.</div>
</div>
<div class="arquivo-tam">274 KB</div>
<div class="arquivo-acoes"><a href="/formacoes/1/esp32-s3-blocos.png" target="_blank" rel="noopener">Abrir</a></div>
</li>
</ul>
</div>
</div>
</section>
<section class="bloco" id="como-usar">
<div class="envoltorio">
<p class="rotulo">Como usar</p>
<h2>Passo a passo</h2>
<div class="guias">
<div class="guia">
<h3>Apresentando os slides</h3>
<p>Abra <a href="/formacoes/1/slide.html">slide.html</a> no navegador. O palco é 16:9 e se ajusta a qualquer tela ou projetor.</p>
<dl class="atalhos">
<dt><kbd>→</kbd><kbd>←</kbd></dt><dd>avançar e voltar (ou clique nas metades da tela)</dd>
<dt><kbd>F</kbd></dt><dd>tela cheia</dd>
<dt><kbd>O</kbd></dt><dd>panorama com todos os slides</dd>
<dt><kbd>B</kbd></dt><dd>tela preta, para pausar a projeção</dd>
</dl>
</div>
<div class="guia">
<h3>Lendo e imprimindo a apostila</h3>
<p>A <a href="/formacoes/1/apostila.html">versão online</a> se pagina em A4 sozinha ao abrir, o que leva alguns segundos.</p>
<p>Para papel, prefira o <a href="/formacoes/1/LASER-ESP32-Modulo-1-Apostila.pdf" download>PDF pronto</a>: ele já sai com margens, cores e quebras de página certas, sem configurar a impressora.</p>
</div>
<div class="guia">
<h3>Montando a prática</h3>
<ol><li>Ligue o <b>VCC</b> do DHT11 ao <b>3V3</b>, o <b>DATA</b> ao <b>GPIO12</b> e o <b>GND</b> ao <b>GND</b>.</li><li>Coloque o resistor de <b>10 kΩ</b> entre DATA e 3V3: é o pull-up da linha de dados.</li><li>Instale a <b>DHT sensor library</b>, da Adafruit, na IDE do Arduino.</li><li>Na porta <b>USB</b> da placa, ative <i>USB CDC On Boot</i>; na porta <b>UART</b>, desative.</li></ol>
</div>
<div class="guia">
<h3>Abrindo o arquivo do Fritzing</h3>
<p>O <code>pratica.fzz</code> abre no <a href="https://fritzing.org">Fritzing</a>, onde dá para trocar o pino, mover os fios e exportar o esquema em imagem ou PDF.</p>
</div>
</div>
</div>
</section>
</main>
<footer class="rodape">
<div class="envoltorio">
<span><strong>LASER</strong> · Liga Acadêmica de Sistemas Embarcados · CIn · UFPE</span>
<span>Material de <strong>Lucas Rayan Guerra</strong> · uso livre para fins educacionais · <a href="mailto:contato@lucasrguerra.dev.br">contato@lucasrguerra.dev.br</a></span>
</div>
</footer>
</body>
</html>
Reference in new issue View Git Blame Copy Permalink