search

alexandrecpedro / radar-project

Projeto Radar - Angular
4 stars 7 forks source link
angular bootstrap express figma font-awesome nodejs postman scrum-agile typescript

readme

Desafio Final - Angular (Código do Futuro)

Grupo 1

Equipe

Integrante Foto Redes sociais
Alexandre da Costa Pedro
Gabriel Gualberto de Oliveira
Jonathan Oliveira Avelino
Hugo Nunes
Luís Eduardo
Silvia Helena Souza

Projeto Radar


Descrição da imagem Tela
Página de login Página de Login
Página Home Página Home
Página de cadastro de produtos Página de cadastro de produtos
Página cadastro de clientes Página cadastro de clientes
Página cadastro de pedidos dos clientes Página cadastro de pedidos dos clientes
Página de fluxo de caixa, mostrando a movimentação do mês Página de fluxo de caixa, mostrando a movimentação do mês



O Projeto • Objetivo • Tecnologias utilizadas • Desenvolvimento • Como utilizar • Agradecimentos


👨🏻‍💻 O Projeto

Nós recebemos o desafio para desenvolver um sistema chamado Radar, o qual possibilita ao lojista fazer o gerenciamento do fluxo de entrada e saída do seu negócio.

💡 Objetivo

Desenvolvimento de um sistema chamado Radar, o qual possibilita ao lojista fazer o gerenciamento do fluxo de entrada e saída do seu negócio. O sistema foi desenvolvido em Angular, com as seguintes funcionalidades:

  • Página de login
  • Página home
  • Página de cadastro de produtos
  • Página cadastro de clientes
  • Página cadastro de pedidos dos clientes
  • Página de fluxo de caixa, mostrando a movimentação do mês
Para gravação das informações, criou-se uma API em Node.js e Express, com a persistência em disco com arquivo.json. Esta API foi integrada à aplicação frontend (Angular).

🛠 Tecnologias utilizadas

As seguintes tecnologias foram utilizadas para construção do projeto:

| Descrição | Ferramenta | Referência | | :----------------------------------------------: | :-----------------------: | :-------------------------------: | | IDE | VS CODE | https://code.visualstudio.com/ | | Ferramenta de Design de Interface | FIGMA (Protótipo - UX/UI) | https://www.figma.com/ | | Linguagem de programação (Backend, Frontend) | JAVASCRIPT | https://developer.mozilla.org/en-US/docs/Web/JavaScript/ | | Linguagem de programação (Frontend) | TYPESCRIPT | https://www.typescriptlang.org/ | | API e serviços backend (Backend) | NODE.JS | https://nodejs.org/ | | Framework de aplicação web Node.js (Backend) | EXPRESS.JS | https://expressjs.com/ | | Framework JavaScript (Frontend) | ANGULAR | https://angular.io/ | | Framework de CSS (Frontend) | BOOTSTRAP | https://getbootstrap.com/ | | Biblioteca de Componentes gráficos (UX/UI) | FONT AWESOME | https://fontawesome.com/ | | Open source API (Testing) | POSTMAN | https://www.postman.com/ |

Backend | API


Testing


IDE


UX/UI


Frontend



📓 Desenvolvimento

✔️ Metodologias Ágeis:
Para ter uma melhor produtividade no desenvolvimento do projeto foi utilizado a metologia ágil Kaban. Dessa forma, para melhor organização o projeto foi fragmentado em quatro quadros, sendo:

  • Backlog: as tarefas que precisam ser cumpridas no decorrer da Sprint
  • A Fazer: as tarefas que ainda serão realizadas
  • Em andamento: as tarefas que já estão sendo desenvolvidas
  • Concluído: as tarefas que foram cumpridas

Clique aqui para visualizar os cards.

Metodologia Kanban - quadro Trello

🧪 Como utilizar

  1. Configure a IDE - Visual Studio Code
  2. Clone o repositório
    • git clone https://github.com/alexandrecpedro/radar-project.git
  3. Entre no diretório do projeto:
    • cd radar-project
  4. Testing
    • Backend
      1. Entre no diretório backend
        • cd backend
      2. Instale as dependências
        • npm install
      3. Run
        • npm run dev
    • Frontend
      1. Entre no diretório frontend
        • cd frontend
      2. Instale as dependências
        • npm install
      3. Run
        • ng serve

🤝 Agradecimentos

Agradecemos à Febrafar/Farmarcas pela oportunidade de participarmos desta bela iniciativa que é o programa de treinamento Código do Futuro, que proporciona a ampliação de conhecimentos e de qualificação na área de desenvolvimento Full Stack - Frontend e Backend (Angular, C#/DotNet).