Por meio da programação, fazemos com que as máquinas imitem um comportamento complexo, seguindo sequências de instruções simples. Usar linguagens de programação textual como Asambly, C, Python e JavaScript é uma das principais maneiras de fazer isso. Os designers dessas linguagens de programação passaram horas e horas tentando tornar a experiência do programa de escrita o mais fácil possível por meio de sintaxe expressiva, construções de programação fortes e cadeias de ferramentas poderosas. No entanto, todas essas linguagens de programação compartilham uma característica comum: o código-fonte textual.
Escrever programas em texto funciona e, na maioria dos casos, funciona bem. No entanto, a capacidade de expressar programas visualmente geralmente é desejável. Ser capaz de projetar o fluxo de informações por meio de vários componentes de um sistema maior geralmente é tudo o que é necessário. As ferramentas de programação visual também perdoam quem é novo em programação e acha difícil lidar com vários conceitos, como variáveis, indicadores, sinais, escopos e assim por diante.
Node-RED é uma ferramenta de programação visual. Ele exibe relações e funções visualmente e permite ao usuário programar sem ter que digitar um idioma. Node-RED é um editor de fluxo baseado em navegador onde você pode adicionar ou remover nós e conectá-los uns aos outros para que se comuniquem entre si.
No Node-RED, cada nó é um dos seguintes tipos: a nó de injeção ou um nó de função . Os nós de injeção produzem uma mensagem sem a necessidade de entrada e lançam a mensagem para o próximo nó conectado a ele. Os nós de função, por outro lado, têm uma entrada e fazem algum trabalho nela. Com um grande número desses nós para escolher, o Node-Red torna a conexão de dispositivos de hardware, APIs e serviços online mais fácil do que nunca.
O Node-Red é baseado em Node.js. Para instalar o Node-Red, você precisa ter ambos Node.js instalado como NPM. Com o NPM, é muito fácil instalar o Node-Red: npm install -g node-red
O editor de fluxo Node-Red é um aplicativo baseado em navegador da web. Para usá-lo, execute o Node-Red:
npm install -g node-red
O editor de fluxo do Node-RED é um aplicativo baseado em navegador da web. Para poder usá-lo, execute o Node-RED:
node-red
& hellip e vá para http: // localhost: 1880.
Qual tutorial de programação para iniciantes está completo sem aprender a dizer “Olá, mundo”? Vamos começar testando exatamente isso:
Tente. Você verá algo assim:
Com o Node-Red, você não se limita a nós e funcionalidades simples. Uma vez que o Node-Red é construído em cima do Node.js, tudo é alimentado por JavaScript . Os nós são, na verdade, módulos Node.js. Pode ser encontrado em http://flows.nodered.org/ e, para adicioná-los ao painel esquerdo, você pode simplesmente 'instalar com NPM'. Na verdade, você pode desenvolver seu próprio fluxo e carregá-los no repositório de fluxo. Os aplicativos podem ser tão complexos quanto você quiser, já que você pode escrever JavaScript em nós de função dentro do editor de código fornecido pelo Node-Red.
Como a plataforma é baseada em Node.js, ela aproveita as vantagens do mesmo modelo orientado a eventos sem bloqueio. Portanto, um aplicativo criado no Node-Red pode ser executado em um hardware de baixo custo como o Raspberry Pi, bem como na nuvem.
Para demonstrar como o Node-Red se encaixa no reino da Internet das Coisas, vamos construir um aplicativo para alterar a cor de uma lâmpada inteligente. Nem todos podem ter o mesmo sistema de iluminação inteligente à sua disposição, mas não há nada com que se preocupar, pois o módulo Node-Red apropriado pode ser encontrado no repositório oficial de fluxo. No entanto, para tornar as coisas ainda mais fáceis, optamos por algo mais inteligente.
Deixe-me apresentá-lo ao Netbeast. É uma plataforma de código aberto para o desenvolvimento de aplicativos para dispositivos e dispositivos da Internet das Coisas sem ter que se preocupar com detalhes como protocolos wireless, compatibilidade de marca ou ter que saber como lidar com cada API específica existente. Isso nos permite usar dispositivos virtuais que funcionam como reais! Portanto, mesmo que você não tenha uma lâmpada inteligente, você tem uma virtual disponível.
Podemos instalar o pacote NPM de Netbeast para Node-Red globalmente assim:
npm install -g node-red-contrib-netbeast
o nó netbeast-red renderizará o painel de controle do Netbeast, que traduzirá seus primitivos de API para todos os dispositivos inteligentes que você tiver em casa. Felizmente, também está disponível como módulo!
Inicia Netbeast:
npm install -g netbeast-cli netbeast start
Isso tornará o painel disponível na porta 8000 e SSL em 8443. Em seguida, abra o navegador em http: // localhost: 8000 e navegue até Explorar. Lá podemos encontrar muitos aplicativos e plug-ins. Procure as marcas de suas lâmpadas inteligentes (Philips Hue, LIFX, Wemo) ou se você não tiver uma, tente baixar o plugin de lâmpada. Verifique se os plug-ins do painel contêm um desses!
como encontrar o número do cartão de crédito online
O emblema amarelo indica que os plug-ins estão em execução, mas não foi possível encontrar nenhum dispositivo. Clique no plugin da lâmpada para criar uma lâmpada virtual. Qualquer outro dispositivo descoberto deve aparecer na rede.
Com tudo pronto, vamos voltar ao trabalho. Faremos um fluxo simples:
Agora vamos enviar uma solicitação HTTP ao painel de controle. Ao usar a API Netbeast, um JSON contendo os valores que queremos ativar em nossa lâmpada deverá ser enviado através do nó de injeção.
Pressione o botão para injetar cor e energia em todas as suas lâmpadas inteligentes!
Cada tema representa um tipo diferente de dispositivo. Portanto, há temas não apenas para as luzes, mas também para a música, o aquecimento e o vídeo; bem como sensores de umidade, presença, temperatura e a lista continua. Você pode encontrar em sua documentação uma lista de temas e sua estrutura recomendada para serem traduzidos para todos os tipos de dispositivos. Este motor IO é novato, mas poderoso. Um código aberto que permite aos desenvolvedores reutilizar informações para criar cenários verdadeiramente conectados e, portanto, inteligentes.
A seguir, vamos criar um segundo fluxo usando outro plugin, um detector de ruído ambiente para usar como iniciador para mudar a cor da lâmpada como um semáforo de ruído. Neste tutorial vamos usar um virtual, portanto não há necessidade de comprar novo hardware. Vamos começar clicando no botão 'mais' no editor Node-Red.
Volte ao painel http: // localhost: 8000 / explore para a seção Explorar e procure Volume-Plugin. Este é um aplicativo da web muito rudimentar que tira proveito de getUserMedia()
dentro do navegador para capturar informações multimídia de um aplicativo HTML simples. Portanto, provavelmente só funcionará em navegadores modernos.
Clique nele para abrir, assim como na lâmpada virtual. Ele pede permissão para gravar do microfone. Em seguida, ele enviará as mensagens para o corretor Netbeast MQTT, que será compartilhado em todo o painel de controle, para que possamos fazer a assinatura. Para conseguir isso, só precisamos arrastar e soltar um nó de netbeast-trigger no editor de nó vermelho. A seguir, vamos inserir uma função entre o gatilho e o nó do Netbeast, para decidir quando está muito alto e quando não está. Além disso, devemos usar alguns nós de depuração para verificar se está tudo bem. O esquema agora será mais ou menos assim:
Agora, vamos colocar algum código no nó de função tooLoud. Sim, sei que prometi que você poderia programar sem codificação, mas já mostrei que você pode! E você pode tentar combinar os diferentes itens disponíveis ou outros nós de registro para realizar o seguinte.
var volume = msg.payload.volume node.log(volume) if (volume <50) { return { topic: 'lights', payload: { power: 1, color: '#00CC00'}} } else if (volume < 75) { return { topic: 'lights', payload: { power: 1, color: '#CCCC00'}} } else { return { topic: 'lights', payload: { power: 1, color: '#FF0000'}} }
Este trecho de código bastante simples está retornando uma das três cargas úteis para o próximo nó com um código de cor específico, dependendo do nível de volume relatado pelo nó anterior.
Agora estamos prontos para continuar! Vamos apertar o botão Deploy novamente e gritar. Vamos ver como a lâmpada muda de uma cor para outra imediatamente!
Como o microfone e o navegador da web que você está usando podem ser diferentes, fique à vontade para ajustar os valores e limites da função e também brincar com os valores das cores para ver como as lâmpadas mudam.
Esta lâmpada CSS pura foi inspirada nesta cssdeck .
Como você deve ter notado, a lâmpada virtual acima é muito rudimentar, então você pode querer modificá-la. Ou melhor ainda, você pode criar seus próprios controladores domésticos inteligentes. Então, vamos passar pelo processo de criação de um plugin virtual para o Netbeast, que permitirá que você crie seus próprios controles para dispositivos inteligentes.
problemas e soluções de segurança cibernética
Você pode usar o pacote netbeast-cli
para gerar alguns códigos como por mágica. Executando netbeast create myplugin --plugin
teríamos um projeto básico como o seguinte:
myplugin ├── README.md ├── index.js ├── package.json └── test.js
Agora, vamos começar a imitar a lâmpada com um frontend. Os drivers de dispositivo geralmente não terão um, então o comando scaffold não inclui uma pasta público ainda. Vamos criar um diretório public
dentro do projeto e coloque os seguintes arquivos HTML, CSS e JS lá.
Netbeast Bulb Plugin beast ( 'lights' ). set ({ color : '' , power : '' })
RUN
section { float: left; padding: 20px 50px 20px 50px; } .bulb-light { border: 0; background: transparent; margin: 0 auto !important; padding: 0 !important; display: block; z-index: 1; } #bulb { opacity: 1; z-index: 3; display: block;} .bulb.top { border: 0; width: 300px; height: 300px; margin: 0 auto; padding: 0; border-radius: 999px; background: #E7E7E7; } .bulb.middle-1 { margin: -75px auto 0 auto; width: 190px; border-left: 35px solid transparent; border-right: 35px solid transparent; border-top: 55px solid #E7E7E7; } .bulb.middle-2 { margin: -22px auto 0 auto; width: 178px; border-left: 19px solid transparent; border-right: 19px solid transparent; border-top: 50px solid #E7E7E7; } .bulb.middle-3 { margin: -20px auto 0 auto; width: 182px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 30px solid #E7E7E7; } .bulb.bottom { width: 184px; height: 65px; margin: -8px auto 0 auto; padding: 0; border-radius: 0 0 999px 999px; background: #E7E7E7; } #base { position:relative; z-index: 2; } .screw { transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); padding: 0; } .screw-top { margin: -18px auto -4px auto; padding: 0; width: 132px; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 21px solid #D3D3D3; border-radius: 999px; } .screw.a { background: #DDD; width: 150px; height: 15px; border-radius: 999px; margin: -1px auto 0px; } .screw.b { background: #D9D9D9; width: 135px; height: 15px; margin: -1px auto 0px; } .screw.c { margin: -1px auto 0px; width: 78px; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 20px solid #DDD; border-radius: 8px; } .screw.d { margin: 0 auto; width: 15px; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 15px solid #444; } .on #light { -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .bulb.top, .bulb.bottom { transition: all 0.5s ease-in-out; } .bulb.middle-1, .bulb.middle-2, .bulb.middle-3 { transition: all 0.5s ease-in-out; }
Com esses arquivos HTML e CSS, você já deve conseguir ver a forma de uma lâmpada em seu navegador. Abra o arquivo HTML para assistir ao vivo! Está funcionando? Ok, agora vamos dar a vocês algumas funções.
Este arquivo irá imitar o comportamento de uma lâmpada com um simples clique de energia. Ao clicar para desligá-lo, você definirá algumas funções que serão usadas um pouco mais tarde para alterar sua cor através do Netbeast.
var color = document.getElementById('color') var power = document.getElementById('power') var bulb = document.getElementById('bulb') var button = document.getElementById('run-btn') var light = document.getElementById('light') button.onclick = function toggleBulbState () { changeBulbParams({ color: color.value, power: power.value }) } function setBulbParams (params) { if (params.power === 'off') { params = { color: 'E7E7E7' } } console.log('set params', params) var bulb_parts = ['.bulb.middle-1', '.bulb.middle-2', '.bulb.middle-3'] document.querySelector('.bulb.top').style.boxShadow = '0px 0px 98px #' + params.color document.querySelector('.bulb.top').style.backgroundColor = params.color document.querySelector('.bulb.bottom').style.backgroundColor = params.color bulb_parts.forEach(function (className) { document.querySelector(className).style.borderTopColor = params.color }) } function changeBulbParams (params) { console.log('change params', params) /* Overwrite html fields if necessary */ color.value = params.color || color.value power.value = params.power || power.value setBulbParams({color: color.value, power: power.value}) }
Então tudo começará a fazer sentido: os campos e o botão de execução, agora você pode começar a testar as diferentes cores da sua nova lâmpada virtual! No entanto, o motivo pelo qual viemos aqui é para fazer outro dispositivo em nosso ecossistema da Internet das Coisas.
O mais recente JS front-end feito por nós, simula uma conexão wireless com o servidor, como uma lâmpada WiFi ou Bluetooth faria com seu controle remoto, como um telefone, um servidor ou um hub. É a interface que o código do plugin usará para controlá-lo!
var socket = io.connect() socket.on('connect', function () { console.log('ws:// bulb is online') }) socket.on('disconnect', function () { console.log('ws:// connection with bulb lost') }) socket.on('set', function (params) { changeBulbParams(params) // uses functions from bulb.js! }) socket.on('get', function () { const params = { power: power.value, color: color.value } socket.emit('params', params) })
Por último, precisamos que a biblioteca WebSocket seja incluída em nosso HTML para que a interface esteja pronta. Você pode copiar o código-fonte de https://raw.githubusercontent.com/netbeast/bulb-plugin/master/public/socketio.js e colá-lo em um arquivo chamado socketio.js . De um terminal com curl
ou wget
, você pode fazer isso simples:
curl https://raw.githubusercontent.com/netbeast/bulb-plugin/master/public/socketio.js > public/socketio.js
Agora teríamos uma estrutura de arquivo semelhante a esta:
myplugin ├── README.md ├── index.js ├── package.json ├── public │ ├── bulb.css │ ├── bulb.js │ ├── hw-api.js │ ├── index.html │ └── socketio.js └── test.js
Agora vamos fazer a interface com o dispositivo e registrá-lo no motor do Netbeast. Ele ouvirá os websockets para detectar se alguma lâmpada foi instalada na rede e, em seguida, fará um POST
para a API do painel para disponibilizar os novos recursos.
Então, vamos dar uma olhada nos arquivos que geramos anteriormente:
Este arquivo contém todas as dependências e informações necessárias para executar seu aplicativo. O Netbeast usa o usual package.json também para recuperar certas informações, como nome ou tipo. É importante especificar que este pacote é um plugin!
{ 'name': 'myplugin', 'version': '0.0.0', 'description': 'Netbeast plugin for... ', 'main': 'index.js', 'netbeast': { 'bootOnLoad': true, 'type': 'plugin' }, 'dependencies': { 'bluebird': '^3.3.5', 'body-parser': '^1.15.0', 'express': '^4.13.4', 'minimist': '^1.2.0', 'mocha': '^2.3.2', 'morgan': '^1.6.1', 'netbeast': '^1.0.6', 'socket.io': '^1.4.5', 'superagent': '^1.8.3' }, 'devDependencies': {}, 'scripts': { 'test': 'node test.js', 'start': 'node index.js' }, 'repository': { 'type': 'git', 'url': 'GITHUB_REPOSITORY' }, 'keywords': [ 'iot', 'netbeast', 'plugin' ], 'author': 'YOUR_EMAIL', 'license': 'GPL 3', 'bugs': { 'url': 'ISSUES_CHANNEL' }, 'homepage': 'HOMEPAGE' }
Este é o código que é trazido do painel de controle do Netbeast para iniciar o plugin! Ele terá que aceitar a porta por meio de argumentos de linha de comando para saber onde aceitar as solicitações de entrada. Ele será iniciado como se digitássemos node myplugin.js --port
. Lembre-se de levar em consideração o hashbang no princípio! #!/usr/bin/env node
.
#!/usr/bin/env node var io = require('socket.io')() var express = require('express') var bodyParser = require('body-parser') var app = express() // Netbeast apps need to accept the port to be launched by parameters var argv = require('minimist')(process.argv.slice(2)) app.use(express.static('public')) // will serve our app in an HTTP server app.use(bodyParser.json()) // will parse JSON API calls app.use('/api', require('./plugin')(io)) var server = app.listen(argv.port || 31416, function () { console.log('Bulb plugin listening at http://%s:%s', server.address().address, server.address().port) }) // we need websockets to push updates to browser view io.listen(server)
Como você pode ver, estava faltando um arquivo para iniciar, aquele que realmente implementa os drivers socket.io . Que legal!
var express = require('express') var netbeast = require('netbeast') var router = express.Router() var bulbParams // auxiliar variable, nasty way to transmit changes, but works module.exports = function (io) { io = io // Create resource that works on lights topic and listens on /api route netbeast('lights').create({ app: 'myplugin', hook: '/api' }) io.on('connection', function () { console.log('ws:// bulb has connected to plugin') }) io.on('disconnection', function () { console.log('ws:// bulb has disconnected from plugin') }) io.on('connect_failure', function (err) { console.trace(err) }) router.post('/', function (req, res) { io.emit('set', { power: req.body.power, color: req.body.color, }) res.status(200).json(req.body) }) router.get('/', function (req, res) { io.emit('get') var timerReference = setTimeout(function () { if (bulbParams) { res.json(bulbParams) } else { res.status(200).json({ error: 'No bulb available' }) } }, 3000) }) return router }
Agora é a hora de testar o aplicativo. Você pode empacotar tudo em um tar.gz
e, em seguida, carregue o aplicativo no painel de controle na seção arrastar e soltar http: // localhost: 8000 / install.
beast package # Compresses your app when ran in myplugin dir
Voilà! Agora você pode acessar seus plug-ins e testá-lo. Vá para a seção de rede (http: // localhost: 8000 / dispositivos) para ver como funciona e alterar sua cor a partir daí.
Se algo der errado ou você achar que esqueceu um detalhe, tente executar localmente com o nó node index.js
, e talvez seja mais fácil depurar do que dentro do log netbeast start
.
Se quiser que o aplicativo apareça no painel de controle da seção Explorar do Netbeast, você deve criar um repositório no GitHub com o aplicativo ou plug-in do Netbeast, ambos incluídos na descrição e README.md .
Para encontrar os aplicativos que criamos, use a API de pesquisa do GitHub. Vemos os mesmos resultados que aparecem quando uma solicitação GET é feita para: https://api.github.com/search/repositories?q=netbeast+language:javascript
Você saberá que seu aplicativo será exibido, se houver!
Ambos os projetos são open source e realmente envolveram as comunidades. Se você deseja começar a criar seus próprios fluxos ou nós para o Node-Red, dê uma olhada em seus documentação oficial . Siga as etapas descritas lá e você poderá publicar seu próprio nó ou fluxo em nenhum momento.
Por outro lado, se você quiser entrar no Netbeast, também pode seguir sua documentação ou dar uma olhada no repositório do painel. Ao usar a API do Netbeast, você não precisa se concentrar em dispositivos, marcas ou tecnologias individuais, então experimente. Você pode aprender mais sobre isso em NetBeast.co e juntar-se a eles Canal Slack para discutir Node-RED, IoT ou Node.js.
Se você deseja instalar em um Raspberry Pi, Beagle Bone ou em um servidor antigo, é fácil hackear o Smart Hub - sem código! Existem instaladores prontos para eles em ambos os sites.
Feliz hacking.