Conheça o projeto
Neste desafio, você vai desenvolver um Gerenciador de Contatos com autenticação de usuários e proteção de dados sensíveis. As informações mais importantes, como telefone e e-mail, deverão ser criptografadas e só poderão ser visualizadas após o desbloqueio com senha, garantindo privacidade e segurança dentro da aplicação.
Recursos
Materiais para você usar como base para o desenvolvimento
Instruções
Estrutura, regras e requisitos do projeto
1. Estrutura inicial
- Crie um projeto com a estrutura base do PHP;
- Organize pastas e os arquivos criados.
2. Requisitos
Tela de login
- Crie o formulário com os campos:
- Nome;
- E-mail;
- Senha;
- Confirmação de senha
- Adicione os requisitos de senha: mínimo 8 caracteres, número ou símbolo e senhas iguais;
- Valide os campos em tempo real, mostrando erros e acertos visualmente;
- Crie o botão "Criar conta";
- Habilite o botão apenas quando todos os requisitos forem atendidos;
- Mostre mensagens de erro claras quando algo estiver incorreto.
Lista de contatos
- Renderize a tabela com colunas:
- Nome;
- Telefone,
- E-mail;
- Ícones de ações;
- Os contatos devem ser exibidos em ordem alfabética pelo nome automaticamente;
- Agrupe por letra inicial e destaque a letra ativa no momento.
- Implemente a lógica para editar um contato;
- Implemente a lógica para excluir um contato.
Adicionar contato
- Crie um botão para adicionar contato;
- Crie o formulário com os campos:
- Foto de contato;
- Nome;
- Telefone;
- E-mail.
- Valide campos obrigatórios e formatos;
- Ao salvar, insira o contato na letra correta sem recarregar a página.
Criptografia de dados
- Ao clicar no ícone de cadeado, criptografe/mascare telefone e e-mail do contato;
- Exiba dados protegidos como “********” até serem descriptografados;
- O estado deve persistir enquanto a sessão estiver ativa;
- Mostre feedback de sucesso/erro nas operações de criptografar/descriptografar.
- Implementar modal para solicitar senha antes de exibir dados quando estiverem criptografados;
- Senha incorreta não revela dados.
Pesquisa
- Implemente busca por nome;
- Se não houver resultados, mostre estado vazio.
3. Desenvolvendo o projeto
Para desenvolver esse projeto, recomendamos utilizar as principais tecnologias que utilizamos durante o desenvolvimento do primeiro módulo da formação.
Caso você tenha alguma dificuldade você pode ir no nosso fórum e deixar sua dúvida por lá!
Após terminar o desafio, caso você queira, você pode tentar dar o próximo passo e deixar a aplicação com a sua cara. Tente mudar o layout, cores, ou até adicionar novas funcionalidades para ir além! 🚀
4. Entrega
Após concluir o desafio, você deve enviar a URL do seu código no Github.
Além disso, que tal fazer um post no LinkedIn compartilhando o seu aprendizado e contando como foi a experiência? É uma excelente forma de demonstrar seus conhecimentos e atrair novas oportunidades!
Obs: Se você se sentir à vontade, pode postar um print do resultado final e nos marcar! Vai ser incrível acompanhar a sua evolução! 💜
5. Considerações finais
Lembre-se que o intuito de um desafio é te impulsionar, por isso, dependendo do desafio, pode ser que você precise ir além do que foi discutido em sala de aula. Mas isso não é algo ruim: ter autonomia para buscar informações extras é uma habilidade muito valiosa e vai ser ótimo pra você treinar ela aqui com a gente!
E lembre-se: tenha calma! Enfrentar desafios faz parte do seu processo de aprendizado!
Se precisar de alguma orientação ou suporte, estamos aqui com você! Bons estudos e boa prática! 💜
Feito com 💜 por Rocketseat 👋
1. Estrutura inicial
- Crie um projeto com a estrutura base do PHP;
- Organize pastas e os arquivos criados.
2. Requisitos
Tela de login
- Crie o formulário com os campos:
- Nome;
- E-mail;
- Senha;
- Confirmação de senha
- Adicione os requisitos de senha: mínimo 8 caracteres, número ou símbolo e senhas iguais;
- Valide os campos em tempo real, mostrando erros e acertos visualmente;
- Crie o botão "Criar conta";
- Habilite o botão apenas quando todos os requisitos forem atendidos;
- Mostre mensagens de erro claras quando algo estiver incorreto.
Lista de contatos
- Renderize a tabela com colunas:
- Nome;
- Telefone,
- E-mail;
- Ícones de ações;
- Os contatos devem ser exibidos em ordem alfabética pelo nome automaticamente;
- Agrupe por letra inicial e destaque a letra ativa no momento.
- Implemente a lógica para editar um contato;
- Implemente a lógica para excluir um contato.
Adicionar contato
- Crie um botão para adicionar contato;
- Crie o formulário com os campos:
- Foto de contato;
- Nome;
- Telefone;
- E-mail.
- Valide campos obrigatórios e formatos;
- Ao salvar, insira o contato na letra correta sem recarregar a página.
Criptografia de dados
- Ao clicar no ícone de cadeado, criptografe/mascare telefone e e-mail do contato;
- Exiba dados protegidos como “********” até serem descriptografados;
- O estado deve persistir enquanto a sessão estiver ativa;
- Mostre feedback de sucesso/erro nas operações de criptografar/descriptografar.
- Implementar modal para solicitar senha antes de exibir dados quando estiverem criptografados;
- Senha incorreta não revela dados.
Pesquisa
- Implemente busca por nome;
- Se não houver resultados, mostre estado vazio.
3. Desenvolvendo o projeto
Para desenvolver esse projeto, recomendamos utilizar as principais tecnologias que utilizamos durante o desenvolvimento do primeiro módulo da formação.
Caso você tenha alguma dificuldade você pode ir no nosso fórum e deixar sua dúvida por lá!
Após terminar o desafio, caso você queira, você pode tentar dar o próximo passo e deixar a aplicação com a sua cara. Tente mudar o layout, cores, ou até adicionar novas funcionalidades para ir além! 🚀
4. Entrega
Após concluir o desafio, você deve enviar a URL do seu código no Github.
Além disso, que tal fazer um post no LinkedIn compartilhando o seu aprendizado e contando como foi a experiência? É uma excelente forma de demonstrar seus conhecimentos e atrair novas oportunidades!
Obs: Se você se sentir à vontade, pode postar um print do resultado final e nos marcar! Vai ser incrível acompanhar a sua evolução! 💜
5. Considerações finais
Lembre-se que o intuito de um desafio é te impulsionar, por isso, dependendo do desafio, pode ser que você precise ir além do que foi discutido em sala de aula. Mas isso não é algo ruim: ter autonomia para buscar informações extras é uma habilidade muito valiosa e vai ser ótimo pra você treinar ela aqui com a gente!
E lembre-se: tenha calma! Enfrentar desafios faz parte do seu processo de aprendizado!
Se precisar de alguma orientação ou suporte, estamos aqui com você! Bons estudos e boa prática! 💜
Feito com 💜 por Rocketseat 👋
Tarefas
Use este checklist para ajudar a organizar a sua entrega