Git Product home page Git Product logo

ignaciochemes / realtime_dashboard_socketio Goto Github PK

View Code? Open in Web Editor NEW

This project forked from vhnegrisoli/realtime_dashboard_socketio

0.0 0.0 0.0 7.26 MB

Criação de um dashboard em tempo real utilizando Node.js, Express.js, Socket.io, MongoDB, Chart.js, HTML e MateralizeCSS

Home Page: https://socketio-dashboard-realtime.herokuapp.com

License: MIT License

JavaScript 31.64% Dockerfile 0.10% CSS 0.07% Handlebars 68.20%

realtime_dashboard_socketio's Introduction

Projeto: Dashboard em Real-Time 💹

Tecnologias

Objetivos ✅

Este projeto tem como objetivo colocar em prática meus conhecimentos de desenvolvimento back-end e Node.js na criação de um dashboard em tempo real baseado em operações de CRUD relacionadas a lançamento de vendas.

O usuário terá a possibilidade de registra seus produtos, quais são suas categorias e fornecedores, e em seguida registrar quais foram as vendas destes produtos, e a cada venda lançada, o dashboard principal será atualizado em tempo real conforme cada venda é lançada.

Motivação 🎆

Minha motivação foi de juntar meus conhecimentos em desenvolvimento back-end e front-end com a análise de dados, unindo as duas áreas na tentativa de entregar uma ferramenta que corresponde ao objetivo de muitos gestores e tomadores de decisão: saber o que está acontecendo na hora, em tempo real!

Demonstração da Dashboard

Tecnologias 💻

  • Javascript ES6
  • Node.js
  • Express.js
  • Socket.io
  • MongoDB
  • Handlebars
  • Arquitetura de API REST e MVC
  • HTML
  • Materialize CSS
  • Chart.js
  • Docker
  • Docker-compose
  • Heroku (Deployment)

Instalação 💾

Instalação local

Para instalar o projeto, execute o comando:

yarn

Para rodar localmente, será necessário ter uma instância do MongoDB rodando em seu ambiente na porta 27017.

Execução 📀

Executando local

Para executar o projeto, rode o comando:

yarn start

Instalação e execução via docker-compose

Para instalar via docker-compose, basta apenas executar o comando:

docker-compose up -d

Para parar os containers, apenas execute o comando:

docker-compose stop

O projeto estará disponível no endereço: http://localhost:8080.

Deployment ⭐💥👍👊

Foi feito o deploy do projeto na plataforma Heroku, e pode ser acessado na URL abaixo:

https://socketio-dashboard-realtime.herokuapp.com

Demonstração 🖥️

No GIF abaixo, podemos ver a dashboard atualizando conforme são feitas as vendas. É possível também reiniciar os dados da aplicação clicando no botão Reiniciar dados, logo no menu.

As funcionalidades são de visualizar o dashboard, lançar vendas, cadastrar e listar produtos, fornecedores e categorias.

Demonstração Dashboard API Call

Imagens do dashboard feito com Materialize CSS e Chart.js 💹

Cards (KPIs) de totais vendas finalizadas, abertas, aprovadas e rejeitadas, e gráfico com análise de vendas mensais

Dash 1

Análise de vendas mensais por valor total de venda, total de vendas por produtos e fornecedores

Dash 2

Análise de vendas por aprovações (ABERTA, FECHADA), por situações (APROVADA, REJEITADA e AGUARDANDO_APROVACAO) e vendas por produtos

Dash 3

Autor 🤓

Victor Hugo Negrisoli

Desenvolvedor Full-Stack Pleno & Analista de Dados

realtime_dashboard_socketio's People

Contributors

vhnegrisoli avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.