Bem-vindo ao nosso projeto de Marketplace desenvolvido em Angular! Este projeto tem como objetivo consolidar o aprendizado dos conceitos de Angular através da construção de uma aplicação prática e funcional.
O Marketplace é uma plataforma que permite aos usuários visualizar, buscar e comprar produtos variados. A aplicação é estruturada de forma a proporcionar uma experiência de usuário intuitiva e eficiente, utilizando as melhores práticas de desenvolvimento em Angular.
-
Página Inicial
- Cabeçalho: Inclui logo, barra de pesquisa e opções de navegação.
- Banner com Carrossel: Apresenta as ofertas atuais do site.
- Seções de Produtos:
- Mais Vendidos da Semana
- Ofertas do Dia
- Rodapé: Contém links úteis e informações da empresa.
-
Busca de Produtos
- Campo de busca no cabeçalho para facilitar a pesquisa de produtos.
- Exibição de resultados de busca em forma de cartões de produtos.
- Mensagens de feedback caso nenhum produto seja encontrado.
-
Detalhes do Produto
- Exibição detalhada de cada produto, incluindo imagens, descrição, preço e comentários de clientes.
- Opção para adicionar produtos ao carrinho.
-
Carrinho de Compras
- Listagem de produtos adicionados ao carrinho com opções para ajustar quantidades e remover itens.
- Resumo da compra com total dos produtos, valor do frete e valor final.
- Botão de finalizar compra (sem ação).
- Angular: Framework principal para desenvolvimento da aplicação.
- HTML5 & CSS3: Estrutura e estilização das páginas.
- TypeScript: Linguagem de programação utilizada no desenvolvimento do Angular.
- NgPrime: Framework de CSS para design responsivo.
O código do projeto está organizado em componentes statless, seguindo as práticas de desenvolvimento em Angular apresentados no curso do Floripa Mais Tech:
- Componentes: Uso de componentes reutilizáveis para construção das interfaces de usuário.
- Serviços: Implementação de serviços para gerenciamento de dados e lógica de negócios.
- Rotas: Configuração de rotas para navegação entre as diferentes páginas da aplicação.
- Database: Objetos Mock dos dados utilizado nas interfaces do usuario
Este projeto foi desenvolvido em colaboração com uma equipe dedicada de desenvolvedores. Cada membro teve uma participação ativa na construção das funcionalidades e na resolução de problemas. A divisão de tarefas foi feita de forma a garantir a participação de todos, promovendo um ambiente de aprendizado colaborativo.
Equipe de Desenvolvimento:
Agradecemos a todos os colaboradores pelo empenho e dedicação.
Para executar o projeto localmente, siga os seguintes passos:
-
Clone o repositório:
git clone https://github.com/leandroCodeDev/E-commerce.git
-
Navegue até o diretório do projeto:
cd E-commerce
-
Instale as dependências:
npm install
-
Execute o json-server de desenvolvimento:
npm run db
-
Execute o servidor de desenvolvimento:
npm run start
-
Abra o navegador e acesse:
http://localhost:4200
O projeto de Marketplace em Angular é uma excelente oportunidade para aplicar na prática os conhecimentos adquiridos em sala de aula. Esperamos que este projeto não apenas reforce seu entendimento sobre Angular, mas também inspire novas ideias e projetos futuros.
Agradecemos a todos os colaboradores pelo empenho e dedicação. Bom trabalho e divirtam-se!