Inhaltsverzeichnis:
- Schritt 1: Configurando O Ambiente
- Schritt 2: WebSocket
- Schritt 3: Escrevendo O Servidor
- Schritt 4: Testando O Servidor
- Schritt 5: Ein Aplicação Mobile
Video: Pequeno Projeto De Uma Casa Inteligente - Gunook
2024 Autor: John Day | [email protected]. Zuletzt bearbeitet: 2024-01-30 07:15
O projeto que faremos é de uma casa inteligente. Grundlegende Grundfunktionen der Funktionsgruppen: · Beleuchtungs- und Temperaturüberwachung.
· Die Überwachung der Nahrungsmittelliste und der nível de água filtrada na geladeira.
Escreveremos os Firmwares dos dispositivos IoT da geladeira nem dos comodos; porém assumiremos que os dispositivos fazem o seguinte:
- Eine geladeira possui um dispositivo com touchscreen em que é possível entrar com dados de alimentos: o nome de um alimento e sua quantidade;
- Ein geladeira possui um sensor de nível em um pequeno tanque de água embutido na geladeira;
- Os comodos têm termômetros e sensores de iluminância;
- Os comodos têm ar condicionado que se comunicam pela rede wifi;
- Als Lâmpadas dos cômodos podem ter o brilho ajustado por dispositivo que se comunica pela rede wifi;
Voraussetzungen:
- Conhecimento básico em Python, Javascript, uso do sistema operacional, comandos básicos keine Shell
- Ter instalado: nodejs, python
- Ter instalado (opcional): docker, emulador de dispositivo mobile, gerenciador de sdk do Android (disponível no Android Studio)
O desenvolvimento desse projeto foi feito no Linux. Podem ser necessárias adaptações para que seja feito no Windows.
Schritt 1: Configurando O Ambiente
Vamos konfigurierbar oder ambiente de desenvolvimento em 2 partes: server und mobile. O servidor será escrito em python und o mobile em Javascript oder typescript, sendo utilizado React Native para o projeto.
reactnative.dev/
Vamos inicialmente criar uma estrutura de Pastas. Em um diretório escolhido (que a partir de agora será escrito sempre como $PROJECT_DIR como placeholder - crie com no local que achar mais adequado e com o nome de sua Preferredência), vamos criar uma Pasta "servidor":
$ mkdir $PROJECT_DIR && cd $PROJECT_DIR
$ mkdir-Server
CONFIGURANDO O AMBIENTE DE DESENVOLVIMENTO PARA O SERVIDOR
Podemos utilizar um ambiente conteinerizado com Docker oder ambiente virtuelle Python (venv). Caso deseje utilizar ambiente conteinerizado, criaremos a imagem segundo or dockerfile:
$ cd $PROJECT_DIR
$ touch dockerfile
Veja imagem do dockerfile.
Caso prefira utilizar ambiente virtual do python, siga as instruções em
Vamos então criar o arquivo que persistirá a lista de dependências do servidor e colocar as dependências necessárias:
$ touch anforderungen.txt
Veja imagem tun Requirements.txt.
Caso tenha optado por utilizar um ambiente conteinerizado, construa a imagem e entre no container:
$ Docker-Build. -t smarthouse $ docker run -it -p 3000:3000 -v $(pwd):/app smarthouse bash
Weitere Informationen zu dockerfile und cli do docker:
CONFIGURANDO O AMBIENTE DE DESENVOLVIMENTO MOBILE
Um passo a passo de como configurar o ambiente de desenvolvimento mobile com React Native pode ser visto no link:
Após ter o ambiente configurado, na Pasta do projeto deve ser possível executar oder comando para criar aplicação mobile:
$ npx create-react-native-app client
Schritt 2: WebSocket
É interessante que o leitor conheça pelo menos um pouco a respeito de websocket antes de prosseguir. Caso o leitor nunca tenha lido, trabalhado ou ouvido falar nada a respeito, separate Alguns minutos para entender como funciona o websocket através da documentação:
developer.mozilla.org/pt-BR/docs/WebSocket…
Usaremos uma biblioteca no cliente e no servidor que abstrai o protocolo de maneira que não präzisemos pensar em detalhes de chamada e de armazenamento de identificadores e rotas. Separe também um tempo para estudar as bibliotecas utilizados no cliente e no servidor:
Kunde:
Anbieter:
Schritt 3: Escrevendo O Servidor
Vamos criar uma estrutura inicial do projeto e escrever a interface que será utilizada como comunicação com o servidor:
$ mkdir src
$ touch app.py src/{controller, socketconnection}.py
Primeiramente vamos escrever um módulo de inicalização do servidor:
Veja imagem do app.py
Depois vamos escrever oder módulo que estabelece as conexões via websocket und als redirecionam para um controlador.
Veja imagem tun socketconnection.py
VERWENDUNGSFÄLLE FÜR CONTROLLER E
O controlador receberá um pacote do módulo responsável por estabelecer e gerenciar as conexões; Será responsabilidade do controlador sabre qual função de caso de uso chamar para cada envento recebido, bem como a partir de resposta do caso de uso enviar um pacote de resposta para a Salar de dispositivos conectados para atualização the informações.
Veja imagem do controller.py.
Finalmente temos os casos de uso que devem gerenciar como deve ser tratado os dados do evento recebido und criar os novos dados a partir do dados recebidos para que o controlador atualize oder estado do sistema. No caso desse sistema há somente atualização de valores (sejam numéricos, texto ou booleanos - no caso de ligar/desligar dispositivos de ambientação). Então não é de surpreender que os casos de uso tão chame funções do módulo responsável pela persistência de dados como se fosse essa a "regra de negócio".
Veja imagem do usecases.py
Anmerkung: precisamos persistir os dados de alguma forma. Fica a escolha do leitor como bevorzugt armazenar os dados e portanto, implementar als funções do src/repository.py. Kein Projekt desenvolvido como exemplo foi persistido em um arquivo json no diretório database. Kein Repository für das Projekt und die Möglichkeit zur Überprüfung um einen Pasta-Server / eine Datenbank, um ein Archiv von os dados zu speichern, um ein Archiv für ein Modell auf einem Server / einem Datenbankmodell.
Schritt 4: Testando O Servidor
Podemos crar um script para conectar ao servidor and enviar eventos conforme a estrutura pelos controladores para fins de testes manuais. Vamos crar esse script und rodá-lo com o servidor*.
Veja imagem do serverclient.py
Com o arquivo criado, verifique se o container está rodando, e dentro dele execute:
$ python app.py
Fora do container, no diretório $PROJECT_DIR/server ausführen:
$ python3 serverclient.py
Keine Eingabeaufforderung "> " digite os eventos encontrados no controlador seguido de ";" e então valores de identificação e/ou novos valores. Für Beispiel:
UPDATE_FRIDGE_WATER_LEVEL;80
UPDATE_ROOM_TEMPERATURE;1, 22.0
UPDATE_ROOM_TEMPERATURE_SETPOINT;1, 17,5
UPDATE_ROOM_LUMINOSITY;100
UPDATE_ROOM_LUMINOSITY_SETPOINT;0
TOGGLE_ROOM_TEMPERATURE;1
TOGGLE_ROOM_LIGHT;1
E para cada evento enviado verifique se foi persistido no banco de dados escolhido.
Anmerkung: Verifique que a porta que está sendo servido a aplicação, a porta exposta no docker run e a porta do script de teste devem ser a mesma.
Schritt 5: Ein Aplicação Mobile
Não será demonstrado com muitos detalhes cada parte do desenvolvimento do cliente mobile. Não será explizitado aqui cada importação no módulo Principal criado pelo React Native nem possíveis detalhes de configuração. Para começar, navegue até $PROJECT_DIR/client und adicione a dependência que precisaremos para o projeto:
$ npm i socket.io
Em seguida vamos escrever os Componentes gráficos e as funções que irão se comunicar com o servidor.
ESCREVENDO A TELA
Em App.js, vamos Escrever os Komponenten der GUI.
⚠ Hinweis que a função chamada pelo useEffect ainda não foi escrita! Keine Eingabeaufforderungen für die Reduzierungen setDataReducer, setFoodReducer, setTemperatureReducer, setLightReducer und weitere Schriften für die anfänglichen Objekte INITIAL_STATE, INITIAL_FOOD_MODAL, INITIAL_TEMPERATURE_MODAL, INITIAL _⚠LIGHT_MODIAL
Também ainda não foram escritas as funções utilizadas pelos elementos de interface gráfica para fazer chamadas para escrita no servidor: saveNewFoodValue, saveNewTemperature, saveNewLuminosity, toggleTemperatureForRoom, toggleLightForRoom
Portanto, se desejar testar os elementos com dados falsos, escreva cada objeto e função dito acima.
Veja imagem do App.js com código da parte GUI
Es ist für Benutzer erforderlich, die für eine Kommunikation mit einem Server und für Benutzerfunktionen mit mehreren GUI-Komponenten erforderlich sind.
Veja imagem do App.js com código da parte lógica/operacional
Empfohlen:
Carro Inteligente(: 4 Schritte (mit Bildern)
Carro Inteligente(: Este carro inteligente es el resultado de un proyecto transversal de la asignatura de computación física, que busca encontrar nuevas maneras de enseñanza usando las nuevas tecnologniacute m