📸 Projeto: Aplicação Web Reativa com React

📖 Sobre o Projeto

Este projeto consiste no desenvolvimento de uma aplicação web reativa utilizando React, construída do zero com foco total no entendimento da biblioteca.

A aplicação simula funcionalidades inspiradas em redes sociais como o Instagram, incluindo estrutura de feed, navegação entre páginas, gerenciamento de estado e componentização.

O objetivo principal foi compreender profundamente como o React funciona internamente, evitando dependência excessiva de bibliotecas externas.

---

🎯 Objetivo

Construir uma aplicação completa utilizando:

• Componentização
• Gerenciamento de estado
• Navegação entre páginas
• Estilização modular
• Comunicação entre componentes
• Manipulação de eventos

Tudo isso utilizando apenas o ecossistema essencial do React.

---

🧱 Estrutura da Aplicação

A aplicação foi organizada seguindo boas práticas de arquitetura:

• Componentes reutilizáveis
• Separação de responsabilidades
• Estrutura modular de pastas
• Gerenciamento de rotas
• Context API para estado global

---

🛠️ Conceitos Aplicados

⚛️ React

• Criação de componentes funcionais
• Uso de propriedades (props)
• Manipulação de eventos
• Renderização condicional
• Listas e chaves (keys)

---

🪝 Hooks

Foram utilizados hooks fundamentais como:

• useState
• useEffect
• useContext

Permitindo controle de estado, efeitos colaterais e compartilhamento de dados entre componentes.

---

🌐 React Router

• Criação de rotas
• Navegação entre páginas
• Rotas dinâmicas
• Estrutura de layout persistente

---

🌎 useContext

• Gerenciamento de estado global
• Compartilhamento de dados entre múltiplos componentes
• Redução de prop drilling

---

🎨 CSS Modules

• Estilização isolada por componente
• Evita conflitos globais
• Organização mais previsível do CSS

---

🔎 PropTypes

• Validação de propriedades
• Segurança no desenvolvimento
• Melhoria na manutenção do código

---

📱 Funcionalidades Implementadas

• Estrutura de feed
• Página de perfil
• Sistema de navegação
• Componentes reutilizáveis
• Atualização dinâmica da interface
• Interações com eventos

---

🧠 Principais Aprendizados

• Como o React reconcilia a interface
• Importância da imutabilidade
• Fluxo de dados unidirecional
• Separação entre estado local e global
• Componentização eficiente
• Controle de efeitos colaterais

---

🛠️ Tecnologias Utilizadas

• React
• JavaScript (ES6+)
• React Router
• CSS Modules
• PropTypes

---

Este projeto foi desenvolvido com o objetivo de consolidar o entendimento profundo do React e da construção de aplicações modernas baseadas em componentes.