joycefatima / location

Aqui está o README atualizado com a informação sobre a fonte de dados utilizada:

---

Projeto Next.js

Este é um projeto Next.js iniciado com create-next-app.

Visão Geral do Projeto 🚀

Este projeto utiliza as seguintes tecnologias incríveis:

• Next.js: Um poderoso framework React para produção.
• TypeScript: Para desenvolvimento JavaScript com segurança de tipos.
• Tailwind CSS: Um framework CSS utility-first para desenvolvimento rápido de UI.
• Axios: Um cliente HTTP baseado em promessas para o navegador e Node.js.
• Material-UI: Um popular framework de UI para React.

Estrutura do Projeto 📂

A estrutura do projeto é a seguinte:

app
|-- globals.css
|-- layout.tsx
|-- page.tsx
components
config
node_modules
public
|-- data.json
.eslintignore
.eslintrc.json
.gitignore
next.config.mjs
package.json
package-lock.json
postcss.config.mjs
README.md
tailwind.config.ts
tsconfig.json

Começando 🚀

Primeiro, execute o servidor de desenvolvimento:

npm run dev
# ou
yarn dev
# ou
pnpm dev
# ou
bun dev

Abra http://localhost:3000 com o seu navegador para ver o resultado. 🎉

Você pode começar a editar a página modificando app/page.tsx. A página atualiza automaticamente conforme você edita o arquivo. 🔄

Saiba Mais 📚

Para saber mais sobre Next.js, confira os seguintes recursos:

• Documentação do Next.js - aprenda sobre as funcionalidades e API do Next.js.
• Aprenda Next.js - um tutorial interativo de Next.js.

Você pode conferir o repositório GitHub do Next.js - seu feedback e contribuições são bem-vindos! 😊

Deploy no Vercel 🚀

A maneira mais fácil de fazer deploy do seu app Next.js é usar a Plataforma Vercel dos criadores do Next.js.

Confira nossa documentação de deploy do Next.js para mais detalhes.

Funcionalidade: Seleção Cascata para Localização 🌍

Este projeto inclui uma funcionalidade que permite aos usuários selecionar um país, em seguida um estado associado, e finalmente uma cidade. Isso é implementado usando ReactJS/NextJS com Material-UI para os componentes de UI.

Implementação da Funcionalidade

• Seleção de País: Usuários podem selecionar um país de uma lista dropdown.
• Seleção de Estado: Com base no país selecionado, o próximo dropdown lista os estados daquele país.
• Seleção de Cidade: Com base no estado selecionado, o dropdown final lista as cidades daquele estado.

Fonte de Dados

Os dados para países, estados e cidades são fornecidos pela API Countries Now.

Bibliotecas Utilizadas

• Material-UI: Para o framework de CSS e componentes de UI.
• Axios: Para buscar dados de uma API ou arquivo JSON local.

Tempo de Desenvolvimento

• Fase Atual: A fase atual do projeto levou aproximadamente 6 horas para ser concluída. Esse tempo incluiu a configuração inicial do projeto, a busca e integração com a API, além da montagem e estilização dos componentes. O tempo foi necessário para garantir que todos os componentes funcionassem corretamente e estivessem devidamente integrados e testados.

Com esta configuração, você pode gerenciar eficientemente seleções em cascata para países, estados e cidades usando React, Next.js e Material-UI. 🎉

---