PA
pazoliveira/galeria-de-fotos
Aplicação de Galeria de Fotos - Exercício de Programação - PUCRS 2026
Aplicação de Galeria de Fotos - Bandeiras dos Estados Brasileiros
Uma aplicação web que exibe uma galeria de fotos das bandeiras dos Estados Brasileiros, permitindo que os usuários visualizem, filtrem e pesquisem imagens com base em palavras-chave.
📋 Funcionalidades e Requisitos
| Item | Descrição da Implementação |
|---|---|
| Cabeçalho | Título "Galeria de Fotos" centralizado no topo. |
| Layout Grid | Galeria organizada em grade responsiva. |
| Interatividade | Efeito de escala e sombra (hover) nos cartões de fotos. |
| Barra de Busca | Campo de pesquisa com ícone de lupa acima do grid. |
| Filtro em Tempo Real | Busca dinâmica por nome enquanto o usuário digita. |
| Retorno | Exibição de "Nenhuma foto encontrada" para buscas sem resultado. |
| Dados | Conjunto de 27 dados estáticos (Bandeiras dos Estados). |
| Responsividade | Adaptação total para diferentes tamanhos de tela. |
🛠️ Tecnologias
| Tecnologia | Utilização |
|---|---|
| HTML5 | Estrutura e semântica. |
| CSS3 | Layout (Grid/Flexbox) e animações. |
| JS (ES6) | Lógica de busca e renderização dinâmica. |
📂 Estrutura de Pastas
/
├── index.html # Estrutura principal e esqueleto da aplicação
├── style.css # Regras de design, grid responsivo e animações
├── script.js # Motor da aplicação (lógica de filtragem e renderização)
├── README.md # Documentação técnica do projeto
└── imgs/ # Repositório local das bandeiras estaduais
🚀 Como Executar
| Passo | Comando / Ação |
|---|---|
| 1. Obter código | git clone https://github.com/pazoliveira/agil-store.git |
| 2. Acessar pasta | cd agil-store |
| 3. Iniciar Sistema | node index.js |
Autor: Diego Oliveira - PUCRS 2026