feat: catalogo de herois Marvel e DC com express e bootstrap
This commit is contained in:
commit
5f6ad89128
4 files changed
+254
No files matched your search
@@ -0,0 +1,57 @@
|
||||
# DBE-S02 - Catálogo de Heróis (Marvel e DC)
|
||||
|
||||
Aplicação web desenvolvida para a disciplina de **Desenvolvimento Back-End (DBE)** - Semana 02. O projeto demonstra a criação de um servidor com **Node.js** e **Express**, rotas dinâmicas com parâmetros de requisição (`req.params`) e interface estilizada com **Bootstrap 5**.
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Tecnologias Utilizadas
|
||||
|
||||
- **Node.js**: Ambiente de execução JavaScript no servidor.
|
||||
- **Express.js**: Framework minimalista para criação de rotas e APIs.
|
||||
- **Bootstrap 5 (CDN)**: Framework CSS para estilização moderna e responsiva.
|
||||
- **HTML5 / Template Literals**: Renderização dinâmica de layouts e páginas.
|
||||
|
||||
---
|
||||
|
||||
## 📌 Rotas e Funcionalidades
|
||||
|
||||
| Método | Rota | Descrição |
|
||||
|---|---|---|
|
||||
| `GET` | `/` | Página inicial com cards de navegação e heróis em destaque. |
|
||||
| `GET` | `/marvel` | Lista de personagens do Universo Marvel Comics com links diretos. |
|
||||
| `GET` | `/dc` | Lista de personagens do Universo DC Comics com links diretos. |
|
||||
| `GET` | `/personagem/:empresa/:nome` | Rota dinâmica com parâmetros obrigatórios que exibe a ficha do herói com tema personalizado (vermelho para Marvel, azul para DC). |
|
||||
|
||||
### Exemplos de URLs Dinâmicas:
|
||||
- `http://localhost:3030/personagem/marvel/Thor`
|
||||
- `http://localhost:3030/personagem/marvel/Homem-Aranha`
|
||||
- `http://localhost:3030/personagem/dc/Batman`
|
||||
- `http://localhost:3030/personagem/dc/Superman`
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Como Executar o Projeto Localmente
|
||||
|
||||
1. **Clone o repositório:**
|
||||
```bash
|
||||
git clone https://gitea.tsiad.com.br/anderson/DBE-S02.git
|
||||
cd DBE-S02
|
||||
```
|
||||
|
||||
2. **Instale as dependências:**
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
3. **Inicie o servidor:**
|
||||
- Modo padrão:
|
||||
```bash
|
||||
npm start
|
||||
```
|
||||
- Modo de desenvolvimento (watch mode):
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
4. **Acesse no navegador:**
|
||||
[http://localhost:3030](http://localhost:3030)
|
||||
Reference in new issue
Block a user