-
React
-
CSS
-
React Router Dom
-
Font Awesome
-
Material UI
-
Formik
-
✅ Semana 1 - Fazer a estruturação e estilização da página principal.
-
✅ Semana 2 - Criar as páginas internas dos produtos, rotas para cada produto, criando a página de login e a página de administração de produtos.
-
✅ Semanas 3 e 4 - Validar formulários de login, enviar mensagem e adicionar produtos.
-
Acesse a página no link.
-
Na página inicial serão exibidos cabeçalho, banner principal, listas de produtos e rodapé.
-
No cabeçalho é possível buscar por produtos e realizar o login na página.
-
No banner principal há um botão "Ver consoles", que ao ser clicado, rola a tela para a seção de consoles.
-
Nas seções de produtos é possível ver cada produto por categoria com seu nome, imagem, preço e link para página do produto.
-
Há um botão ver tudo, que ao ser clicado, redirecionará a página para que todos os produtos sejam exibidos.
-
No rodapé há alguns links e um formulário de enviar mensagem, com um botão, só será possível enviar a mensagem caso os campos estejam corretamente preenchidos.
-
Nas páginas de cada produto são exibidos os detalhes do produto, como descrição, preço, imagem e abaixo há uma seção de produtos similares.
-
Na página de login há um formulário, com um botão de entrar, só será possível realizar o login com as seguintes credenciais: email: marcus.urani@gmail.com | senha: Marcus123*.
-
Ao realizar o login, será redirecionado para a página de administrador, onde são exibidos todos os produtos da loja, um botão de adicionar produto e botões de excluir e editar em cada produto.
-
Para excluir um produto basta clicar no ícone de lixeira no produto desejado e selecionar a opção "Sim" no modal que será exibido.
-
Para editar um produto basta clicar no ícone de edição no item desejado e será redirecionado para a página de edição.
-
Na página de edição é possível alterar nome do produto, preço e descrição. Após a edição, basta clicar no botão "Confirmar edição" e será redirecionado para a página de gerenciamento.
-
Na página de adicionar produto há um formulário e um input de adicionar imagem, com um botão de enviar, caso todos os campos estejam preenchidos corretamente, o produto será adicionado e o usuário será redirecionado para a página de gerenciamento.