Vou construir seu front-end React ou Next.js a partir de um design Figma e conectá-lo à sua API

O design está pronto e a API está pronta ou quase pronta, mas as telas que os usuários verão ainda não existem. Eu construo apenas o front-end: seu backend, provedor de autenticação e hospedagem permanecem como estão, e o código vai para o seu repositório. Por 14 dias após a entrega, eu corrijo qualquer coisa que não funcione como combinamos, gratuitamente.

Com o Starter, você obtém uma tela ou página do seu arquivo Figma, responsiva e tipada, com seus dados vindos da sua API, ou de um mock até que o endpoint exista. O Standard cobre até cinco telas conectadas à sua API, com estados de carregamento, vazio e erro e formulários com validação. O Advanced permite até doze telas e adiciona telas de login que funcionam com seu provedor de autenticação, componentes compartilhados usados em todo o aplicativo e testes para os fluxos principais.

Sigo o design de perto: espaçamento, escala de tipo e cores vêm do arquivo Figma. Onde uma tela não tem versão móvel, proponho uma antes de construí-la, em vez de adivinhar. Next.js com o App Router é o meu padrão; React puro com Vite é bom quando você não precisa de renderização no servidor. Para estilização, uso Tailwind CSS ou CSS Modules, o que seu projeto já tiver.

Verifico o resultado no Chrome, Firefox e Edge no desktop, e no Chrome em um telefone Android real.

Dois exemplos públicos do meu trabalho de front-end estão no portfólio: uma loja Next.js com filtros, um carrinho e um checkout, e meu próprio site bilíngue.

Trabalho apenas por escrito, sem reuniões. As telas e os endpoints por trás delas são listados antes de eu começar, um link de visualização mostra o trabalho à medida que cresce, e uma breve nota de progresso chega no chat todos os dias úteis.

Etapas para concluir seu projeto
1. Lista de telas - Eu analiso o arquivo Figma e a documentação da sua API e anoto cada tela, seus estados e os endpoints que ela chama. Você confirma a lista antes de qualquer código.
2. Partes base e compartilhadas - Configuração do projeto ou seu repositório existente, cores e tipo do Figma, e o layout e componentes que cada tela reutiliza.
3. Telas e dados - Cada tela é construída de acordo com o design e conectada à sua API, com estados de carregamento, vazio e erro. Um endpoint ausente recebe um mock que é fácil de trocar.
4. Rodada de revisão no link de visualização - Você clica e envia correções em uma lista. Eu as corrijo e mostro o mesmo link novamente.
5. Entrega - O código em seu repositório, uma breve nota sobre a estrutura e como executá-lo, e no Advanced, testes que você pode executar antes de cada lançamento.