/mapadobairro

Projeto final do curso de Front-End da Udacity

Primary LanguageJavaScript

App Restaurantes em Roma

Para esta aplicação foi utilizado Javascript, HTML, CSS e a biblioteca React.js.

Esse aplicativo mostra um mapa com a localização de restaurantes em Roma. Ao cliclar em um marcador do mapa ou um item da lista na barra lateral anuma o marcador correspondente e mostra imagens tiradas nas proximidades.

O aplicativo possui um botão na barra superior para mostrar/esconder a barra lateral.

A barra lateral também possui uma campo de entrada que permite filtrar os itens da lista e os marcadores correspondentes no mapa.

Rodando a aplicação

Para rodar a aplicação:

  1. Clone ou baixe o repositório em seu computador.
  2. Instale as dependências com npm install.
  3. Inicie o servidor com npm start.

O seu navegador deve abrir uma página com o endereço localhost:3000, onde está rodando a aplicação.

APIs e pacotes

Neste projetos foram usadas as APIs do Google Maps e do Flicker.

A API do Google Maps foi utilizada para a criação do mapa e todos os seus elementos, enquanto a API do Flicker foi utilizada para carregar as fotos tiradas nas proximidades dos locais marcados no mapa.

Para a criação do projeto foi utilizado o pacote create-react-app. Para facilitar o carregamento e utilização da API do Google Maps foi utilizado o pacote google-map-react

Créditos

GIFs e imagens de ícones foram utilizadas de terceiros.