mba-member-club

Índice

• 1. Introdução
• 2. Member Club
• 3. Funcionalidades
• 4. Ferramentas Utilizadas
• 5. Considerações Finais

1. Introdução

Aplicação Web desenvolvida durante o primeiro módulo do MBA de Full Stack da Rocketseat 🚀.

2. Member Club

O projeto consiste em desenvolver uma aplicação web responsiva de um Cartão Fidelidade.

Nesta fase do projeto o foco não é o desenvolvimento da página consimindo uma API, por isso não foi desenvolvida, e foi simulado uma API usando o json-server

O desenvolvimento foi feito pela versão do Mobile primeiro, e depois a adaptação para a web.

3. Funcionalidades

Como objetivo principal da entrega a aplicação deve conter as seguintes funcionalidades:

• Deve ser possível buscar as informações dos clientes através de um ID;
• Deve haver uma validação pra saber se é um ID válido e existente;
• Deve aparecer um alerta de erro em tela caso seja um ID inválido;

Havendo sucesso em trazer os dados de cada cliente, deveria possuir umas funcionalidades adicionais:

• Deve ser exibida na tela a imagem do(a) cliente;
• Deve ser exibido na tela o nome do(a) cliente;
• Deve ser exibido na tela o histórico de cortes com a quantidade, a data e a hora;
• Deve ter um check no cartão fidelidade para cada corte de cabelo que o(a) cliente tiver;
• Deve ser exibido na tela um progresso com o número de cortes restantes para o prêmio;
• Deve aparecer na tela um modal de parabéns com a mensagem: “Parabéns! Seu próximo corte é gratuito!” caso o cliente tenha atingido os 10 cortes;

Das funcionalidades descritas acima a unica que ficou para próxima versão foi o modal e parabéns quando o clinete atinge o número de cortes.

Abaixo os alerts de validação de ID inválido, primeiro digitando um valor menor do que esperado no campo input, e também ao informar um ID inexistente no campo.

E como ficou as versões WEB e Mobile:

4. Ferramentas Utilizadas

Para esse primeiro desafio, não era possível utilizar nenhum framework ou biblioteca para auxilio no JavaScript. Com isso para esse projeto foi utilizado somente:

• HTML
• CSS
• Conceitos Básicos de JavaScript
• Babel
• Webpack
• Json-server

5. Considerações Finais

Ao final do projeto consegui colocar em prática todo o aprendizado durante o primeiro módulo. Tive alguns desafios, mas consegui entregar o máximo que pude, e estou feliz com o que consegui entregar.

Obrigada aos Educadores dessa primeira etapa Mayk Brito e Rodrigo Gonçalves