Minicurso IOT com javascript - SBTI ministrado no SBTI outubro de 2015

1. 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

2. 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

3. 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.

4. 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

5. 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

6. 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

7. 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

8. Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT (Internet of Things)
Ampliar o conceito de M2M ( Machine to Machine)

9. Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Como:

10. 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”

11. 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”

12. 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

13. 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)

14. Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
IOT Visão II
SOC (System On Chip)
Pilha TCP em hardware

15. 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

16. Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento

17. 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

18. Minicurso – IOT com Javascript
Visão geral e conceitos (IOT, M2M)
Plataformas para desenvolvimento: Arduino
ESP8266

19. 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)

20. Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)

21. Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Smart Cities platform from Libelium

22. Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Amazon Dash

23. Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)
Amazon Dash

24. Minicurso – IOT com Javascript
Pesquisas e Produtos (Corporações e Academia)

25. Minicurso – IOT com Javascript
Tecnologias acessíveis e com baixo custo
Momento de Fazer

26. 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

27. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
HTML define estrutura e conteúdo

28. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
CSS (Cascading Style Sheets) define o formato e aparência

29. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade

30. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade
HTML DOM (Document Object Model)

31. 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 )

32. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Javascript adiciona interatividade: HTML DOM

33. Minicurso – IOT com Javascript
Javascript no Cliente
Páginas WEB e aplicações WEB
Desenvolver HTML , Javascript, CSS
codepen.io
Alternativas:

34. 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

35. Minicurso – IOT com Javascript
Javascript no servidor
Javascript runtime baseado no V8 engine javascript desenvolvido
pelo Google e utilizado no navegador Chrome

36. Minicurso – IOT com Javascript
Javascript no servidor
Modelo baseado em event-driven e non-blocking I/O
Ecosistema de bibliotecas npm

37. Minicurso – IOT com Javascript
Javascript no servidor
lightweight and efficient
Fonte: Google I/O 2012 (http://v8-io12.appspot.com/#1)

38. Minicurso – IOT com Javascript
Javascript no servidor
lightweight and efficient
Servidor WEB em 4 linhas de código

39. Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
Disponível para as principais plataformas

40. Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
Executar em servidor na nuvem
PAAS (Platform as a Service)

41. Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:
+

42. Minicurso – IOT com Javascript
Javascript no servidor
Primeiros passos:

43. 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

44. Minicurso – IOT com Javascript
Servidor RESTful
RESTful Web Services
REST - Representational State Transfer
RESTful – serviço baseado em REST
recurso parâmetro

45. Minicurso – IOT com Javascript
Servidor RESTful
Quem?

46. Minicurso – IOT com Javascript
Servidor RESTful
Quem?

47. Minicurso – IOT com Javascript
Servidor RESTful: Implementação

48. Minicurso – IOT com Javascript
Servidor RESTful: Implementação

49. Minicurso – IOT com Javascript
Requisição http
mensagem enviada ao servidor

50. Minicurso – IOT com Javascript
Requisição http
mensagem recebida do servidor

51. Minicurso – IOT com Javascript
Servidor RESTful: Implementação

52. Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Servidor (hardware)

53. Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)

54. Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)
ler_valor_adc
enviar_valor_adc/324

55. Minicurso – IOT com Javascript
Servidor RESTful: Modelos
Navegador (cliente)
Cliente (hardware)
Servidor (nuvem)
enviar_comando_led/ligar
ler_comando_led

56. Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST

57. Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST

58. Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST

59. Minicurso – IOT com Javascript
Servidor RESTful: Implementação REST

60. Minicurso – IOT com Javascript
Servidor RESTful: Cliente Arduino

61. Minicurso – IOT com Javascript
Servidor RESTful: Cliente Arduino

62. Minicurso – IOT com Javascript
Servidor RESTful: Cliente navegador
HTML e Javascript

63. Minicurso – IOT com Javascript
Criar um página HTML - 01

64. Minicurso – IOT com Javascript
Criar um página HTML - 02
https://goo.gl/Y2sRic

65. Minicurso – IOT com Javascript
Criar um página HTML - 03

66. Minicurso – IOT com Javascript
Criar um página HTML - 04

67. Minicurso – IOT com Javascript
Criar um página HTML - 05

68. Minicurso – IOT com Javascript
Javascript e HTML

69. Minicurso – IOT com Javascript
Javascript e HTML

70. Minicurso – IOT com Javascript
Javascript e HTML

71. Minicurso – IOT com Javascript
Javascript e HTML

72. Minicurso – IOT com Javascript
Javascript e HTML : AJAX
Asynchronous Javascript and XML (XML não obrigatório)

73. Minicurso – IOT com Javascript
Javascript e HTML

74. Minicurso – IOT com Javascript
Javascript e HTML

75. Minicurso – IOT com Javascript
Javascript e HTML

76. Minicurso – IOT com Javascript
Javascript e HTML

77. Minicurso – IOT com Javascript
Javascript e HTML

78. Minicurso – IOT com Javascript
Indo além....
Hardware:
Sensores e atuadores

79. Minicurso – IOT com Javascript
Indo além....
Hardware:
Plataformas

80. Minicurso – IOT com Javascript
Indo além....
Software:
Nodered - IBM

81. Minicurso – IOT com Javascript
Experimento real
IOT no contexto de automação residencial

82. Minicurso – IOT com Javascript
< Muito Obrigado >