Skip to content

Teste técnico para uma vaga de desenvolvedor front-end

Notifications You must be signed in to change notification settings

GabrielMA0/CineStream

Repository files navigation

🎬 CineStream

CineStream é uma aplicação web destinada a gerenciar filmes de uma locadora.

🚀 Tecnologias Utilizadas

  • Vue 3: Framework JavaScript
  • Vue Router: Gerenciamento de rotas
  • Pinia: Gerenciamento de estado
  • Pinia Persisted State Plugin: Plugin para persistência do estado do Pinia
  • Tailwind CSS: Framework CSS
  • Vee Validate: Biblioteca para validação de formulários
  • Yup: Esquemas para validação de objetos, usado junto com Vee Validate
  • Vue The Mask: Máscaras para campos de formulário
  • UUID: Geração de identificadores únicos universais
  • Vite: Build tool
  • TypeScript: Superset do JavaScript com tipagem estática

🔧 Instalação

Para rodar o projeto localmente, siga os passos abaixo:

  1. Clone o repositório:

    git clone https://github.com/GabrielMA0/CineStream.git
    cd CineStream
    
  2. Instale as dependências:

    npm install
    
  3. Inicie o servidor de desenvolvimento:

    npm run dev
    

🔐 Login Inicial

Para acessar o sistema pela primeira vez, utilize a conta administrativa padrão com as seguintes credenciais:

  • Documento (CPF): 457.219.030-58
  • Senha: admin

⚙️ Funcionalidades

Usuário

  • Cadastro, edição, listagem e desativação (soft delete)
  • Login e logout
  • Usuários com status inativo não podem logar
  • Usuários logados permanecem logados ao revisitar a aplicação

Clientes

  • Cadastro, edição, listagem e desativação (soft delete)
  • Busca por nome e documento
  • Filtro por status ativo/inativo
  • Busca automática dos dados de endereço pelo CEP via API ViaCEP, permitindo edição caso não encontre o CEP

Filmes

  • Consumo da API da OMDb para listagem de filmes
  • Busca por nome (OBS: Pesquisar em inglês)
  • Filtros por ano
  • Lista apenas filmes

Locação

  • Nova locação e listagem de locações
  • Busca por cliente
  • Filtros por data de locação e data de entrega
  • Clientes com locação em status "alugado" não podem realizar nova locação

Requisitos gerais

  • Feedback visual (alert toggle) para sucesso ou falha em todas as alterações
  • Dados de usuários, clientes e locações armazenados no localStorage do navegador

🚧 Deploy

Vercel:

🎨 Design

O design do CineStream foi elaborado no Figma para garantir uma interface moderna e responsiva.

Link: https://www.figma.com/design/UChY9CelPZiPwtYeUkcpoe/Teste-t%C3%A9cnico---CineStream?node-id=0-1&t=BHZjHkUopjAJoABW-1

About

Teste técnico para uma vaga de desenvolvedor front-end

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages