Vai virar tendência? Site em next.js 100% custom via painel
Fala Galera MASSA!
Passando aqui para compartilhar com vocês mais este site que eu fiz, fiz a analise das tecnologias utilizadas usando o CODEX então abaixo está todas as tecnologias usadas.
O site tem cara de landing page porem é 100% customizável pelo painel que fiz.
Tecnologias utilizadas:
O projeto utiliza Next.js 16 como framework principal, aproveitando o App Router para renderização server-side e geração de sites estáticos. A aplicação é desenvolvida em TypeScript para garantir type-safety e maior confiabilidade do código.
Arquitetura Frontend
A interface é construída com React 18 e estilizada com Tailwind CSS, proporcionando um desenvolvimento rápido e design responsivo. Os componentes UI são baseados em shadcn/ui e Radix UI, garantindo acessibilidade e customização. Animações fluidas são implementadas com Framer Motion.
Backend e Dados
O backend utiliza Next.js API Routes para criar endpoints RESTful. O banco de dados PostgreSQL é gerenciado através do Prisma ORM, oferecendo type-safety e migrações automatizadas.
Funcionalidades Principais
- Autenticação: Sistema de autenticação com NextAuth e hash de senhas com bcryptjs
- Formulários: Gerenciamento eficiente com React Hook Form e validação com Zod
- Editor Rico: Editor de conteúdo com Tiptap, suportando imagens, links e vídeos do YouTube
- Analytics: Monitoramento com Vercel Analytics e Speed Insights
- Integrações: Integração com YouTube via oEmbed API
Diferenciais Técnicos
- Type-Safety: TypeScript em todo o projeto, desde o frontend até o banco de dados (Prisma)
- Acessibilidade: Componentes baseados em Radix UI seguindo padrões WAI-ARIA
- Performance: SSR/SSG do Next.js, otimizações de imagens e lazy loading
- Developer Experience: Ferramentas modernas como ESLint, TypeScript e Prisma Studio
Link para acessar o site Matheus Leandro
Aqui é o vídeo do Próprio Matheus reagindo as funcionalidades que eu implementei