Home | Planejamento | Arquitetura Geral | Front End | Back End | Banco de Dados | Design do Sistema e Mockups | Infraestrutura e Orçamento | Fluxo e Versionamento |
---|
Arquitetura do FrontEnd
Estrutura do Projeto:
hoortech_frontend/
├── node_modules/ # Módulos e pacotes instalados via npm
├── public/ # Arquivos públicos estáticos
│ ├── favicon.ico # Ícone da aba do navegador
│ ├── index.html # Arquivo HTML principal
│ ├── logo192.png # Ícone padrão (opcional)
│ ├── logo512.png # Ícone padrão (opcional)
│ ├── manifest.json # Configurações de PWA (opcional)
│ └── robots.txt # Configurações para motores de busca
├── src/ # Código-fonte do projeto
│ ├── assets/ # Arquivos estáticos (imagens, fontes, etc.)
│ ├── components/ # Componentes React reutilizáveis
│ │ ├── camera/ # Componentes relacionados à câmera
│ │ ├── displayLayout/ # Componentes de layout de exibição
│ │ ├── header/ # Componente do cabeçalho
│ │ ├── languageDropdown/ # Dropdown para seleção de idioma
│ │ ├── modal/ # Componentes de modal
│ │ ├── primaryButton/ # Botão principal reutilizável
│ │ └── translationHistory/ # Histórico de traduções realizadas
│ ├── pages/ # Componentes de página
│ ├── services/ # Serviços para comunicação com APIs
│ ├── styles/ # Arquivos de estilização (CSS, SASS, etc.)
│ ├── tests/ # Arquivos de testes
│ ├── utils/ # Funções utilitárias e helpers
│ ├── routes.js # Configuração de rotas da aplicação
│ ├── App.js # Componente principal
│ ├── index.js # Ponto de entrada do React
│ └── ...
├── .gitignore # Arquivos a serem ignorados pelo Git
├── das # Arquivo adicional (explicação necessária se relevante)
├── DockerFile # Arquivo de configuração para Docker
├── package.json # Arquivo de configuração do npm
├── package-lock.json # Versões exatas das dependências instaladas
└── README.md # Instruções do projeto
Arquitetura do BackEnd
Estrutura do Projeto:
hoortech_backend/
├── app/
│ ├── handtracking/
│ │ └── handtracking.py # Lógica de detecção de landmarks com MediaPipe
│ ├── model/
│ │ └── model_path.h5 # Modelo TensorFlow para predição de letras
│ ├── predictor/
│ │ └── predictor.py # Classe responsável pela predição de letras
│ ├── templates/
│ │ └── index.html # Interface web para interação com o sistema
│ ├── test/
│ │ ├── integration_testing.py # Teste de integração do fluxo de predição
│ │ ├── letra-a-base64.txt # Exemplo de imagem codificada em base64
│ │ ├── letra-a.jpg # Imagem de teste da letra "A"
│ │ ├── routes.py # Rotas da API Flask
│ │ ├── create_mock_model.py # Script para gerar um modelo mock de TensorFlow
│ │ └── socket_server.py # Inicialização do servidor Flask-SocketIO
├── instance/
│ └── config.py # Configuração específica de ambiente
├── models/
│ └── hand_landmarker.task # Arquivo de modelo auxiliar
├── requirements.txt # Dependências do projeto
├── generate_base64.py # Script para gerar base64 de uma imagem
├── README.md # Documentação do projeto
├── Dockerfile # Configuração do Docker para deploy
└── run.py # Ponto de entrada do servidor Flask
Scripts Disponíveis No diretório do projeto, você pode executar os seguintes comandos:
-
python -m venv venv
: Cria o ambiente virtual (Windows) -
.\venv\Scripts\activate
: Ativa o ambiente virtual (windows) -
python3 -m venv venv
: Cria o ambiente virtual (Linux/MacOS) -
source venv/bin/activate
: Ativa o ambiente virtual (Linux/MacOS) -
pip install --no-cache-dir -r requirements.txt
: Instala as Dependências -
python -m app.socket_server
: Executa o Servidor