@MediaPost :: Desenvolvedor Front-end

Sobre a vaga
- Possuímos uma vaga para atuar na criação de interfaces (HTML, CSS e JavaScript) de um novo produto de marketing digital de nossa empresa.
- Você irá acompanhar a equipe de design na definição como serão essas interfaces e montar uma estratégia fluída de UX.
- Além da camada de layout, você também precisará efetuar a comunicação com a API desenvolvida pela equipe de back-end.
- Por ser um novo sistema, você terá a liberdade de influenciar na escolha das tecnologias que serão envolvidas.
Sobre o teste
- Antes de começar o desenvolvimento, leia todas as etapas do processo para evitar retrabalho
- Além da funcionalidade do sistema, iremos avaliar também a parte estética do layout e a legibilidade dos códigos
- Não utilize plugins para fazer o trabalho pesado: crie tudo que precisar. Mas você pode utilizar bibliotecas JavaScript (por exemplo, jQuery) para auxiliá-lo.

Se preocupe em prover a melhor experiência possível para o usuário ao criar as funcionalidades de seu sistema.

Utilize algum framework CSS para criar um relatório de contatos
Esse relatório precisa possuir as colunas ID e Nome e as ações: Visualizar, Editar e Excluir
- A ação Visualizar deve abrir um modal com os detalhes do contato
- A ação Editar deve abrir um modal com os detalhes do contato editáveis e com um botão Salvar
- A ação Excluir deve confirmar a ação com o usuário antes de excluir
Crie um botão Cadastrar para criar um novo contato com nome, ao menos um email e ao menos um telefone

Atenção

Antes de realizar as requisições abaixo, é preciso gerar um token de acesso. Para isso, é preciso efetuar uma requisição POST para a URL

https://www.mediapost.com.br/vagas/dev-frontend/api/token

Agora, basta enviar esse token em todas as chamadas em um parâmetro token.

Ao invés de exibir os dados do relatório diretamente no HTML, faça uma requisição AJAX do tipo GET para a URL
```
https://www.mediapost.com.br/vagas/dev-frontend/api/listar
```
Ao invés de exibir os dados do contato nos modais de Visualizar e Editar diretamente no HTML, faça uma requisição AJAX do tipo GET para a URL a seguir, informando um parâmetro id com o ID do contato
```
https://www.mediapost.com.br/vagas/dev-frontend/api/detalhes
```
Para criar um contato, faça uma requisição AJAX do tipo POST para a URL
```
https://www.mediapost.com.br/vagas/dev-frontend/api/salvar
```
PS: os campos a serem postados são os mesmos retornados na URL de detalhes acima (inclusive as formatações de telefone), menos o campo id.
Para editar um contato, faça uma requisição AJAX do tipo POST para a URL
```
https://www.mediapost.com.br/vagas/dev-frontend/api/salvar
```
PS: os campos a serem postados são os mesmos retornados na URL de detalhes acima (inclusive as formatações de telefone), inclusive o campo id.
Para excluir um contato, faça uma requisição AJAX do tipo DELETE para a URL
```
https://www.mediapost.com.br/vagas/dev-frontend/api/excluir?id=ID-DO-CONTATO
```
Cada recurso retorna um objeto JSON. Você deve processá-lo e avisar de forma amigável se houve erro ou não na operação.

Altere seu sistema para criar um sistema de paginação para o relatório de contatos
Para consumir a paginação da URL de listagem, basta informar um parâmetro page

Exerça sua criatividade e implemente alguma funcionalidade nova nesse mini-sistema. Surpreenda-nos!