Skip to content

Latest commit

 

History

History
88 lines (79 loc) · 13.3 KB

functional-reactive-programming-frp.md

File metadata and controls

88 lines (79 loc) · 13.3 KB
Raw

Functional Reactive Programming (FRP)

Context: frontend-dev-bookmarks / Architecture

FRP is a programming paradigm for asynchronous dataflow programming using the building blocks of functional programming.

frontend.directory Gitter Twitter

  • A General Theory of Reactivity: Kris Kowal describes popular primitives of Reactive Programming and some use cases.
  • A General Theory of Reactivity (Video): Kris Kowal talks about reactive primitives and their traits.
  • Controlling Time and Space: This talk will quickly cover the basics of FRP, and then go into a couple different formulations of FRP that people are beginning to use. We will explore how these formulations fit together historically and theoretically.
  • Cycle.js: A functional and reactive JavaScript framework that solves the cyclic dependency of Observables which emerge during dialogues (mutual observations) between the Human and the Computer.
    • Async Driver: Higher order factory for creating cycle.js async request based drivers. Allows you almost completely eliminate boilerplate code for this kind of drivers.
    • Cycle.js Was Built to Solve Problems: In this video André Staltz shows how Cycle.js has a practical purpose, meant to solve problems your customers/business may relate to.
    • Cycle.js and Functional Reactive User Interfaces: In this talk we will discover how Cycle.js is purely reactive and functional, and why it's an interesting alternative to React.
    • Draw Cycle: Simple Cycle.js program visualized
    • Drivers: Drivers are functions that listen to Observable sinks (their input), perform imperative side effects, and may return Observable sources (their output).
      • Animation: A Cycle driver for requestAnimationFrame.
      • Audio Graph Driver: Audio graph driver for Cycle.js based on virtual-audio-graph.
      • Cookie: Cycle.js Cookie Driver, based on cookie_js library.
      • DOM: The standard DOM Driver for Cycle.js based on virtual-dom, and other helpers.
      • Fetch: A Cycle.js Driver for making HTTP requests, using the Fetch API.
      • Fetcher: A Cycle.js Driver for making HTTP requests using stackable-fetcher.
      • Firebase: Thin layer around the firebase javascript API that allows you to query and declaratively update your favorite real-time database.
      • HTTP: A Cycle.js Driver for making HTTP requests, based on superagent.
      • Hammer.js: The driver incorporates the Hammer.js gesture library.
      • History: Cycle.js URL Driver based on the rackt/history library.
      • Keys: A Cycle.js driver for keyboard events.
      • Mongoose.js: A driver for using Mongoose with Cycle JS. Accepts both, write and read operations.
      • Notification: A Cycle.js Driver for showing and responding to HTML5 Notifications.
      • Router: A router built from the ground up with Cycle.js in mind. Stands on the shoulders of battle-tested libraries switch-path for route matching and rackt/history for dealing with the History API.
      • Router5: A source/sink router driver for Cycle.js, based on router5.
      • Server-Sent Events: Cycle.js driver for Server-Sent Events (SSE), a browser feature also known as EventSource. Server-Sent Events allow the server to continuously update the page with new events, without resorting to hacks like long-polling.
      • Snabbdom: Alternative DOM driver utilizing the snabbdom library.
      • Socket.IO: A Cycle driver for applications using Socket.IO
      • Storage: A Cycle.js Driver for using localStorage and sessionStorage in the browser.
    • Example Projects: Example applications built with Cycle.js
      • Cycle.js Examples: Browse and learn from examples of small Cycle.js apps using Core, DOM Driver, HTML Driver, HTTP Driver, JSONP Driver, and others.
      • RX Marbles: Interactive diagrams of Rx Observables.
      • TODO: Minimum Viable Pizza: Minimum Viable Pizza implemented with Cycle.js
      • Tricycle: A scratchpad for trying out Cycle.js.
    • Intro to Functional Reactive Programming with Cycle.js: Nick Johnstone gives an introduction to developing with Cycle.js in this video presentation.
    • Learning How to Ride: an Introduction to Cycle.js: In this talk, Fernando Macias Pereznieto introduces us to the good, the bad, and the beautiful of using Cycle.js, whether you are a complete beginner or an experienced JS ninja.
    • Motorcycle.js: This is a sister project that will continue to evolve and grow alongside Cycle.js for the foreseeable future. The primary focus of this project is to tune it for performance as much as possible.
      • Most: Monadic reactive streams with high performance.
    • Plug and Play All Your Observable Streams With Cycle.js: Frederik Krautwald explains the principles behind Cycle.js, it's inner workings and how to use it to create a simple program with drivers.
    • Tricycle: A scratchpad for trying out Cycle.js.
    • What Developers Need to Know about MVI (Model-View-Intent): The article explains the general MVI pattern and how it relates to React, Reactive Programming and Cycle.js
  • Cycle.js and Functional Reactive User Interfaces: In this talk we will discover how Cycle.js is purely reactive and functional, and why it's an interesting alternative to React.
  • Dynamics of Change: why Reactivity Matters: In this talk we will see when passive or reactive strategy is advantageous, and how the reactive strategy is a sensible default.
  • Enemy of the State: An introduction to Functional Reactive Programming and Bacon.js by Philip Roberts.
  • MobX: MobX is a battle tested library that makes state management simple and scalable by transparently applying functional reactive programming.
  • Promises + FP = Beautiful Streams: Yassine Elouafi show how to use functional programming and algebraic data types to derive a pure functional definition of reactive programming like streams.
  • Stream Libraries: Libraries which help you compose asynchronous operations on streams of time-varying values and events.
    • Bacon.js: A small functional reactive programming lib for JavaScript. Turns your event spaghetti into clean and declarative feng shui bacon, by switching from imperative to functional.
    • Kefir.js: Kefir — is a Reactive Programming library for JavaScript inspired by Bacon.js and RxJS, with focus on high performance and low memory usage.
    • Most: Monadic reactive streams with high performance.
    • Reactive Extensions (RxJS): RxJS is a set of libraries for composing asynchronous and event-based programs using observable sequences and fluent query operators.
      • Async JavaScript with Reactive Extensions: Jafar Husain explains in this video how Netflix uses the Reactive Extensions (Rx) library to build responsive user experiences that strive to be event-driven, scalable and resilient.
      • Exploring Rx Operators: FlatMap: Christoph Burgdorf introduces the FlatMap operator and its usage for collections and observables.
      • Exploring Rx Operators: Map: Christoph Burgdorf explains how to use the map operator in RxJS.
      • Functional Core Reactive Shell: Giovanni Lodi makes an overview of different architecture meta-patterns and describes his current findings about functional programming and observables as a way to control side effects.
      • Learn RX: A series of interactive exercises for learning Microsoft's Reactive Extensions (Rx) Library for Javascript.
      • Learn RxJS: This site focuses on making RxJS concepts approachable, the examples clear and easy to explore, and features references throughout to the best RxJS related material on the web.
      • Real World Observables: Sergi Mansilla writes an FTP client to use it as an example for a real world application based on RxJS.
      • Rx Training Games: Rx Training Games is a coding playground that can be used to learn and practice Reactive Extensions coding grid-based games
      • Rx-Book: A complete book about RxJS v.4.0.
      • RxMarbles: A webapp for experimenting with diagrams of Rx Observables, for learning purposes.
      • RxState: Simple opinionated state management library based on RxJS and Immutable.js
      • Taking Advantage of Observables in Angular 2: Christoph Burgdorf describes the advantages of Observables and how you can use them in Angular 2 context.
      • Transducers with Observable Sequences: A chapter from the RxJS Book describing Transducers.
      • Why We Built Xstream: The authors needed a stream library tailored for Cycle.js. It needs to be “hot” only, small in kB size and it should have only a few and intuitive operators.
    • Xstream: An extremely intuitive, small, and fast functional reactive stream library for JavaScript.
      • Why We Built Xstream: The authors needed a stream library tailored for Cycle.js. It needs to be “hot” only, small in kB size and it should have only a few and intuitive operators.
  • The Introduction to Reactive Programming: André Staltz provides a complete introduction to the Reactive Programming and RxJS.
  • What if the User was a Function?: In this video André Staltz talks about the input/output cycle between humans and computers and how to take advantage of this model by using FRP and event streams.

License

Creative Commons License
This work is licensed under a Creative Commons Attribution 4.0 International License.

Please provide a link back to this repository. This is not necessary for GitHub forks.