Files
DBE-S04/README.md
T

4.8 KiB

DBE-S04 - Cadastro e Listagem de Instrumentos Musicais

Aluno: Anderson Valadares Pinto (20251PL.TSIAD0018) [SLS]

Aplicação web desenvolvida para a disciplina de Desenvolvimento Back-End (DBE) - Semana 04. O projeto demonstra o cadastro e a listagem de instrumentos musicais em uma loja, utilizando Node.js, Express, EJS, MongoDB (com Mongoose) e estilização com Bootstrap 5.


🛠️ Tecnologias Utilizadas

  • Node.js: Ambiente de execução JavaScript no servidor com suporte a ES Modules ("type": "module").
  • Express.js: Framework minimalista para criação de servidores HTTP e roteamento dinâmico.
  • EJS (Embedded JavaScript): Mecanismo de templates para renderização dinâmica no lado do servidor (SSR).
  • MongoDB + Mongoose: Banco de dados orientado a documentos e modelagem dos instrumentos.
  • Bootstrap 5 & Bootstrap Icons (CDN): Framework CSS responsivo e ícones para uma interface moderna e acessível.

🎸 Instrumentos de Teste

O script seed.js cadastra seis instrumentos, atendendo às orientações da atividade:

Nome Fabricante Preço Tipo
Guitarra Elétrica Stratocaster Fender R$ 5.490,00 Cordas
Guitarra Acústica Folk Yamaha R$ 2.190,00 Cordas
Baixo Elétrico SR300 Ibanez R$ 3.890,00 Cordas
Bateria Acústica Roadshow Pearl R$ 7.290,00 Percussão
Teclado Digital Juno-DS61 Roland R$ 4.590,00 Teclas
Saxofone Alto YAS-280 Yamaha R$ 6.290,00 Sopro

Há três instrumentos do tipo Cordas, preços diferentes e nomes que permitem testar uma pesquisa por "Guitarra", "Yamaha" ou "Elétrica" posteriormente.


📌 Rotas e Endpoints

Método Rota Descrição
GET / Redireciona para a listagem de instrumentos.
GET /instrumentos Lista todos os instrumentos cadastrados, com nome, fabricante, tipo e preço.
GET /instrumentos/add Exibe o formulário de cadastro de um novo instrumento.
POST /instrumentos Recebe os dados do formulário, grava no MongoDB e exibe a confirmação.

Exemplos de URLs para Testes:

  • http://localhost:3000/instrumentos — Listagem completa do estoque
  • http://localhost:3000/instrumentos/add — Formulário de cadastro
  • http://localhost:3000/naoexiste — Resposta de página não encontrada (404)

📂 Estrutura do Projeto

DBE-S04/
├── models/
│   └── Instrumento.js      # Schema e validações do instrumento
├── routes/
│   └── instrumento.js      # Rotas de cadastro e listagem
├── views/
│   ├── instrumento/
│   │   ├── add.ejs         # Formulário de cadastro
│   │   ├── addok.ejs       # Confirmação do cadastro
│   │   └── lst.ejs         # Listagem tabular com loop EJS
│   └── erro.ejs            # Páginas de erro 404 e 500
├── .gitignore
├── app.js                  # Servidor Express, EJS e conexão com o MongoDB
├── seed.js                 # Popula o banco com instrumentos de teste
├── package.json            # Configurações do projeto e dependências
└── README.md               # Documentação do projeto

🚀 Como Executar o Projeto Localmente

Pré-requisitos: Node.js 18+ e MongoDB escutando em 127.0.0.1:27017.

  1. Clone o repositório:

    git clone https://gitea.tsiad.com.br/anderson/DBE-S04.git
    cd DBE-S04
    
  2. Instale as dependências:

    npm install
    
  3. Popule o banco com os instrumentos de teste (opcional):

    npm run seed
    
  4. Inicie a aplicação:

    • Modo padrão:
      npm start
      
    • Modo de desenvolvimento (watch mode):
      npm run dev
      
  5. Acesse no navegador: http://localhost:3000/instrumentos


⚙️ Configuração

As variáveis de ambiente são opcionais:

Variável Padrão
PORT 3000
MONGODB_URI mongodb://127.0.0.1:27017/loja_instrumentos

Exemplo:

MONGODB_URI="mongodb://127.0.0.1:27017/loja_instrumentos" PORT=3000 npm start

🗃️ Modelo Instrumento

Campo Tipo Regras
nome String obrigatório, até 120 caracteres
fabricante String obrigatório, até 120 caracteres
preco Number obrigatório, maior ou igual a zero
tipo String obrigatório, um dos tipos da lista

Tipos aceitos: Cordas, Percussão, Teclas, Sopro, Áudio e Acessórios.


📸 Telas

Listagem de instrumentos

Formulário de cadastro

Confirmação do cadastro

A listagem também funciona em telas pequenas (a tabela rola na horizontal): docs/listagem-mobile.png.