featadiciona arquivo de publicações e trajetória digital
src/app/page.module.cssmodificado
@@ -44,12 +44,49 @@
color: var(--text-color);
}
-.subtitle {
+.title span {
+ display: block;
+}
+
+.role {
+ margin-top: 0.35rem;
+ color: var(--text-color-secondary);
font-size: var(--font-size-lg);
+ font-weight: 400;
+}
+
+.subtitle {
+ font-family: Consolas, "SF Mono", Menlo, "Courier New", monospace;
+ font-size: var(--font-size-sm);
color: var(--text-color-secondary);
margin: 0.5rem 0 0;
}
+.intro {
+ max-width: 40rem;
+ margin-top: 2rem;
+}
+
+.intro p {
+ color: var(--text-color-prose);
+ line-height: 1.7;
+ margin: 0;
+}
+
+.intro p + p {
+ margin-top: 0.75rem;
+}
+
+.intro a {
+ color: var(--primary-color);
+ font-weight: 500;
+ text-decoration: none;
+}
+
+.intro a:hover {
+ text-decoration: underline;
+}
+
.highlight {
margin: 2.5rem 0;
padding: 1.5rem;
@@ -154,4 +191,8 @@
.title {
font-size: 2rem;
}
+
+ .role {
+ font-size: var(--font-size-md);
+ }
}src/app/page.tsxmodificado
@@ -26,6 +26,7 @@ const START_LINKS = [
{ href: "/experiencias", file: "experiências.tsx", hint: "Onde trabalhei" },
{ href: "/competencias", file: "competências.css", hint: "O que eu uso" },
{ href: "/formacao", file: "formação.ts", hint: "Onde estudei" },
+ { href: "/publicacoes", file: "publicações/", hint: "O que documentei" },
];
const PROJECTS = [
@@ -56,9 +57,14 @@ const Home = () => {
priority
/>
<div>
- <h1 className={styles.title}>Paulo Matos</h1>
+ <h1 className={styles.title}>
+ <span>Paulo Matos</span>
+ <span className={styles.role}>
+ Desenvolvedor Full-Stack & Líder Técnico
+ </span>
+ </h1>
<p className={styles.subtitle}>
- Desenvolvedor Full-Stack & Líder Técnico
+ C#, ASP.NET Core, React, TypeScript e Rust
</p>
<div className={styles.social}>
{SOCIAL.map(({ href, label, Icon }) => (
@@ -77,6 +83,22 @@ const Home = () => {
</div>
</header>
+ <section className={styles.intro} aria-label="Apresentação">
+ <p>
+ Desenvolvo aplicações e soluções de software há mais de cinco anos,
+ com experiência em arquitetura de sistemas, desenvolvimento full-stack
+ e liderança técnica. Sou formado em Engenharia de Sistemas pela UFMG e
+ gosto de transformar problemas complexos em produtos simples,
+ confiáveis e fáceis de manter.
+ </p>
+ <p>
+ Conheça minha <Link href="/sobre-mim">trajetória</Link>, veja minhas{" "}
+ <Link href="/experiencias">experiências profissionais</Link>, explore
+ os <Link href="/projetos">projetos que desenvolvi</Link> ou leia meus{" "}
+ <Link href="/blog">artigos técnicos</Link>.
+ </p>
+ </section>
+
<div className={styles.columns}>
<section>
<h2 className={styles.columnTitle}>Começar</h2>
@@ -112,16 +134,11 @@ const Home = () => {
<Link href="/projetos/leaf">Leaf</Link>
</h2>
<p>
- Criar um componente novo no{" "}
- <Link href="/projetos/rustle">Rustle</Link> — a engine de jogos 2D que
- estou escrevendo em Rust — hoje exige recompilar o projeto inteiro.
- Leaf é a linguagem de script que elimina esse ciclo.
- </p>
- <p>
- Tipagem estática, compilada para uma VM de registradores, integração
- nativa com Rust, sem coletor de lixo e sem panic. Construí a camada de
- script da prova de conceito em Rune antes de decidir escrever a minha
- — foi usando que os limites apareceram.
+ O <Link href="/projetos/leaf">Leaf</Link> é uma linguagem de script
+ com tipagem estática que estou desenvolvendo em Rust. O projeto nasceu
+ para acelerar o desenvolvimento do{" "}
+ <Link href="/projetos/rustle">Rustle</Link>, minha engine de jogos 2D,
+ evitando a recompilação completa a cada alteração de comportamento.
</p>
<h3 className={styles.highlightSub}>Escrevendo sobre isso</h3>
<PostLinks tag="leaf" limit={3} />src/app/publicacoes/artigos/page.tsxadicionado
@@ -0,0 +1,201 @@
+import Link from "next/link";
+import { pageMetadata } from "@/data/site";
+import styles from "../publicacoes.module.css";
+
+export const metadata = pageMetadata({
+ title: "Artigos e publicações",
+ description:
+ "Artigos e trabalhos de Paulo Matos publicados no pmatos.dev, Medium, GIMP Brasil, Blogger e Google Drive.",
+ path: "/publicacoes/artigos",
+});
+
+type ExternalItemProps = {
+ title: string;
+ href: string;
+ detail: string;
+ description: string;
+};
+
+const ExternalItem = ({
+ title,
+ href,
+ detail,
+ description,
+}: ExternalItemProps) => (
+ <li className={styles.item}>
+ <a href={href} target="_blank" rel="noopener noreferrer">
+ <span className={styles.itemTitle}>{title}</span>
+ </a>
+ <span className={styles.detail}>{detail}</span>
+ <p className={styles.description}>{description}</p>
+ </li>
+);
+
+const ArtigosPage = () => {
+ return (
+ <div className={`contentPage ${styles.page}`}>
+ <h1>Artigos e publicações</h1>
+ <p>
+ Meus textos estão distribuídos entre este site e plataformas que usei
+ antes dele. A lista abaixo preserva os originais e deixa claro o
+ contexto em que cada grupo foi publicado.
+ </p>
+
+ <section id="neste-site">
+ <h2>Neste site</h2>
+ <p>
+ O <Link href="/blog">blog do pmatos.dev</Link> é onde publico
+ atualmente. Os textos partem de problemas que encontrei em projetos:
+ decisões de arquitetura, detalhes de implementação e o que só ficou
+ evidente depois de testar uma ideia.
+ </p>
+ </section>
+
+ <section id="trabalho-academico">
+ <h2>Trabalho acadêmico</h2>
+ <p>
+ Em 2015, escrevi com João Pedro Samarino um relatório computacional
+ sobre transformadores e máquinas elétricas. O trabalho combinou a
+ análise dos modelos com automação no FEMM: os scripts em Lua variavam
+ parâmetros, executavam as simulações, coletavam resultados e salvavam
+ os quadros usados nos vídeos.
+ </p>
+ <ul className={styles.list}>
+ <ExternalItem
+ title="Relatório do Trabalho Computacional III"
+ href="https://drive.google.com/file/d/178RvbjryDmwrpx21ogSsdBtnNdguw5Ew/view"
+ detail="Máquinas elétricas · FEMM · Lua · 2015"
+ description="Relatório de 51 páginas, escrito com João Pedro Samarino, com as análises e os scripts usados para automatizar as simulações."
+ />
+ </ul>
+ </section>
+
+ <section id="medium">
+ <h2>Medium</h2>
+ <p>
+ Publiquei três artigos sobre C# no Medium. Dois formam uma introdução
+ a testes unitários; o terceiro discute o uso de{" "}
+ <code>IEnumerable</code>.
+ </p>
+ <ul className={styles.list}>
+ <ExternalItem
+ title="Você realmente sabe usar o IEnumerable do C#?"
+ href="https://medium.com/@pmatos2000/voc%C3%AA-realmente-sabe-usar-o-ienumerable-do-c-135c162cc40f"
+ detail="C# · IEnumerable"
+ description="O que a interface representa, como a execução adiada afeta o código e quando materializar uma sequência."
+ />
+ <ExternalItem
+ title="Quase tudo sobre testes unitários em C# — parte 1"
+ href="https://medium.com/@pmatos2000/quase-tudo-que-voc%C3%AA-precisa-saber-sobre-testes-unit%C3%A1rios-em-c-parte-1-44254fec4788"
+ detail="C# · Testes unitários"
+ description="Os conceitos básicos, a estrutura de um teste e o papel dos testes automatizados."
+ />
+ <ExternalItem
+ title="Quase tudo sobre testes unitários em C# — parte 2"
+ href="https://medium.com/@pmatos2000/quase-tudo-que-voc%C3%AA-precisa-saber-sobre-testes-unit%C3%A1rios-em-c-parte-2-2277c3f42db4"
+ detail="C# · Testes unitários"
+ description="A continuação da série, com a aplicação dos conceitos em exemplos de código."
+ />
+ </ul>
+ <p className={styles.platformLink}>
+ <a
+ href="https://medium.com/@pmatos2000"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ Ver o perfil no Medium
+ </a>
+ </p>
+ </section>
+
+ <section id="gimp-brasil">
+ <h2>GIMP Brasil</h2>
+ <p>
+ Entre 2011 e 2012, o GIMP Brasil publicou seis tutoriais que escrevi
+ sobre edição de imagens. Eles pertencem a uma fase anterior à minha
+ atuação profissional em software, mas já mostram a prática de
+ transformar uma experiência em instruções reproduzíveis.
+ </p>
+ <ul className={styles.list}>
+ <ExternalItem
+ title="Wallpaper com faixa de cores e brilho"
+ href="https://www.gimpbrasil.org/2012/06/wallpaper-faixa-de-cores-e-brilho.html"
+ detail="GIMP Brasil · 2012"
+ description="Composição de um papel de parede, documentada desde a criação do fundo até os ajustes finais."
+ />
+ <ExternalItem
+ title="Efeito retícula"
+ href="https://www.gimpbrasil.org/2012/08/efeito-reticula.html"
+ detail="GIMP Brasil · 2012"
+ description="Criação do padrão de pontos usado para simular o efeito de impressão em retícula."
+ />
+ <ExternalItem
+ title="Texto no estilo Web 2 usando degradê"
+ href="https://www.gimpbrasil.org/2011/04/criando-um-texto-no-estilo-web-2-usando-degrade.html"
+ detail="GIMP Brasil · 2011"
+ description="Um dos tutoriais do meu blog antigo que foi preservado e republicado pelo GIMP Brasil."
+ />
+ <ExternalItem
+ title="Fotos em HD e HDR"
+ href="https://www.gimpbrasil.org/2012/02/fotos-em-hd-e-hdr.html"
+ detail="GIMP Brasil · 2012"
+ description="Tratamento de fotografia para acentuar contraste, detalhes e cores."
+ />
+ <ExternalItem
+ title="Efeito camuflagem"
+ href="https://www.gimpbrasil.org/2011/05/efeito-camuflagem.html"
+ detail="GIMP Brasil · 2011"
+ description="Construção de uma textura de camuflagem usando os recursos do GIMP."
+ />
+ <ExternalItem
+ title="Efeito rodamoinho"
+ href="https://www.gimpbrasil.org/2011/04/efeito-rodamoinho.html"
+ detail="GIMP Brasil · 2011"
+ description="Aplicação de distorção e composição para produzir o efeito de rodamoinho."
+ />
+ </ul>
+ <p className={styles.platformLink}>
+ <a
+ href="https://www.gimpbrasil.org/?s=paulo+matos"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ Ver os resultados para Paulo Matos no GIMP Brasil
+ </a>
+ </p>
+ </section>
+
+ <section id="imisturebas">
+ <h2>Blog iMisturebas</h2>
+ <p>
+ O iMisturebas no Blogger foi criado para complementar o canal de mesmo
+ nome. Os textos organizavam materiais que não cabiam bem em vídeo e
+ ajudavam pessoas a encontrar o canal pelas buscas. A mistura de
+ programação, receitas e outros assuntos vinha do propósito do
+ projeto: documentar interesses diferentes, não manter uma publicação
+ especializada.
+ </p>
+ <ul className={styles.list}>
+ <ExternalItem
+ title="Blog iMisturebas"
+ href="https://imisturebas.blogspot.com/"
+ detail="Blogger · arquivo"
+ description="O arquivo completo, com publicações de diferentes assuntos."
+ />
+ <ExternalItem
+ title="Programação no iMisturebas"
+ href="https://imisturebas.blogspot.com/p/programacao.html"
+ detail="Blogger · programação"
+ description="O índice que reunia as publicações relacionadas a programação."
+ />
+ </ul>
+ <p>
+ A relação entre o blog e os vídeos está explicada em{" "}
+ <Link href="/publicacoes/canais">canais.md</Link>.
+ </p>
+ </section>
+ </div>
+ );
+};
+
+export default ArtigosPage;src/app/publicacoes/canais/page.tsxadicionado
@@ -0,0 +1,178 @@
+import Link from "next/link";
+import { pageMetadata } from "@/data/site";
+import styles from "../publicacoes.module.css";
+
+export const metadata = pageMetadata({
+ title: "Canais e registros em vídeo",
+ description:
+ "História dos canais iMisturebas e Programei, com vídeos de Paulo Matos sobre programação, matemática e engenharia.",
+ path: "/publicacoes/canais",
+});
+
+type VideoItemProps = {
+ title: string;
+ href: string;
+ detail: string;
+ description: string;
+};
+
+const VideoItem = ({
+ title,
+ href,
+ detail,
+ description,
+}: VideoItemProps) => (
+ <li className={styles.item}>
+ <a href={href} target="_blank" rel="noopener noreferrer">
+ <span className={styles.itemTitle}>{title}</span>
+ </a>
+ <span className={styles.detail}>{detail}</span>
+ <p className={styles.description}>{description}</p>
+ </li>
+);
+
+const CanaisPage = () => {
+ return (
+ <div className={`contentPage ${styles.page}`}>
+ <h1>Canais e registros em vídeo</h1>
+ <p>
+ Mantive dois canais no YouTube antes de concentrar minha documentação
+ neste site. Eles estão encerrados, mas alguns vídeos ainda representam
+ bem a relação entre programação, matemática, engenharia e ensino que
+ aparece nos meus projetos atuais.
+ </p>
+
+ <section id="imisturebas-canal">
+ <h2>iMisturebas Canal</h2>
+ <p>
+ O iMisturebas foi minha primeira experiência publicando vídeos. Não
+ havia uma linha editorial única: o canal reuniu programação,
+ matemática, engenharia, edição de imagens e conteúdo de
+ entretenimento. O nome descrevia exatamente essa mistura.
+ </p>
+ <p>
+ Alguns vídeos de entretenimento tiveram centenas de milhares de
+ visualizações. Para este portfólio, porém, os números são menos
+ importantes que os vídeos técnicos: são eles que registram as
+ primeiras tentativas de transformar estudo e projetos em explicações.
+ </p>
+ <p>
+ O <Link href="/publicacoes/artigos#imisturebas">blog iMisturebas</Link>{" "}
+ veio depois como apoio ao canal. Ele organizava materiais em texto e
+ criava outra forma de chegar aos vídeos por meio das buscas.
+ </p>
+ <p className={styles.platformLink}>
+ <a
+ href="https://www.youtube.com/@iMisturebasCanal"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ Ver o iMisturebas Canal no YouTube
+ </a>
+ </p>
+ </section>
+
+ <section id="videos-selecionados">
+ <h2>Vídeos selecionados</h2>
+ <p>
+ O canal tem conteúdos de assuntos e níveis de produção diferentes.
+ Em vez de reproduzir o acervo inteiro, selecionei os vídeos que se
+ conectam de forma mais direta à minha formação e ao desenvolvimento
+ de software.
+ </p>
+ <ul className={styles.list}>
+ <VideoItem
+ title="HP Prime — Transformada de Laplace"
+ href="https://www.youtube.com/watch?v=MNyie_cE-aA"
+ detail="Matemática · HP Prime"
+ description="Uso da calculadora para resolver transformadas de Laplace, conteúdo ligado à formação em matemática e engenharia."
+ />
+ <VideoItem
+ title="HP Prime — Frações parciais"
+ href="https://www.youtube.com/watch?v=LF3CK3kvrxA"
+ detail="Matemática · HP Prime"
+ description="Resolução de frações parciais com uma ferramenta usada em disciplinas de cálculo e engenharia."
+ />
+ <VideoItem
+ title="HP Prime — Sistemas lineares"
+ href="https://www.youtube.com/watch?v=nRfItnARUbc"
+ detail="Matemática · HP Prime"
+ description="Resolução de sistemas lineares, assunto que mais tarde também apareceu no aplicativo Zé Chinelão."
+ />
+ <VideoItem
+ title="Carro v.104"
+ href="https://www.youtube.com/watch?v=zmYj62ZDXO0"
+ detail="Programação · C · Allegro 5"
+ description="Registro de um jogo desenvolvido em C com Allegro 5, anterior aos projetos atuais de jogos e engines."
+ />
+ <VideoItem
+ title="FEMM — motor de indução com rotor bloqueado"
+ href="https://www.youtube.com/watch?v=yNb0IY0yJuQ"
+ detail="Engenharia elétrica · FEMM · Lua"
+ description="Parte visual de um trabalho sobre máquinas elétricas. Usei Lua para controlar o FEMM, executar as simulações e salvar os quadros que formaram o vídeo."
+ />
+ </ul>
+ <p>
+ O relatório com a análise e os scripts está disponível em{" "}
+ <Link href="/publicacoes/artigos#trabalho-academico">
+ artigos.md
+ </Link>
+ .
+ </p>
+ </section>
+
+ <section id="programei">
+ <h2>Programei</h2>
+ <p>
+ O Programei foi uma segunda tentativa, desta vez com um assunto
+ definido e aulas organizadas em sequência. O canal ficou limitado a
+ três vídeos introdutórios de C. Não é um curso completo; seu valor
+ aqui é registrar a mudança de um canal geral para uma proposta
+ específica de ensino de programação.
+ </p>
+ <ul className={styles.list}>
+ <VideoItem
+ title="C — Aula 001: Olá, mundo"
+ href="https://www.youtube.com/watch?v=WnlKstTZDYk"
+ detail="Curso introdutório de C"
+ description="Estrutura inicial de um programa e primeiro código executável."
+ />
+ <VideoItem
+ title="C — Aula 002: Variáveis"
+ href="https://www.youtube.com/watch?v=h-UR2j2yHpA"
+ detail="Curso introdutório de C"
+ description="Declaração de variáveis e armazenamento de valores."
+ />
+ <VideoItem
+ title="C — Aula 003: Tipos primitivos e printf"
+ href="https://www.youtube.com/watch?v=khKxwROFGN8"
+ detail="Curso introdutório de C"
+ description="Tipos básicos da linguagem e saída formatada com printf."
+ />
+ </ul>
+ <p className={styles.platformLink}>
+ <a
+ href="https://www.youtube.com/@programei5058"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ Ver o Programei no YouTube
+ </a>
+ </p>
+ </section>
+
+ <section id="o-que-ficou">
+ <h2>O que ficou</h2>
+ <p>
+ Os canais não continuaram, mas a prática continuou. Hoje documento
+ decisões com mais profundidade nos <Link href="/projetos">projetos</Link>{" "}
+ e no <Link href="/blog">blog</Link>. A diferença está no formato e no
+ rigor; a motivação de aprender construindo e explicar o processo é a
+ mesma.
+ </p>
+ </section>
+ </div>
+ );
+};
+
+export default CanaisPage;src/app/publicacoes/page.tsxadicionado
@@ -0,0 +1,76 @@
+import Link from "next/link";
+import { VscBook, VscHistory, VscMarkdown } from "react-icons/vsc";
+import { pageMetadata } from "@/data/site";
+import styles from "./publicacoes.module.css";
+
+export const metadata = pageMetadata({
+ title: "Publicações",
+ description:
+ "Artigos, vídeos e registros de Paulo Matos sobre programação, matemática, engenharia e desenvolvimento de software.",
+ path: "/publicacoes",
+});
+
+const PublicacoesPage = () => {
+ return (
+ <div className={`contentPage ${styles.page}`}>
+ <h1>Publicações</h1>
+ <p>
+ Antes deste site, publiquei artigos, tutoriais e vídeos em plataformas
+ diferentes. Parte desse material ainda é útil; outra parte vale pelo
+ registro de como comecei a estudar em público e explicar o que aprendia.
+ </p>
+ <p>
+ Este diretório separa os dois formatos. Os textos estão em{" "}
+ <code>artigos.md</code>; os canais e vídeos, em{" "}
+ <code>canais.md</code>. O conteúdo novo fica no blog deste site.
+ </p>
+
+ <h2>O que há aqui</h2>
+ <ul className={styles.directoryList}>
+ <li>
+ <Link href="/publicacoes/artigos">
+ <VscMarkdown aria-hidden="true" />
+ <span>
+ <strong>artigos.md</strong>
+ <small>
+ Blog atual, trabalho acadêmico, artigos no Medium, tutoriais no
+ GIMP Brasil e o arquivo do iMisturebas.
+ </small>
+ </span>
+ </Link>
+ </li>
+ <li>
+ <Link href="/publicacoes/canais">
+ <VscHistory aria-hidden="true" />
+ <span>
+ <strong>canais.md</strong>
+ <small>
+ Os canais iMisturebas e Programei, com uma seleção dos vídeos
+ que ainda representam essa trajetória.
+ </small>
+ </span>
+ </Link>
+ </li>
+ <li>
+ <Link href="/blog">
+ <VscBook aria-hidden="true" />
+ <span>
+ <strong>blog/</strong>
+ <small>Os artigos técnicos publicados atualmente.</small>
+ </span>
+ </Link>
+ </li>
+ </ul>
+
+ <h2>Por que manter o material antigo</h2>
+ <p>
+ Os assuntos e a qualidade de produção mudaram, mas o processo é o
+ mesmo: entender um problema, construir alguma coisa e documentar o que
+ funcionou. O arquivo existe para preservar essa continuidade, sem
+ apresentar projetos encerrados como trabalho atual.
+ </p>
+ </div>
+ );
+};
+
+export default PublicacoesPage;src/app/publicacoes/publicacoes.module.cssadicionado
@@ -0,0 +1,103 @@
+.page .directoryList,
+.page .list {
+ list-style: none;
+ margin: 1rem 0 0;
+ padding: 0;
+}
+
+.page .directoryList li,
+.page .item {
+ margin-bottom: 2rem;
+}
+
+.directoryList a {
+ display: grid;
+ grid-template-columns: 1.25rem minmax(0, 1fr);
+ gap: 0.75rem;
+ align-items: start;
+ color: var(--text-color);
+ font-weight: 400;
+ text-decoration: none;
+}
+
+.directoryList a:hover {
+ text-decoration: none;
+}
+
+.directoryList a:hover strong {
+ color: var(--primary-color);
+ text-decoration: underline;
+}
+
+.directoryList svg {
+ margin-top: 0.2rem;
+ color: var(--primary-color);
+}
+
+.directoryList span {
+ display: flex;
+ flex-direction: column;
+ gap: 0.35rem;
+}
+
+.directoryList strong {
+ font-family: Consolas, "SF Mono", Menlo, "Courier New", monospace;
+ font-size: var(--font-size-md);
+ font-weight: 500;
+}
+
+.directoryList small {
+ color: var(--text-color-prose);
+ font-size: var(--font-size-sm);
+ line-height: 1.5;
+}
+
+.item > a {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.35rem;
+ color: var(--text-color);
+ font-weight: 500;
+ text-decoration: none;
+}
+
+.item > a:hover {
+ color: var(--primary-color);
+ text-decoration: underline;
+}
+
+.itemTitle {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.35rem;
+ font-size: var(--font-size-md);
+}
+
+.detail {
+ display: block;
+ margin-top: 0.35rem;
+ color: var(--text-color-secondary);
+ font-family: Consolas, "SF Mono", Menlo, "Courier New", monospace;
+ font-size: var(--font-size-xs);
+}
+
+.page .description {
+ margin: 0.5rem 0 0;
+ color: var(--text-color-prose);
+ font-size: var(--font-size-sm);
+ line-height: 1.5;
+}
+
+.platformLink a {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.35rem;
+ font-size: var(--font-size-sm);
+}
+
+@media (max-width: 600px) {
+ .page .directoryList li,
+ .page .item {
+ margin-bottom: 1.5rem;
+ }
+}src/app/sobre-mim/page.tsxmodificado
@@ -1,4 +1,5 @@
import Image from "next/image";
+import Link from "next/link";
import profileImage from "@/assets/images/profile.jpg";
import { pageMetadata } from "@/data/site";
@@ -75,6 +76,21 @@ const SobreMimPage = () => {
especial pelas onze-horas, e cheguei a construir uma compostagem
caseira, aprendendo na prática sobre ciclos e sustentabilidade.
</p>
+
+ <h2 id="trajetoria-digital">Minha trajetória digital</h2>
+ <p>
+ Antes deste portfólio, mantive blogs e canais onde comecei a
+ documentar projetos, ensinar programação e compartilhar outros
+ interesses. Também publiquei tutoriais em comunidades e artigos
+ técnicos no Medium. Esses espaços registram a fase em que comecei a
+ transformar estudo em conteúdo; hoje concentro novos projetos e
+ textos neste site.
+ </p>
+ <p>
+ Organizei essa história, os canais antigos e os textos que ainda
+ estão disponíveis no meu{" "}
+ <Link href="/publicacoes">arquivo de publicações</Link>.
+ </p>
</div>
</div>
</div>src/data/sidebarTree.tsmodificado
@@ -74,6 +74,7 @@ export const sidebarTree: TreeItem[] = [
hash: "minha-jornada-com-a-programacao",
},
{ title: "Além do Código", hash: "alem-do-codigo" },
+ { title: "Minha trajetória digital", hash: "trajetoria-digital" },
],
},
{
@@ -110,6 +111,48 @@ export const sidebarTree: TreeItem[] = [
},
],
},
+ {
+ id: "6b19d10c-ae84-44b6-a59b-50fa7872b2a0",
+ type: "node",
+ title: "Publicações",
+ url: "/publicacoes",
+ children: [
+ {
+ id: "be0d45b9-87fc-4333-a191-a92977608bb4",
+ type: "leaf",
+ title: "README.md",
+ icon: VscMarkdown,
+ url: "/publicacoes",
+ },
+ {
+ id: "b132a67b-1db9-43c3-a47a-d26fe02f6481",
+ type: "leaf",
+ title: "artigos.md",
+ icon: VscMarkdown,
+ url: "/publicacoes/artigos",
+ outline: [
+ { title: "Neste site", hash: "neste-site" },
+ { title: "Trabalho acadêmico", hash: "trabalho-academico" },
+ { title: "Medium", hash: "medium" },
+ { title: "GIMP Brasil", hash: "gimp-brasil" },
+ { title: "iMisturebas", hash: "imisturebas" },
+ ],
+ },
+ {
+ id: "5f98807c-1dd0-4a02-91c5-70672a304573",
+ type: "leaf",
+ title: "canais.md",
+ icon: VscMarkdown,
+ url: "/publicacoes/canais",
+ outline: [
+ { title: "iMisturebas Canal", hash: "imisturebas-canal" },
+ { title: "Vídeos selecionados", hash: "videos-selecionados" },
+ { title: "Programei", hash: "programei" },
+ { title: "O que ficou", hash: "o-que-ficou" },
+ ],
+ },
+ ],
+ },
{
id: "5a276ab2-df22-492c-b83c-51db33c77649",
type: "node",