Em que posso melhorar (No meu site MeloMarket) minha aplicação em React ?
Olá Pessoal do TabNews, tudo bem com vocês ? Quero apresentar à vocês meu site MeloMarket contruido em ReactJS.
- O Site:
O site contruido em ReactJS, é um simples site de mercado que consiste em foco um sistema de carrinho onde eu escolho um produto adiciono no carrinho, coloco o endereço de entrega do produto e em seguida seleciono a forma de pagamento.
- Desafio:
Mexer primeira vez com o ReactJS.
- Código e site:
Repositório do GitHub: https://github.com/Lmelo0511/MeloMarket Site: https://melo-market.vercel.app/
- Dicas:
Gostaria de uma dicas de vocês onde eu poderia melhorar o site. também adoraria umas dicas de vocês sobre novos projetos para pratica de Front-End.
Opá! Para quem mecheu pela primeira vez estás de parabéns, a título de exemplo eu tentei usar o django não foi fácil irmão. Pode ser que ajuda, as vezes conseguimos um resultado melhor criando ou buscando um design na intenet e lutar para programá-lo, isso claro depois de pegar as bases da tecnologia. Abraços
Algumas coisas que eu acho que poderiam melhorar seria: 1 - Trocar o nome e foto padrão da guia; 2 - Não colocar um texto na frente de uma imagem, ou colocar um text shadow ou algo com cor sólida atrás do texto (como um retângulo); 3 - Busque paletas que contrastem mais com o fundo; 4 - Escolha uma fonte sem ser a padrão (como no site DaFont); 5 - Faça alguma separação para o seu rodapé (footer); 6 - Com relação ao menu, tente fazer com que, quando ele abra, não empurre tudo para a direita; 7 - Tente deixar o cursor: pointer; do menu apenas nos itens do menu, não no container inteiro (da de perceber que está no container inteiro quando o menu é aberto); Mas claro, são apenas ideias, de qualquer forma, adorei o site! :)
Dicas para melhorar o frontend:
1 - Coloque um favicon referente ao seu site.
2 - Não coloque um texto sobre uma imagem.
3 - Coloque diferentes "weights" para referenciar relevância, do mais pesado para o mais relevante, no caso o título.
4 - Busque variar fontes.
5 - Evite usar fontes com sans serif em sites.
6 - Pesquise paleta de cores prontas para a sua aplicação.
7 - Coloque cores com contraste entre o fundo e o texto.
8 - Remova os cookies do seu site, eles não tem o porque existir.
Próximos projetos: 1 - Menu responsivo. 2 - Modal.
1 - feedback visual ao adicionar ao carrinho 2 - na numeração do carrinho ao ser adicionado,coloque em torno de um circulo e mude a cor do texto, algo nesse sentido, pois tudo preto fica dificil distinguir e ate reparar se está adicionando. 3 - na pagina do carrinho deixa fixado no top do abaixo de "Seu Carrinho" os items que de fato adicionei, pois tenho que descer e subir, feedback visual rapido tlgd, tenta montar uma tela com apenas 2 scroll, da pra simplificar melhor essa tela, é uma tela muito importante, quanto mais facilitar a vida melhor, pode separar em 2 coluna, itens, formulario e la embaixo comprar
recomendo ver checkouts de outros sites