Um Boilerplate Full-Stack Moderno com TanStack Start · CarlosZiegler

Introdução ao Projeto

Fullstack Start Template é um projeto open source que fornece uma base sólida para construir aplicações web modernas, utilizando um conjunto selecionado de tecnologias com foco em experiência do desenvolvedor, desempenho e segurança de tipos. Em outras palavras, trata-se de um boilerplate full-stack que reúne as melhores práticas e ferramentas atuais para quem deseja iniciar um novo projeto web com rapidez e qualidade, evitando reinventar a roda. O objetivo principal é acelerar o desenvolvimento inicial e garantir uma estrutura consistente, performática e totalmente escrita em TypeScript desde o back-end até o front-end.

Motivações do Autor

A motivação para criar este template veio do desejo de testar na prática o novo framework TanStack Start – um framework full-stack React (ainda em beta) que traz recursos como Server Side Rendering (SSR) completo, streaming de conteúdo e server functions, tudo isso impulsionado pelo roteador TanStack Router e pelo bundler Vite. Sou fã do ecossistema TanStack (conhecido por ferramentas como React Query, TanStack Router, etc.) e vi no TanStack Start uma oportunidade de unir desempenho e ótima DX (Developer Experience) em uma só stack. Ele decidiu criar um boilerplate para avaliar o desempenho desse framework em cenários reais e destacar os benefícios do hot module replacement (HMR) – ou seja, a recarga instantânea de módulos durante o desenvolvimento, que acelera drasticamente o ciclo de feedback de código.

Stack de Tecnologias Utilizadas

TanStack Start
React
TypeScript
TanStack Router
tRPC
Drizzle ORM (com suporte a PostgreSQL/Neon)
Vite
Bun (runtime JS)
Tailwind CSS
Shadcn/UI
Lucide Icons
TanStack Query
TanStack Store
React Hook Form
TanStack Form
Zod
Better Auth (sistema de autenticação próprio)
Resend + React Email (envio de emails transacionais)
Sentry (monitoramento de erros)
Biome (formatter/linter)
T3 Env (env tipado)
i18next (internacionalização)
AI SDK + MCP Server (para IA com comandos via assistente)

Diferenciais do Template

Desempenho elevado com SSR e streaming
Hot Module Replacement (HMR) super rápido
Segurança de tipos ponta-a-ponta com TypeScript, tRPC e Drizzle
Qualidade de código com Biome, testes e estrutura limpa
Experiência do desenvolvedor (DX) aprimorada
Recursos prontos como auth, email, IA e validação tipada

Como Começar

Instale o Bun
Clone o projeto: git clone https://github.com/CarlosZiegler/fullstack-start-template
Rode bun install
Configure o arquivo .env
Rode bun run db:push para configurar o banco
Inicie com bun run dev e acesse http://localhost:3000

Links úteis

Repositório: github.com/CarlosZiegler/fullstack-start-template
Documentação do TanStack Start: tanstack.com/start
Demo (Vercel): fullstack-start-template.vercel.app

Este template é ideal para quem quer iniciar um projeto full-stack moderno com tipagem forte, DX avançada e recursos prontos para escalar. Dê uma olhada, experimente e contribua com o projeto! 🚀