Pular para o conteúdo
Voltar para projetos

Store Flow

Vitrine de e-commerce com experiência de compra fluida.

Visitar site

Contexto

Exercício próprio de front-end: uma loja que consome a FakeStore API para listar produtos, manter um carrinho e simular um checkout completo em três etapas. O que o estudo exercita é estado global sem biblioteca de store e formulário validado por schema.

Papel

Estudo próprio, sem cliente. Escrevi a aplicação inteira: catálogo, carrinho, checkout, login de demonstração e o tema claro/escuro.

Stack

  • React 18
  • TypeScript
  • Vite
  • Tailwind CSS
  • React Hook Form
  • Zod

Destaques

  • Estado global de carrinho, autenticação e tema com Context API e `useReducer`, sem dependência externa de store.
  • Checkout em três passos (entrega, pagamento e revisão), com validação por etapa via React Hook Form e Zod.
  • Catálogo servido pela FakeStore API, com detalhe do produto em modal e total do carrinho recalculado em tempo real.
  • Tema claro/escuro persistido em `localStorage`, e acessibilidade com alt-text, `aria-label` e navegação por teclado.

Outros cases