A tela abaixo exemplifica a tela inicial do ecommerce RocketShoes usando as tecnologias alistadas nas dependências abaixo abaixo de instalações.
Esta aplicação é bem simples, porém demandou um bom tempo e atenção nas aulas para poder replicar o projeto. Porém ainda falta muitas funções que poderão ser implementas no futuro. Tais como:
- Adicionar um loading ao carregar a página
- Adicionar um loading ao adicionar um item ao ao carrinho
- Filtrar itens por: preço, mais vendidos
- Caixa de pesquisa de itens
- Página para resultados da pesquisa
- Adicionar um header para promoções
- Menus de navegação para mais funções do site, como por exemplo contato, sobre a loja, categorias...
- Adicionar um footer com menus do site e links úteis.
- Adicionar Páginas para erro, a exemplo erro 404
- Acesso restrito / login (Conta, Pedidos...)
- Adicionar campo para captura de email para newsletters
- Adicionar ferramentas internas (controles: stoque, vendas, relatórios, usuários, clientes, promoções, etc)
Como pode ver, o sistema está apenas no 5% de uma aplicação completa que poderá resultar num sistema robusto e com grandes possibilidades para atender o mercado.
- yarn add react-router-dom
- yarn add react-icons
- yarn add polished
- yarn add global json-server (ver doc: https://github.com/typicode/json-server)
- yarn add axios
- yarn add redux
- yarn add react-redux
- yarn add history
- yarn add immer
- yarn add json-server
- yarn add react-toastify
- yarn add reactotron-redux-saga
- yarn add redux-saga
- yarn add styled-components
- yarn add babel
- yarn add babel-eslint
- yarn add eslint
- yarn add prettier
- Baixe a pasta para seu computador
- Acesse a pastas do projeto
- Abra o terminal execute os comandos
-
- yarn json-server server.json -p 3333
- Agora abra outra janela do terminal (sem fechar a anterior) e execute o comando abaixo e aguarde:
-
- yarn start