frontend-1

commit 5b09bb338c69d5d0eeefbc1ababe23a22c308e19

Author: Pedro Lucas Porcellis <porcellis@eletrotupi.com>

all: update readme

 README.md | 96 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++


diff --git a/README.md b/README.md
index 98f1d87b70f4e8934fc4681356fd44a3007de0fd..4afc77bd04f07a9bf44fb7db906070e8a78030ff 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,97 @@
-# frontend
+# Projeto: Aplicação Web Integrada com HTML, CSS e JavaScript
+
+## Propósito do Projeto
+
+Esse projeto foi feito pra juntar tudo que iriamos ver sobre HTML, CSS e
+JavaScript na disciplina. A ideia é criar uma aplicação web funcional, acessível
+com boas práticas de desenvolvimento. O foco é garantir uma experiência legal
+pra quem usar e manter o código organizado pra quem quiser mexer depois
+(literalmente ninguém).
+
+---
 
+## O que o Projeto Tem
+
+### Semântica e Acessibilidade
+
+- Usa elementos HTML5 semânticos como `<header>`, `<nav>`, `<main>`, `<section>`.
+- Segue boas práticas de acessibilidade, como:
+  - Texto alternativo (`alt`) nas imagens.
+  - Navegação acessível pelo teclado com `tabindex` e atributos `aria-*`.
+  - Contraste adequado entre texto e fundo, seguindo as regras WCAG.
+  - Labels descritivos nos formulários pra melhorar a usabilidade.
+
+### Responsividade
+
+- O design é mobile-first, então funciona bem em telas pequenas e maiores.
+- Usei Flexbox, Grid e media queries pra ajustar o layout conforme o tamanho da
+  tela.
+- Tem um menu responsivo (menu hambúrguer).
+
+### JS
+
+- Manipula o DOM pra criar conteúdos dinâmicos.
+- Faz validação de formulários direto no navegador.
+- Usa métodos legais como `filter`, `map` e `reduce` pra trabalhar com dados.
+
+### APIs
+
+- Usa duas APIs HTML5: Geolocation e Web Storage.
+
+### Organização do Código
+
+- Tudo bem separado pra facilitar a vida de quem mexer nessa birosca (ninguém):
+  - `/css/style.css` pros estilos.
+  - `/js/script.js` pra lógica do JavaScript.
+- Estrutura limpa pra manutenção e expansão.
+
+---
 
+## Como Rodar o Projeto
+
+### O que Tu Precisas
+
+- Python 3 instalado no teu computador.
+
+### Passo a Passo
+
+1. Clona o repositório do projeto:
+   ```sh
+   git clone https://github.com/pedrolucasp/frontend-1
+   ```
+2. Vai pro diretório do projeto:
+   ```bash
+   cd frontend-1
+   ```
+
+3. Sobe um servidor HTTP local com Python:
+   ```bash
+   python -m http.server
+   ```
+
+4. Abre o navegador e acessa o endereço:
+   ```
+   http://localhost:8000
+   ```
+
+5. Va juegar
+
+---
+
+## Estrutura do Projeto
+
+```
+/projeto
+├── /css
+│   └── style.css    # Arquivo de estilos da aplicação
+├── /js
+│   └── script.js    # Arquivo com a lógica de JavaScript
+├── /assets
+│   └── (imagens e ícones usados no projeto)
+├── index.html        # Página principal
+└── README.md         # Documentação do projeto
+```
+
+---
+
+**Licença**: MIT. Verifica o LICENSE.