Alura Challenge Front-end 5 - Alura Geek
Este repositório guarda a minha versão da Alura Geek, desenvolvido no Alura Challenge Front-End 5, entre 26/09 e 25/10/2022.
| :placard: Vitrine.Dev | |
| ------------- | --- |
| :sparkles: Nome | Alura Challenge Front-end 5 - Alura Geek
| :label: Tecnologias | ReactJs, CSS, JavaScript, NextJs
| :rocket: URL | https://alurachallengefrontend5-uq19.vercel.app/
<!-- Inserir imagem com a #vitrinedev ao final do link -->
Detalhes do Projeto
Decidi fazer o desafio usando ReactJs e NextJs.
-
Semana 1: Elaborar a Página Home da Alura Geek. ✅
-
Semana 2: Elaborar as páginas Login, Todos os Produtos, Adicionar Produto e Página Produto ✅
<table>
<tr>
<th>Login</th>
<th>Todos os Produtos</th>
</tr>
<tr>
<td> <img src='https://i.imgur.com/2sStaKv.png' alt='preview Login'> </td>
<td> <img src='https://i.imgur.com/xZbil86.png' alt='preview Todos os Produtos'></td>
</tr>
<tr>
<th>Adicionar Produto</th>
<th>Página do Produto</th>
</tr>
<tr>
<td><img src='https://i.imgur.com/UpxKQeT.png' alt='preview Adicionar Produto'></td>
<td><img src='https://i.imgur.com/GKtkTiH.png' alt='preview Página Produto'></td>
</tr>
</table>
- Semanas 3 e 4: Tornar o Login funcional, Usar API para listar produtos, Tornar Barra de Pesquisa Funcional, Validação do Formulário Fale Conosco, Tornar Funcional o Formulário Adicionar Produto e Tornar Funcional o Botão 'Ver Tudo'. ✅
<table>
<tr>
<th>Login Funcional</th>
<th>API para Listar Produtos</th>
</tr>
<tr>
<td><img src='https://media.giphy.com/media/foAQhQWBr0PEyEU8mv/giphy.gif' alt='login funcionando'></td>
<td><img src='https://media.giphy.com/media/68yWHfjeQCbCczOtdS/giphy.gif' alt='listar produtos com API'></td>
</tr>
<tr>
<th>Barra de Pesquisa Funcional</th>
<th>Formulário Fale Conosco</th>
</tr>
<tr>
<td><img src='https://media.giphy.com/media/FLYIMhGoYrEW8a4aHA/giphy.gif' alt='pesquisa funcional'></td>
<td><img src='https://media.giphy.com/media/SdDanoNpd8GlqEUB3S/giphy.gif' alt='formulário fale conosco'></td>
</tr>
<tr>
<th>Adicionar Produto</th>
<th>Ver Tudo</th>
</tr>
<tr>
<td><img src='https://media.giphy.com/media/1RlbjU8eHLphFy95C9/giphy.gif' alt='funcionalidade Adicionar Produto'></td>
<td><img src='https://media.giphy.com/media/1O7R7kaOcrfgr423CF/giphy.gif' alt='botao Ver Tudo'></td>
</tr>
</table>
- Extras: Adicionar funcionalidade de Excluir produto. Adicionar funcionalidade de Alterar Produto.
<table>
<tr>
<th>Excluir Produto</th>
<th>Alterar Produto</th>
</tr>
<tr>
<td><img src='https://media.giphy.com/media/VWQm8vX6EIcUCtbbfB/giphy-downsized.gif' alt='excluir produto'></td>
<td><img src='https://media.giphy.com/media/tCwuu62fvAYpWk3Ffh/giphy.gif' alt='alterar produto'></td>
</tr>
</table>
