Voltar

jotacode.dev — meu blog pessoal

self
published

Meu blog pessoal, onde compartilho ideias e experiências sobre desenvolvimento de software, produtividade e vida.

jotacode.dev — meu blog pessoal

Desenvolvido com

Links do projeto

Ver demonstração

JotaCode.dev — meu espaço para ideias e estudos

Visão geral do projeto

O Jotacode.dev é uma plataforma de blog pessoal construída com tecnologias web modernas. Ela foi criada para compartilhar conteúdo técnico, experiências de desenvolvimento e aprendizados sobre programação. O projeto não é apenas um blog: também funciona como uma aplicação web completa e como uma implementação prática das boas práticas que venho estudando.
O site foi desenvolvido enquanto eu aprendia e praticava as tecnologias utilizadas nele.

Implementação técnica

Tecnologias principais

  • Next.js: aproveita os recursos do React, a renderização no servidor e a geração de páginas estáticas.
  • TypeScript: aumenta a segurança de tipos e melhora a experiência de desenvolvimento.
  • Tailwind CSS: fornece um sistema visual moderno e responsivo.
  • React: permite construir componentes de interface dinâmicos e interativos.

Principais recursos

  1. Gerenciamento dinâmico de conteúdo
    • Publicações em Markdown com suporte a frontmatter.
    • Componentes MDX personalizados para enriquecer a apresentação do conteúdo.
    • Otimização automática de SEO para as diferentes áreas do site.
  2. Arquitetura moderna
    • Renderização no servidor para melhorar desempenho e indexação.
    • Geração estática das publicações.
    • Layout responsivo em diferentes tamanhos de tela.
    • Suporte aos temas claro e escuro.
  3. Seções de conteúdo
    • Página inicial com publicações e projetos em destaque.
    • Blog com artigos organizados.
    • Portfólio de projetos.
    • Biblioteca de snippets de código.
    • Roadmaps de estudo.
    • Área de aprendizado com materiais selecionados.
    • Dashboard com informações pessoais e integrações.
    • Playgrounds interativos de Ruby e JavaScript.

Otimizações de desempenho

  • Otimização de imagens com o componente Image do Next.js.
  • Carregamento sob demanda para reduzir o tempo inicial da página.
  • Geração estática de páginas para melhorar o SEO.
  • Entrega otimizada de arquivos e recursos visuais.

Jornada de desenvolvimento

Este blog representa minha evolução no desenvolvimento web moderno. O caminho começou com HTML, CSS e JavaScript e avançou até a criação de uma aplicação completa com Next.js. O projeto continua mudando conforme adiciono recursos e aprimoro o que já existe, funcionando ao mesmo tempo como plataforma de estudos e demonstração prática das minhas habilidades.

Melhorias futuras

  • Aprimorar o destaque de sintaxe nos blocos de código.
  • Integrar novas ferramentas e serviços voltados a desenvolvedores.
  • Melhorar a pesquisa de conteúdo.
  • Evoluir os recursos de comentários e participação da comunidade.
  • Continuar refinando desempenho, acessibilidade e experiência de uso.

Aprendizados técnicos

A construção deste blog trouxe experiência prática com:
  • Padrões modernos do React e hooks.
  • Recursos atuais do Next.js.
  • Boas práticas de TypeScript.
  • Padrões de estilização com Tailwind CSS.
  • Técnicas de otimização para mecanismos de busca.
  • Estratégias de desempenho para aplicações web.
O blog não funciona apenas como uma plataforma de conteúdo. Ele é um projeto vivo, que evolui junto com a minha trajetória e incorpora novas tecnologias e boas práticas conforme elas fazem sentido para o ecossistema do site.

Inspirações

  • aulianza.id
  • timlrx.com