https://github.com/camillamendess/cinetag-react
Desenvolvimento de uma aplicação React.
https://github.com/camillamendess/cinetag-react
react react-hooks react-router
Last synced: about 2 months ago
JSON representation
Desenvolvimento de uma aplicação React.
- Host: GitHub
- URL: https://github.com/camillamendess/cinetag-react
- Owner: camillamendess
- Created: 2024-09-14T13:44:08.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-10-01T19:22:00.000Z (over 1 year ago)
- Last Synced: 2025-06-30T07:48:39.261Z (12 months ago)
- Topics: react, react-hooks, react-router
- Language: JavaScript
- Homepage: https://cinetag-nine-sand.vercel.app
- Size: 1.71 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Projeto em React - Cinetag
## Descrição
Este projeto envolve o desenvolvimento de uma aplicação utilizando **React**. O foco foi construir uma interface de usuário dinâmica, utilizando componentes, rotas e hooks do React.
## Aprendizados
### 1. Iniciando um Projeto React
Aprendi a iniciar um projeto em React, utilizando ferramentas como **Create React App**, que facilitam a configuração inicial do ambiente de desenvolvimento.
### 2. Construção de Componentes e Páginas
Desenvolvi **componentes** reutilizáveis e páginas, permitindo a criação de uma interface organizada, facilitando a manutenção e o reaproveitamento de código.
### 3. Implementação de Rotas
Implementei **rotas normais**, **dinâmicas** e **aninhadas** utilizando a biblioteca **React Router**.
### 4. Aplicação de Hooks
Utilizei os hooks do React, como:
- **useState**: Para gerenciar estados locais nos componentes.
- **useParams**: Para acessar parâmetros dinâmicos nas rotas.
- **useEffect**: Para realizar efeitos colaterais, como chamadas de API e manipulações de DOM.
- **useContext**: Para compartilhar dados entre componentes sem precisar passar props manualmente.
### 5. Contextos do React
Entendi como funcionam os **contextos do React**, que permitem compartilhar dados entre componentes sem a necessidade de passar props de forma manual.
### 6. Consumo de API
Aprendi a **consumir uma API** dentro do projeto, utilizando o **fetch**. Isso permitiu que a aplicação se comunicasse com um servidor externo e exibisse dados dinâmicos para os usuários.
## Tecnologias Utilizadas
- **React**
- **React Router**
- **JavaScript**
- **HTML/CSS**