Eu ministrei essa palestra 4x e essa é a última versão dela.

1. ACENDA A SUA LUZ
COM JS
+ um despacito
@ ABCDev - São Caetano do Sul 22/09/18

2. CAIQUE MITSUOKA Sorocabano
Ruby / JS / Elixir
1ª vez em São Caetano do Sul
Eu sou legal no twitter, segue lá
Sommelier de litrão
twitter.com/caiquemitsuoka
github.com/caiquemitsuoka

4. O despacito

6. O PROBLEMA

10. Preguiça
+
Vontade de aprender
=
💡

11. A IDEIA

12. 👧 + 📱 = 💡

13. Colocar internet na 💡.

14. Uma 💡 é um led.

15. Essa é a história de como
acender um led com JS.

16. O PLANO

17. Enviar o comando pela internet
para o Raspberry Pi
e acender a luz

18. Pra mim C
é C de chato.

19. Node tem release oficial
para ARM

20. Node + Rasp = ♥

22. github.com/CaiqueMitsuoka/thomas-light
github.com/CaiqueMitsuoka/thomas-light-server

23. Socket @ Server
const SocketServer = {
setupClient: () => {
SocketServer.server.on('connection', (client) => {
client.on(
'register',
SocketServer.handleRegister(client)
).on(
'disconnect',
SocketServer.handleDisconnect(client)
)
})
},
...
}

24. Socket @ Server
const SocketServer = {
...
handleRegister: (client) => {
return (data) => {
client.lightId = getMd5(data)
SocketServer.lights[client.lightId] = {
client: client
}
client.emit('registered', client.lightId)
}
},
...
}

25. Socket @ Server
const SocketServer = {
setupClient: () => {
SocketServer.server.on('connection', (client) => {
client.on(
'register',
SocketServer.handleRegister(client)
).on(
'disconnect',
SocketServer.handleDisconnect(client)
)
})
},
...
}

26. Socket @ Server
const SocketServer = {
...
handleDisconnect: (client) => {
return () => {
delete SocketServer.lights[client.lightId]
}
}
}

27. const lightsController = {
edit: (request, response) =>
lights[request.params.id].client.emit('status.update')
response.redirect('/')
}
}
Controller @ Server

28. const socket =
require('socket.io-client')(process.env.SERVER_URL);
const LightLighter = require('./light-lighter/index')
socket.on('connect', () => {
socket.emit('register', process.env.ID)
})
.on('status.update', () => {
toggleMainLight()
})
Socket @ Client

29. const state = {
mainLight: false
}
const toggleMainLight = () => {
if(state.mainLight) {
LightLighter.off()
} else {
LightLighter.on()
}
state.mainLight = !state.mainLight
}
Toggle @ Client

30. Light Lighter

31. O Raspberry funciona
com 3,3v e 5v

32. Uma lampada comum
funciona com
110v

33. 110v + rasp = 🔥

34. Não podemos acender
a 💡
com energia do rasp

35. Relay

36. Eu não entendi como
funciona o Relay na real

37. Mas a parte boa é que vc
não precisa! Vc só
precisa entender o
suficiente

43. const gpio = require('rpi-gpio')
const lightLighter = {
io4: 7,
off: () => {
gpio.destroy();
},
on: () => {
gpio.setup(lightLighter.io4, gpio.DIR_OUT, console.log)
}
}
LightLighter @ Pi

44. É realmente só isso

45. Foi assim que eu
coloquei internet em
uma lâmpada

46. Mas o que é a internet,
se não vocês <3

47. thomaslight.herokuapp.com

48. Internet
of

49. É muito
simples
fazer IoT

50. Faça algo
que você
gosta

51. Faça uma PoC

52. Faça código
para você

53. Faz um IoT daora ai
e me mostra.

54. Não faz IoT
quem não quer

55. E o despacito?

56. Acender uma
💡
é legal

57. Eu queria
ser RGB

58. O PLANO

59. Conectar uma
fita de leds
RGB

60. Mas não
rolou

61. Aquela
quinta-feira

62. Qualquer coisa
que emite luz
satisfaz meus
requisitos

63. Mas só
acender é
chato

64. Eu sou
altamente
influenciável

66. Guitar Hero
+
Internet
=

67. Vamo tenta
faze um negócio
doido

68. http://thomaslight.herokuapp.com/
guitar

69. const socket =
require('socket.io-client')(process.env.SERVER_URL);
const VigilantGuitar = require('./vigilant-guitar')
VigilantGuitar.init()
VigilantGuitar.start((color) => {
socket.emit('guitar.press', color)
})
Socket @ Client

70. const gp = require('gamepad')
const ACTIONS = {
0:'yellow',
1:'green',
2:'red',
3:'blue',
4:'orange',
}
VigilantGuitar @ Client

71. module.exports = VigilantGuitar = {
init: () => {
gp.init()
VigilantGuitar.CONTROLLERS = []
for (var i = 0, l = gp.numDevices(); i < l; i++) {
VigilantGuitar.CONTROLLERS
.push(gp.deviceAtIndex(i))
}
...
VigilantGuitar @ Client

72. ...
VigilantGuitar.controller =
VigilantGuitar.CONTROLLERS
.find((item) => {
return item.description.includes('Guitar')
})
},
VigilantGuitar @ Client

73. start: (callback) => {
VigilantGuitar.buttonSetup(callback)
setInterval(gp.processEvents, 50)
},
VigilantGuitar @ Client

74. buttonSetup: (callback) => {
gp.on('down', (id, num) => {
if(id === VigilantGuitar.controller.deviceID){
callback(ACTIONS[num])
}
})
}
VigilantGuitar @ Client

75. client.on('panel.connection',
SocketServer.handlePanelConnect(client))
.on('guitar.press',
SocketServer.handleGuitarPress(client))
Socket @ Server

76. const SocketServer = {
...
handlePanelConnect: (client) => {
return () => {
client.join('panels')
}
},
...
}
Socket @ Server

77. client.on('panel.connection',
SocketServer.handlePanelConnect(client))
.on('guitar.press',
SocketServer.handleGuitarPress(client))
Socket @ Server

78. const SocketServer = {
...
handleGuitarPress: (_client) => {
return (button) => {
SocketServer.server
.to('panels')
.emit(`guitar.${button}`)
}
},
...
}
Socket @ Server

79. <body>
<div data-panel></div>
</body>
HTML @ /guitar

80. var colors = {
green: '#12580d',
...
}
var socket = io()
var changeColor = function(colorName) {
return () => {
document.querySelector('[data-panel]')
.style.backgroundColor =
colors[colorName]
}
}
Script @ /guitar

81. socket.emit('panel.connection')
socket.on('guitar.green',
changeColor('green'))
socket.on('guitar.red', changeColor('red'))
socket.on('guitar.yellow',
changeColor('yellow'))
socket.on('guitar.blue',
changeColor('blue'))
socket.on('guitar.orange',
changeColor('orange'))
Script @ /guitar

82. Minha ‘guitarra’
Ta conectada com
Vc agora ♥

83. É isso ai

84. Valeu! ☭