Skip to content

Buscador de CEP integrado à API do ViaCEP. Permite consultar endereços de forma rápida e prática, exibindo logradouro, bairro, cidade e estado com apenas um clique. Ideal para treinar consumo de APIs e manipulação de estados no React. 🚀

Notifications You must be signed in to change notification settings

alicessena/buscador-de-cep

Repository files navigation

📍 Buscador de CEP com React

Este é um aplicativo simples para buscar informações de um CEP usando React.js e a API do ViaCEP. Ele permite ao usuário inserir um CEP, buscar seus detalhes e visualizar informações como endereço, bairro, cidade e estado.

Teste Agora

🚀 Funcionalidades

  • Buscar CEP: O usuário pode inserir um CEP e visualizar os detalhes do endereço correspondente.
  • Feedback com Notificações: O sistema exibe mensagens informando se a busca foi bem-sucedida ou se ocorreu um erro.
  • Indicador de Carregamento: Exibe um ícone animado enquanto a requisição está em andamento.
  • Interface Intuitiva: Design simples e fácil de usar.

Sucesso

Campo Vazio

CEP Inválido

🛠️ Estrutura do Código

O código está organizado dentro do componente principal App.js, que gerencia os estados e eventos da aplicação.

📌 Estado do Componente

  • input: Armazena o CEP digitado pelo usuário.
  • cep: Guarda os dados retornados pela API.
  • loading: Controla a exibição do ícone de carregamento.

📌 Funções Importantes

  • handleSearch():

    • Valida se o campo de entrada não está vazio.
    • Faz a requisição à API ViaCEP para buscar os detalhes do CEP.
    • Exibe notificações de sucesso ou erro.
  • notify(msg, toastType):

    • Utiliza a biblioteca React Toastify para exibir mensagens de alerta.

🔍 Como Rodar o Projeto Localmente

  1. Clone o repositório:
    git clone https://github.com/seu-usuario/buscador-cep.git

About

Buscador de CEP integrado à API do ViaCEP. Permite consultar endereços de forma rápida e prática, exibindo logradouro, bairro, cidade e estado com apenas um clique. Ideal para treinar consumo de APIs e manipulação de estados no React. 🚀

Topics

Resources

Stars

Watchers

Forks