Minicurso:
Internet das Coisas utilizando linguagem JavaScript
Prof. Dr. Marco Túlio Chella
DCOMP/UFS
IV Simpósio Brasileiro de Tecnologia da Informação – SBTI
outubro/2015
Minicurso:
Internet das Coisas utilizando linguagem JavaScript
Sobre:
• Visão geral e conceitos (IOT, M2M)
• Suporte Tecnológico
• Pesquisas e Produtos (Corporações e Academia)
• Fazendo IOT
• HTML, Javascript
• Javascript no Servidor
• Integração com hardware
• Pespectivas
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Termo proposto por Kevin Ashton em 1999
Expectativa de oferecer conectividade avançada a
dispositivos, sistemas e serviços.
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)
Comunicação entre máquinas
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)
Comunicação entre máquinas
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)
Comunicação entre máquinas
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)
Comunicação entre máquinas
Fitbit
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Como:
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Como: Lei de Moore
“Número de transistores nos circuitos dobra a cada 2
anos”
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Como: Lei de Moore
“Número de transistores nos circuitos dobra a cada 2
anos”
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT Visão I
• Pilha TCP em software
• Processador de propósito geral
• Interface Controlador Lógico programável
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT Visão II
• Pilha TCP em hardware
• SOC (processador memória e periféricos)
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT Visão II
SOC (System On Chip)
Pilha TCP em hardware
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento
SOC (System On Chip)
Alimentação e regulação
periféricos comunicação
Toolchain
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento: Arduino
• Baixo Custo
• Facilidade para desenvolvimento
• Suporte por comunidade
• Open Hardware e Software
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento: Arduino
ESP8266
Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento: Arduino
ESP8266
• WIFI
• Pilha TCP
• Core ARM 32 bits
• Periféricos (ADC , Digital)
• Toolchain (Lua, C++, Python)
Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Smart Cities platform from Libelium
Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Amazon Dash
Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Amazon Dash
Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Minicurso – IOT com Javascript
Tecnologias acessíveis e com baixo custo
Momento de Fazer
Minicurso – IOT com Javascript
Javascript no Cliente
Linguagem de programação baseada em objetos e em
funções de primeira classe.
Popular como linguagem de script para WEB
Multi-paradigma: orientação a objetos,
imperativa e funcional
Padronizada por ECMAScript
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
HTML define estrutura e conteúdo
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
CSS (Cascading Style Sheets) define o formato e aparência
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade
HTML DOM (Document Object Model)
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade: HTML DOM
Página ao ser carregada cria Document Object Model
Javascript pode manipular cada elemento ( Mudar, remover, criar , reagir )
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade: HTML DOM
Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Desenvolver HTML , Javascript, CSS
codepen.io
Alternativas:
Minicurso – IOT com Javascript
Javascript no Cliente
HTML5:
Novos elementos, atributos e comportamentos
Extenso conjunto de tecnologias que habilitam a implementação
de aplicações e websites com mais e poderosos recursos
• Semântica
• Conectividade
• Armazenamento
• Multimidia
• Gráfico 2D e 3D
• Acesso ao hardware do dispositivo
• Estilo
Minicurso – IOT com Javascript
Javascript no servidor
Javascript runtime baseado no V8 engine javascript desenvolvido
pelo Google e utilizado no navegador Chrome
Minicurso – IOT com Javascript
Javascript no servidor
Modelo baseado em event-driven e non-blocking I/O
Ecosistema de bibliotecas npm
Minicurso – IOT com Javascript
Javascript no servidor
lightweight and efficient
Fonte: Google I/O 2012 (http://v8-io12.appspot.com/#1)
Minicurso – IOT com Javascript
Javascript no servidor
lightweight and efficient
Servidor WEB em 4 linhas de código
Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
Disponível para as principais plataformas
Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
Executar em servidor na nuvem
PAAS (Platform as a Service)
Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
+
Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
Minicurso – IOT com Javascript
Servidor RESTful
RESTful Web Services
REST - Representational State Transfer
RESTful – serviço baseado em REST
Elementos:
• Representations
• Messages
• URIs (Uniform Resource Identifier)
• Uniform interface
• Stateless
• Links between resources
• Caching
Minicurso – IOT com Javascript
Servidor RESTful
RESTful Web Services
REST - Representational State Transfer
RESTful – serviço baseado em REST
recurso parâmetro
Minicurso – IOT com Javascript
Servidor RESTful
Quem?
Minicurso – IOT com Javascript
Servidor RESTful
Quem?
Minicurso – IOT com Javascript
Servidor RESTful: Implementação
Minicurso – IOT com Javascript
Servidor RESTful: Implementação
Minicurso – IOT com Javascript
Requisição http
mensagem enviada ao servidor
Minicurso – IOT com Javascript
Requisição http
mensagem recebida do servidor
Minicurso – IOT com Javascript
Servidor RESTful: Implementação
Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Servidor (hardware)
Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)
Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)
ler_valor_adc
enviar_valor_adc/324
Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)
enviar_comando_led/ligar
ler_comando_led
Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST
Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST
Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST
Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST
Minicurso – IOT com Javascript
Servidor RESTful: Cliente Arduino
Minicurso – IOT com Javascript
Servidor RESTful: Cliente Arduino
Minicurso – IOT com Javascript
Servidor RESTful: Cliente navegador
HTML e Javascript
Minicurso – IOT com Javascript
Criar um página HTML - 01
Minicurso – IOT com Javascript
Criar um página HTML - 02
https://goo.gl/Y2sRic
Minicurso – IOT com Javascript
Criar um página HTML - 03
Minicurso – IOT com Javascript
Criar um página HTML - 04
Minicurso – IOT com Javascript
Criar um página HTML - 05
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML : AJAX
Asynchronous Javascript and XML (XML não obrigatório)
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Javascript e HTML
Minicurso – IOT com Javascript
Indo além....
Hardware:
Sensores e atuadores
Minicurso – IOT com Javascript
Indo além....
Hardware:
Plataformas
Minicurso – IOT com Javascript
Indo além....
Software:
Nodered - IBM
Minicurso – IOT com Javascript
Experimento real
IOT no contexto de automação residencial
Minicurso – IOT com Javascript
< Muito Obrigado >

Minicurso IOT com javascript - SBTI

  • 1.
    Minicurso: Internet das Coisasutilizando linguagem JavaScript Prof. Dr. Marco Túlio Chella DCOMP/UFS IV Simpósio Brasileiro de Tecnologia da Informação – SBTI outubro/2015
  • 2.
    Minicurso: Internet das Coisasutilizando linguagem JavaScript Sobre: • Visão geral e conceitos (IOT, M2M) • Suporte Tecnológico • Pesquisas e Produtos (Corporações e Academia) • Fazendo IOT • HTML, Javascript • Javascript no Servidor • Integração com hardware • Pespectivas
  • 3.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Termo proposto por Kevin Ashton em 1999 Expectativa de oferecer conectividade avançada a dispositivos, sistemas e serviços.
  • 4.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Ampliar o conceito de M2M ( Machine to Machine) Comunicação entre máquinas
  • 5.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Ampliar o conceito de M2M ( Machine to Machine) Comunicação entre máquinas
  • 6.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Ampliar o conceito de M2M ( Machine to Machine) Comunicação entre máquinas
  • 7.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Ampliar o conceito de M2M ( Machine to Machine) Comunicação entre máquinas Fitbit
  • 8.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT (Internet of Things) Ampliar o conceito de M2M ( Machine to Machine)
  • 9.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Como:
  • 10.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Como: Lei de Moore “Número de transistores nos circuitos dobra a cada 2 anos”
  • 11.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Como: Lei de Moore “Número de transistores nos circuitos dobra a cada 2 anos”
  • 12.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT Visão I • Pilha TCP em software • Processador de propósito geral • Interface Controlador Lógico programável
  • 13.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT Visão II • Pilha TCP em hardware • SOC (processador memória e periféricos)
  • 14.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) IOT Visão II SOC (System On Chip) Pilha TCP em hardware
  • 15.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Plataformas para desenvolvimento SOC (System On Chip) Alimentação e regulação periféricos comunicação Toolchain
  • 16.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Plataformas para desenvolvimento
  • 17.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Plataformas para desenvolvimento: Arduino • Baixo Custo • Facilidade para desenvolvimento • Suporte por comunidade • Open Hardware e Software
  • 18.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Plataformas para desenvolvimento: Arduino ESP8266
  • 19.
    Minicurso – IOTcom Javascript Visão geral e conceitos (IOT, M2M) Plataformas para desenvolvimento: Arduino ESP8266 • WIFI • Pilha TCP • Core ARM 32 bits • Periféricos (ADC , Digital) • Toolchain (Lua, C++, Python)
  • 20.
    Minicurso – IOTcom Javascript Pesquisas e Produtos (Corporações e Academia)
  • 21.
    Minicurso – IOTcom Javascript Pesquisas e Produtos (Corporações e Academia) Smart Cities platform from Libelium
  • 22.
    Minicurso – IOTcom Javascript Pesquisas e Produtos (Corporações e Academia) Amazon Dash
  • 23.
    Minicurso – IOTcom Javascript Pesquisas e Produtos (Corporações e Academia) Amazon Dash
  • 24.
    Minicurso – IOTcom Javascript Pesquisas e Produtos (Corporações e Academia)
  • 25.
    Minicurso – IOTcom Javascript Tecnologias acessíveis e com baixo custo Momento de Fazer
  • 26.
    Minicurso – IOTcom Javascript Javascript no Cliente Linguagem de programação baseada em objetos e em funções de primeira classe. Popular como linguagem de script para WEB Multi-paradigma: orientação a objetos, imperativa e funcional Padronizada por ECMAScript
  • 27.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB HTML define estrutura e conteúdo
  • 28.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB CSS (Cascading Style Sheets) define o formato e aparência
  • 29.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB Javascript adiciona interatividade
  • 30.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB Javascript adiciona interatividade HTML DOM (Document Object Model)
  • 31.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB Javascript adiciona interatividade: HTML DOM Página ao ser carregada cria Document Object Model Javascript pode manipular cada elemento ( Mudar, remover, criar , reagir )
  • 32.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB Javascript adiciona interatividade: HTML DOM
  • 33.
    Minicurso – IOTcom Javascript Javascript no Cliente Páginas WEB e aplicações WEB Desenvolver HTML , Javascript, CSS codepen.io Alternativas:
  • 34.
    Minicurso – IOTcom Javascript Javascript no Cliente HTML5: Novos elementos, atributos e comportamentos Extenso conjunto de tecnologias que habilitam a implementação de aplicações e websites com mais e poderosos recursos • Semântica • Conectividade • Armazenamento • Multimidia • Gráfico 2D e 3D • Acesso ao hardware do dispositivo • Estilo
  • 35.
    Minicurso – IOTcom Javascript Javascript no servidor Javascript runtime baseado no V8 engine javascript desenvolvido pelo Google e utilizado no navegador Chrome
  • 36.
    Minicurso – IOTcom Javascript Javascript no servidor Modelo baseado em event-driven e non-blocking I/O Ecosistema de bibliotecas npm
  • 37.
    Minicurso – IOTcom Javascript Javascript no servidor lightweight and efficient Fonte: Google I/O 2012 (http://v8-io12.appspot.com/#1)
  • 38.
    Minicurso – IOTcom Javascript Javascript no servidor lightweight and efficient Servidor WEB em 4 linhas de código
  • 39.
    Minicurso – IOTcom Javascript Javascript no servidor Primeiros passos: Disponível para as principais plataformas
  • 40.
    Minicurso – IOTcom Javascript Javascript no servidor Primeiros passos: Executar em servidor na nuvem PAAS (Platform as a Service)
  • 41.
    Minicurso – IOTcom Javascript Javascript no servidor Primeiros passos: +
  • 42.
    Minicurso – IOTcom Javascript Javascript no servidor Primeiros passos:
  • 43.
    Minicurso – IOTcom Javascript Servidor RESTful RESTful Web Services REST - Representational State Transfer RESTful – serviço baseado em REST Elementos: • Representations • Messages • URIs (Uniform Resource Identifier) • Uniform interface • Stateless • Links between resources • Caching
  • 44.
    Minicurso – IOTcom Javascript Servidor RESTful RESTful Web Services REST - Representational State Transfer RESTful – serviço baseado em REST recurso parâmetro
  • 45.
    Minicurso – IOTcom Javascript Servidor RESTful Quem?
  • 46.
    Minicurso – IOTcom Javascript Servidor RESTful Quem?
  • 47.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação
  • 48.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação
  • 49.
    Minicurso – IOTcom Javascript Requisição http mensagem enviada ao servidor
  • 50.
    Minicurso – IOTcom Javascript Requisição http mensagem recebida do servidor
  • 51.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação
  • 52.
    Minicurso – IOTcom Javascript Servidor RESTful: Modelos Navegador (cliente) Servidor (hardware)
  • 53.
    Minicurso – IOTcom Javascript Servidor RESTful: Modelos Navegador (cliente) Cliente (hardware) Servidor (nuvem)
  • 54.
    Minicurso – IOTcom Javascript Servidor RESTful: Modelos Navegador (cliente) Cliente (hardware) Servidor (nuvem) ler_valor_adc enviar_valor_adc/324
  • 55.
    Minicurso – IOTcom Javascript Servidor RESTful: Modelos Navegador (cliente) Cliente (hardware) Servidor (nuvem) enviar_comando_led/ligar ler_comando_led
  • 56.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação REST
  • 57.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação REST
  • 58.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação REST
  • 59.
    Minicurso – IOTcom Javascript Servidor RESTful: Implementação REST
  • 60.
    Minicurso – IOTcom Javascript Servidor RESTful: Cliente Arduino
  • 61.
    Minicurso – IOTcom Javascript Servidor RESTful: Cliente Arduino
  • 62.
    Minicurso – IOTcom Javascript Servidor RESTful: Cliente navegador HTML e Javascript
  • 63.
    Minicurso – IOTcom Javascript Criar um página HTML - 01
  • 64.
    Minicurso – IOTcom Javascript Criar um página HTML - 02 https://goo.gl/Y2sRic
  • 65.
    Minicurso – IOTcom Javascript Criar um página HTML - 03
  • 66.
    Minicurso – IOTcom Javascript Criar um página HTML - 04
  • 67.
    Minicurso – IOTcom Javascript Criar um página HTML - 05
  • 68.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 69.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 70.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 71.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 72.
    Minicurso – IOTcom Javascript Javascript e HTML : AJAX Asynchronous Javascript and XML (XML não obrigatório)
  • 73.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 74.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 75.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 76.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 77.
    Minicurso – IOTcom Javascript Javascript e HTML
  • 78.
    Minicurso – IOTcom Javascript Indo além.... Hardware: Sensores e atuadores
  • 79.
    Minicurso – IOTcom Javascript Indo além.... Hardware: Plataformas
  • 80.
    Minicurso – IOTcom Javascript Indo além.... Software: Nodered - IBM
  • 81.
    Minicurso – IOTcom Javascript Experimento real IOT no contexto de automação residencial
  • 82.
    Minicurso – IOTcom Javascript < Muito Obrigado >