Bacon.js

Juha Paananen @raimohanska

FP

FP


// var emails : Array<Email>

emails
  .filter(function(mail) { return !isSpam(mail) })
  .map(function(mail) { return mail.subject })
  .forEach(show)

FRP - Bacon.js


// var incomingEmailE : EventStream<Email>

incomingEmailE
  .filter(function(mail) { return !isSpam(mail) })
  .map(function(mail) { return mail.subject })
  .forEach(show)

EventStream

Distinct Events

Property

Time-varying Value

EventStream

incomingEmailE

Property

inboxP

Mail Client

Inbox


var socket = io();                           // Connect with Socket.IO
socket.emit("get-mail");                     // Request mail
var mailE = Bacon.fromEvent(socket, "mail"); // Wrap into Bacon

mailE
  .map(".subject")
  .onValue(bubble)
var socket = io(); // Connect with Socket.IO socket.emit("get-mail"); // Request mail var mailE = Bacon.fromEvent(socket, "mail"); // Wrap into Bacon var inboxP = mailE .take(10) .bufferingThrottle(2000) .scan([], ".concat") .onValue(showInbox)

Bacon Application

Mail App Components


// Input: stream of messages to send
function MailClient(messagesToSendE) {
  // Connect using Socket.IO, Websocket, TCP...
  return { incomingMessagesE // Output: stream of incoming messages }
}

// Input: stream of messages to send
function Inbox(incomingMessagesE) {
  return { inboxP: incomingMessagesE.scan([], ".concat") }
}

// Implement using JQuery, React, Native...
function Inboxview(inboxP) {
}

Duct Tape
var b = new Bacon.Bus() b.onValue(bubble) b.push("Duct tape")

Bacon and React

Bacon and Angular

Last words

Bacon.js

K THX BYE

@raimohanska (Juha Paananen)