35 KiB
35 KiB
Awesome Cycle.js !Awesome (https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg) (https://github.com/sindresorhus/awesome)
A collection of awesome Cycle.js tools, resources, videos and shiny things.
- Learn (#learn)
- Documentation (#documentation)
- Tutorials (#tutorials)
- Videos (#videos)
- Slides (#slides)
- Example Applications (#example-applications)
- Tools (#tools)
- CLI (#cli)
- Libraries (#libraries)
- Drivers (#drivers)
- Boilerplates (#boilerplates)
- Testing (#testing)
- Debugging (#debugging)
- Components (#components)
- Community (#community)
――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――
Learn
Documentation
⟡ cycle.js.org (http://cycle.js.org/) - Cycle.js official tutorial and documentation.
Tutorials
⟡ What Developers Need to Know about MVI (Model-View-Intent) (http://thenewstack.io/developers-need-know-mvi-model-view-intent/) - Post on MVI architecture.
⟡ Cycle.js: a reactive framework (https://lucamezzalira.com/2016/05/23/cycle-js-a-reactive-framework/) - Introduction to Cycle.js with real time data example.
⟡ Building realtime applications with CycleJS and RxJS (https://blog.pusher.com/building-realtime-applications-with-cyclejs-and-rxjs/) - Learn how to build realtime applications with CycleJS and RxJS
⟡ Working with HTTP Streams with Cycle.js (http://ivanjov.com/working-with-http-streams-with-cycle-js/) - Learn how to use Cycle.js to handle HTTP requests and responses
Videos
⟡ What if the user was a function? (https://www.youtube.com/watch?v=1zj7M1LnJV4) - Presentation at JSConf BP2015 by Andre Staltz (https://twitter.com/andrestaltz)
⟡ Unidirectional data flow architectures (https://vimeo.com/168652278) - Presentation AtTheFrontend Conference by Andre Staltz (https://twitter.com/andrestaltz)
⟡ Cycle.js and functional reactive user interfaces (https://www.youtube.com/watch?v=uNZnftSksYg) - Presentation at ReactiveConf 2015 by Andre Staltz (http://twitter.com/andrestaltz)
⟡ Intro to Functional Reactive Programming with Cycle.js (https://www.youtube.com/watch?v=6_ETUyh0tns) - Presentation by Nick Johnstone (https://twitter.com/widdnz)
⟡ Cycle.js Fundamentals (https://egghead.io/series/cycle-js-fundamentals) - Playlist at egghead.io (https://egghead.io)
⟡ Cycle.js was built to solve problems (https://www.youtube.com/watch?v=Rj8ZTRVka4E) - by Andre Staltz at Frontend.fi (http://frontend.fi/)
⟡ Brains as Building Blocks (https://www.youtube.com/watch?v=1ToJ7cxb1R8) - by Andre Staltz at CycleConf 2016 (http://cycleconf.com/)
⟡ Back to the Future, Hot reloading with Cycle.js (https://www.youtube.com/watch?v=rbrnyC5fXMM) - by Nick Johnstone at CycleConf 2016 (http://cycleconf.com/)
⟡ From MVC to FRP (https://www.youtube.com/watch?v=-PCq4pXaDZw) - by Gleb Bahmutov at CycleConf 2016 (http://cycleconf.com/)
⟡ Cycle.js on the bash side (https://www.youtube.com/watch?v=Rx5N99TQ52g) - by Hadrien de Cuzey at CycleConf 2016 (http://cycleconf.com/)
⟡ Reactive Programming with Cycle.js (https://vimeo.com/175121069) - by Luca Mezzalira at JSDay 2016 (http://2016.jsday.it/)
⟡ Learning how to ride: an introduction to Cycle.js (https://youtu.be/31URmaeNHSs) - by Fernando Macias Pereznieto at JS Monthly London (http://www.meetup.com/js-monthly-london/)
⟡ User Interfaces as Pure Functions of Time (https://www.youtube.com/watch?v=9BG0Y3C6WqM) - Lightning talk by Thomas Belin (http://twitter.com/atomrc) at dotjs 2016 (http://dotjs.io/)
Slides
⟡ Cycle.js an honestly reactive framework for web user interfaces (http://slides.com/erykpiast/cycle) - by Eryk Napierała
⟡ Intro to Cycle.js (http://www.slideshare.net/aryelukashevski/cyclejs-introduction) - by Arye Lukashevki
⟡ Reactive Programming with Cycle.js (http://www.slideshare.net/flashplatform/reactive-programming-with-cyclejs) - by Luca Mezzalira
⟡ Cycle.js - building apps with streams only (http://lmatteis.github.io/cyclejs-slides/keynote/index.html) - by Luca Matteis
⟡ Functional Reactive Programming with Cycle.js (https://slides.com/artfuldev/frp-with-cycle-js) - by Sudarsan Balaji
⟡ Beyond flux: going full cycle with FRP (https://clementd-files.cellar.services.clever-cloud.com/blog/frp-full-cycle-ncrafts.html) - by Clément Delafargue (http://clementd.cleverapps.io/)
Example Applications
⟡ cyclejs/cycle-examples (https://github.com/cyclejs/cyclejs/tree/master/examples) - Official collection of small Cycle.js examples
⟡ Widdershin/tricycle ★23 (https://github.com/Widdershin/tricycle) - Scratchpad for trying out Cycle.js, relies on Ace Editor with Cycle
⟡ cgeorg/todomvp ★21 (https://github.com/cgeorg/todomvp) - Minimum Viable Pizza, an example webapp written in Cycle.js
⟡ erykpiast/cyclejs-examples ★9 (https://github.com/erykpiast/cyclejs-examples) - Example web applications built with Cycle.js.
⟡ grozen/trends-cycle ★3 (https://github.com/grozen/trends-cycle) - Slack trend searching written in Cycle.js
⟡ ivan-kleshnin/cyclejs-examples ★120 (https://github.com/ivan-kleshnin/cyclejs-examples) - Collection of CycleJS examples, ES6.
⟡ ivan-kleshnin/tetris-cyclejs ★12 (https://github.com/ivan-kleshnin/tetris-game) - Tetris game implemented in CycleJS, ES6
⟡ phadej/graafi ★20 (https://github.com/phadej/graafi) - Cycle.js experiment with SVG and global undo/redo
http://oleg.fi/graafi/
⟡ staltz/matrixmultiplication.xyz ★548 (https://github.com/staltz/matrixmultiplication.xyz) - A interactive matrix multiplication webapp (http://matrixmultiplication.xyz/)
⟡ staltz/rxmarbles ★2,577 (https://github.com/staltz/rxmarbles) - Interactive diagrams of Rx Observables http://rxmarbles.com/
⟡ MarcCloud/magic-cart ★6 (https://github.com/MarcCloud/magic-cart) - Simple shopping cart of a magic creatures store.
⟡ foxdonut/cycle-todolist ★11 (https://github.com/foxdonut/cycle-todolist) - demonstrates a simple Cycle.js TODO list app with CRUD.
⟡ Mercateo/component-check ★468 (https://github.com/Mercateo/component-check) - Common patterns for building Cycle.js components
⟡ edge/electron-cycle-media ★27 (https://github.com/edge/electron-cycle-media) - Media player written with Cycle.js and Electron.
⟡ kibin/cycle-example-who-to-follow ★16 (https://github.com/kibin/cycle-example-who-to-follow) - Small example partly implements twitter’s who to follow box using github api.
⟡ SkaterDad/cycle-snabbdom-examples ★12 (https://github.com/SkaterDad/cycle-snabbdom-examples) - Examples of nested components, using snabbdom-specific animations.
⟡ bahmutov/draw-cycle ★112 (https://github.com/bahmutov/draw-cycle) - Interactive visualization of counter application showing the data flow inside a MVI component glebbahmutov.com/draw-cycle (https://glebbahmutov.com/draw-cycle/)
⟡ andreloureiro/pomocycle ★21 (https://github.com/andreloureiro/pomocycle) - A simple Pomodoro timer.
⟡ laszlokorte/tams-tools ★24 (https://github.com/laszlokorte/tams-tools) - A set of tools for teaching and learning computer science built with cycle.js.
⟡ lucamezzalira/jsday-cycle-js ★16 (https://github.com/lucamezzalira/jsday-cycle-js) - Reactive Live London Tube trains status example built with Cycle.js.
⟡ cyclejs-community/built-with-cycle ★9 (https://github.com/cyclejs-community/built-with-cycle) - A website (http://cyclejs-community.github.io/built-with-cycle) to showcase the cool projects built with Cycle.js
⟡ class-ideas/cyclejs-hangman ★10 (https://github.com/class-ideas/cyclejs-hangman) - A hangman game built with Cycle.js
⟡ wmaurer/cyclejs-fractals ★15 (https://github.com/wmaurer/cyclejs-fractals) - Dancing pythagorean tree fractal - Animating 2048 SVG nodes.
⟡ fabiothiroki/cyclejs-starwars ★2 (https://github.com/fabiothiroki/cyclejs-starwars) - A Star Wars character search app using Cycle.js, RxJS and Virtual DOM tests.
⟡ staltz/mmmmm-mobile ★124 (https://github.com/staltz/mmmmm-mobile/) - A React Native + Cycle.js app to implement a social network on Secure Scuttlebutt networks
⟡ cyclejs/todomvc-cycle ★214 (https://github.com/cyclejs/todomvc-cycle/) - TodoMVC example (https://cyclejs.github.io/todomvc-cycle/) implemented in Cycle.js
⟡ jefersondaniel/cyclejs-notes (https://github.com/jefersondaniel/cyclejs-notes/) - Notes app using Cycle.js and Orbit.js https://jefersondaniel.com/cyclejs-notes
⟡ staltz/dat-installer ★77 (https://github.com/staltz/dat-installer) - Download, install, and update Android apps through Dat
⟡ usm4n/cycle-hn ★25 (https://github.com/usm4n/cycle-hn) - Hackernews Clone Using CycleJS
⟡ lizraeli/cycle-github-emojis (https://github.com/lizraeli/cycle-github-emojis) - A github emoji viewer made with Cycle.JS webapp (https://github-emoji.levizraelit.com/)
⟡ perjerz3434/meetup.com ★1 (https://github.com/perjerz3434/meetup.com) - Meetup.com RSVP visualization around the world using CycleJS
Tools
CLI
⟡ cyclejs-community/create-cycle-app ★160 (https://github.com/cyclejs-community/create-cycle-app) - Create Cycle.js apps with no build configuration.
Libraries
Drivers
⟡ @cycle/http (https://github.com/cyclejs/cyclejs/tree/master/http) - A Cycle.js Driver for making HTTP requests, based on superagent.
⟡ @cycle/dom (https://github.com/cyclejs/cyclejs/tree/master/dom) - A Cycle.js driver to enable interaction with the DOM. The driver is based on snabbdom as the Virtual DOM library.
⟡ @cycle/storage (https://github.com/cyclejs/storage) - A Cycle.js Driver for using localStorage and sessionStorage.
⟡ @cycle/history (https://github.com/cyclejs/cyclejs/tree/master/history) - This is the standard Cycle.js driver for dealing with the History API (https://developer.mozilla.org/en-US/docs/Web/API/History_API)
⟡ @cycle/isolate (https://github.com/cyclejs/cyclejs/tree/master/isolate) - A utility function to make scoped dataflow components in Cycle.js.
⟡ @cycle/time (https://github.com/cyclejs/cyclejs/tree/master/time) - Fast and beautiful tests and time management for Cycle.js
⟡ cyclejs/cycle-notification-driver ★20 (https://github.com/cyclejs/cycle-notification-driver) - A Cycle.js Driver for showing and responding to HTML5 Notifications.
⟡ axefrog/cycle-router5 ★30 (https://github.com/axefrog/cycle-router5) - A router driver using Router5
⟡ cgeorg/cycle-socket.io ★27 (https://github.com/cgeorg/cycle-socket.io) - A Cycle driver for Socket.IO clients
⟡ secobarbital/cycle-fetch-driver ★2 (https://github.com/secobarbital/cycle-fetch-driver) - A Cycle.js Driver for making HTTP requests, using the Fetch API.
⟡ r7kamura/cycle-fetcher-driver ★14 (https://github.com/r7kamura/cycle-fetcher-driver) - A Cycle.js Driver for making HTTP requests using stackable-fetcher (https://github.com/r7kamura/stackable-fetcher).
⟡ benji6/cycle-audio-graph ★12 (https://github.com/benji6/cycle-audio-graph) - A Cycle.js Driver for manipulating the Web Audio API using virtual-audio-graph (https://github.com/benji6/virtual-audio-graph)
⟡ CyclicMaterials/cycle-hammer-driver ★11 (https://github.com/CyclicMaterials/cycle-hammer-driver) - A Cycle.js driver to wrap Hammer.js and detect touch gestures
⟡ jessaustin/cycle-sse-driver ★6 (https://github.com/jessaustin/cycle-sse-driver) - Source driver for Server-Sent Events/EventSource.
⟡ tylors/cycle-snabbdom ★41 (https://github.com/TylorS/cycle-snabbdom) - DOM driver using Snabbdom
⟡ cyclejs-community/cyclic-router ★90 (https://github.com/cyclejs-community/cyclic-router) - Router Driver built for Cycle.js
⟡ Widdershin/cycle-animation-driver ★33 (https://github.com/Widdershin/cycle-animation-driver) - Cycle driver for requestAnimationFrame
⟡ dralletje/cycle-firebase ★21 (https://github.com/dralletje/cycle-firebase) - A Cycle.js Driver for Firebase
⟡ edge/cycle-blessed ★46 (https://github.com/edge/cycle-blessed) - A Cycle.js Driver for terminal applications
⟡ 10clouds/cyclejs-cookie ★2 (https://github.com/10clouds/cyclejs-cookie) - Cookies Driver for Cycle.js
⟡ whitecolor/cycle-async-driver ★25 (https://github.com/whitecolor/cycle-async-driver) - Factory for creating async request/response cycle.js drivers
⟡ raquelxmoss/cycle-keys ★35 (https://github.com/raquelxmoss/cycle-keys) - Driver for keyboard events
⟡ rektide/recyclec ★0 (https://github.com/rektide/recyclec) - Readline driver
⟡ goodmind/cycle-telegram ★15 (https://github.com/goodmind/cycle-telegram) - A Cycle.js Driver for Telegram Bot API
⟡ apoco/cycle-electron-driver ★22 (https://github.com/apoco/cycle-electron-driver) - Driver to interact with Electron interface from Cycle.js application
⟡ rkrupinski/cyclejs-animated-localstorage ★12 (https://github.com/rkrupinski/cyclejs-animated-localstorage) - A Cycle.js driver for animating (srsly) localStorage.
⟡ cyclejs-community/cycle-keyboard ★9 (https://github.com/cyclejs-community/cycle-keyboard) - A keyboard driver for cycle.js
⟡ garrydzeng/cycle-page ★3 (https://github.com/garrydzeng/cycle-page) - A tiny client-side router for Cycle.js
⟡ jbowden1982/cycle-socketcluster ★5 (https://github.com/jbowden1982/cycle-socketcluster) - A socketcluster driver for Cycle.js
⟡ cyclejs-community/redux-cycles ★599 (https://github.com/cyclejs-community/redux-cycles) - A Redux middleware that allows you to handle actions lifecycle with Cycle.js
⟡ JuniperChicago/cycle-gun ★18 (https://github.com/JuniperChicago/cycle-gun) - A basic Cycle.js driver wrapping a gun.js instance allowing graph storage and p2p sync
⟡ EnigmaCurry/cycle-deepstream ★8 (https://github.com/EnigmaCurry/cycle-deepstream) - A Cycle.js driver for deepstream.io (https://deepstream.io)
⟡ Alex0007/cycle-express-driver ★1 (https://github.com/Alex0007/cycle-express-driver) - A Cycle.js driver for Express.js server
⟡ mrpierrot/cycle-node-http-server ★4 (https://github.com/mrpierrot/cycle-node-http-server) - A Cycle.js driver for Node.js HTTP(S) server
⟡ mrpierrot/cycle-net ★0 (https://github.com/mrpierrot/cycle-net) - A Cycle.js driver for Node.js HTTP(S)/WS(S)/Socket.io server
⟡ Avalander/cycle-idb ★4 (https://github.com/Avalander/cycle-idb) - A Cycle.js driver wrapping IndexedDB
⟡ unhappychoice/cycle-pusher ★1 (https://github.com/unhappychoice/cycle-pusher) - A Cycle.js driver for Pusher (https://pusher.com/)
⟡ helmoski/cycle-selection-driver (https://github.com/helmoski/cycle-selection-driver) - A Cycle.js driver for interacting with the Selection API (https://developer.mozilla.org/en-US/docs/Web/API/Selection)
⟡ mjyc/cycle-posenet-driver ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/3rdparty/cycle-posenet-driver) - A Cycle.js drivers for pose detection using TensorFlow.js (https://js.tensorflow.org/)-powered PoseNet
(https://github.com/tensorflow/tfjs-models/tree/master/posenet)
⟡ @cycle-robot-drivers/speech ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/speech) - Cycle.js drivers for speech synthesis and recognition using Web Speech API (https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API)
⟡ @cycle-robot-drivers/sound ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/sound) - A Cycle.js driver for playing sounds using HTMLAudioElement (https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement)
Utilities
⟡ staltz/chai-virtual-dom ★24 (https://github.com/staltz/chai-virtual-dom) - Chai assertion helpers to test virtual-dom VTrees
⟡ cgeorg/sinject ★10 (https://github.com/cgeorg/sinject) - a dependency injection tool supporting Cycle's circular dependencies
⟡ erykpiast/cyclejs-group ★20 (https://github.com/erykpiast/cyclejs-group) - Utility for CycleJS framework for reducing boilerplate when creating groups of streams.
⟡ erykpiast/cyclejs-wc ★2 (https://github.com/erykpiast/cyclejs-wc) - Utility for creating Web Components based on Cycle.js
⟡ ohanhi/hyperscript-helpers ★390 (https://github.com/ohanhi/hyperscript-helpers) - elm-html inspired helpers for writing hyperscript or virtual-hyperscript.
⟡ pH200/cycle-react ★342 (https://github.com/pH200/cycle-react) - use React instead of virtual-dom with a Cycle-like API
⟡ madcapjake/earlhyperscript ★2 (https://github.com/MadcapJake/earl-hyperscript) - A helper function and macro for using Earl Grey's document-building syntax (https://breuleux.github.io/earl-grey/doc.html#documentbuildingsyntax) with Cycle.js.
⟡ WorldMaker/cycle-gear ★4 (https://github.com/WorldMaker/cycle-gear) - A main function factory for Cycle based upon a formalization of Cycle's MVI pattern
⟡ SuperManitu/cyclejs-sortable ★15 (https://github.com/cyclejs-community/cyclejs-sortable) - Make everything sortable via drag and drop in only one line of code!
⟡ atomrc/cyclejs-auth0 ★22 (https://github.com/atomrc/cyclejs-auth0) - Everything you need to start playing with Auth0 on your Cyclejs app (Driver + component)
⟡ staltz/cycle-onionify ★244 (https://github.com/staltz/cycle-onionify) - Fractal state management for Cycle.js apps
⟡ maiermic/cycle-storageify ★5 (https://github.com/maiermic/cycle-storageify) - Augments your Cycle.js component (main function) by storing its onion-shaped state in local storage
⟡ shfrmn/cycle-lot (https://github.com/shfrmn/cycle-lot) - Handle dynamic lists of Cycle.js components with ease (full typesript support)
⟡ sarimarton/powercycle (https://powercycle.js.org) - Static VDOM composition and React-like development on top of Cycle.js
Boilerplates
⟡ andreloureiro/cyclejs-starter ★50 (https://github.com/andreloureiro/cyclejs-starter) - Cycle.js starter template with ES6 and Livereload.
⟡ Frikki/generator-cyclejs ★2 (https://github.com/Frikki/generator-cyclejs) - Scaffold out a Cycle.js Nested Dialogue module using Yeoman.
⟡ edge/cyc ★194 (https://github.com/edge/cyc) - Scaffold an isomorphic Cycle.js app in seconds.
⟡ cmdv/cycle-webpack-boilerplate ★101 (https://github.com/Cmdv/cycle-webpack-boilerplate) - Cycle app with routing, state handling and tests.
⟡ Widdershin/cycle-hot-reloading-example ★27 (https://github.com/Widdershin/cycle-hot-reloading-example) - A Cycle.js starter project with hot reloading using browserify-hmr
⟡ mciparelli/cycle-hmr-example ★0 (https://github.com/mciparelli/cycle-hmr-example) - A Cycle.js starter project using browserify and cycle-hmr
⟡ cycle-community/typescript-starter-cycle ★22 (https://github.com/cyclejs-community/typescript-starter-cycle) - A simple project for getting started with TypeScript in cycle.js, using Webpack. Has settings for Visual Studio Code as candy.
⟡ wyqydsyq/unicycle ★6 (https://github.com/wyqydsyq/unicycle) - A boilerplate universal Cycle app running on a Koa.js server with HMR and ServiceWorkers via Webpack
⟡ syarul/cycle-iso ★4 (https://github.com/syarul/cycle-iso) - A barebone boilerplate Cycle app with data stream base on promises and fetched with Falcor.js
⟡ snowpack-cycle (https://github.com/rajasegar/snowpack-cycle) - Snowpack app template to create Cycle.js projects with create-snowpack-app
Testing
⟡ erykpiast/cyclejs-mock ★22 (https://github.com/erykpiast/cyclejs-mock) - Utility for testing applications based on CycleJS framework.
⟡ jeysal/pretty-format-snabbdom ★0 (https://github.com/jeysal/pretty-format-snabbdom) - A pretty-format (https://github.com/facebook/jest/tree/master/packages/pretty-format) (Jest (https://facebook.github.io/jest/) snapshot) plugin for rendering
snapshots of snabbdom VNodes as nicely as those of React elements
Debugging
⟡ cyclejs/cycle-time-travel ★213 (https://github.com/cyclejs/cycle-time-travel) - A time travelling debugger for Cycle.js apps. Displays a stream visualizer that you can drag to go back in time.
Components
⟡ erykpiast/autocompleted-select ★10 (https://github.com/erykpiast/autocompleted-select) - Select Web Component with autocompletion. Based on RxJS and VirtualDOM.
⟡ enten/cyclejs-calendar ★11 (https://github.com/enten/cyclejs-calendar) - Calendar component for Cycle.js. Try it online here (http://enten.github.io/cyclejs-calendar/example).
⟡ mciparelli/cyclejs-gravatar ★0 (https://github.com/mciparelli/cyclejs-gravatar) - Cycle.js component for rendering a gravatar profile image.
⟡ tommy-the-runner/cyclejs-ace-editor ★0 (https://github.com/tommy-the-runner/cyclejs-ace-editor) - Cycle.js intergration with Ace Editor using brace (https://github.com/thlorenz/brace). Check an example here
(https://tommy-the-runner.github.io/cyclejs-ace-editor/).
⟡ raquelxmoss/cycle-color-picker ★44 (https://github.com/raquelxmoss/cycle-color-picker) - A Color Picker component for Cycle.js. Check out the example (https://raquelxmoss.github.io/cycle-color-picker).
⟡ cyclejs-community/cycle-svg-pan-and-zoom ★4 (https://github.com/cyclejs-community/cycle-svg-pan-and-zoom) - A Google Maps style SVG pan and zoom component for Cycle.js
Community
⟡ Gitter chat (https://gitter.im/cyclejs/cycle-core) - Ask 'how do I ...?'
License
!CC0 (http://i.creativecommons.org/p/zero/1.0/88x31.png) (http://creativecommons.org/publicdomain/zero/1.0/)
cyclejs Github: https://github.com/cyclejs-community/awesome-cyclejs
A collection of awesome Cycle.js tools, resources, videos and shiny things.
- Learn (#learn)
- Documentation (#documentation)
- Tutorials (#tutorials)
- Videos (#videos)
- Slides (#slides)
- Example Applications (#example-applications)
- Tools (#tools)
- CLI (#cli)
- Libraries (#libraries)
- Drivers (#drivers)
- Boilerplates (#boilerplates)
- Testing (#testing)
- Debugging (#debugging)
- Components (#components)
- Community (#community)
――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――
Learn
Documentation
⟡ cycle.js.org (http://cycle.js.org/) - Cycle.js official tutorial and documentation.
Tutorials
⟡ What Developers Need to Know about MVI (Model-View-Intent) (http://thenewstack.io/developers-need-know-mvi-model-view-intent/) - Post on MVI architecture.
⟡ Cycle.js: a reactive framework (https://lucamezzalira.com/2016/05/23/cycle-js-a-reactive-framework/) - Introduction to Cycle.js with real time data example.
⟡ Building realtime applications with CycleJS and RxJS (https://blog.pusher.com/building-realtime-applications-with-cyclejs-and-rxjs/) - Learn how to build realtime applications with CycleJS and RxJS
⟡ Working with HTTP Streams with Cycle.js (http://ivanjov.com/working-with-http-streams-with-cycle-js/) - Learn how to use Cycle.js to handle HTTP requests and responses
Videos
⟡ What if the user was a function? (https://www.youtube.com/watch?v=1zj7M1LnJV4) - Presentation at JSConf BP2015 by Andre Staltz (https://twitter.com/andrestaltz)
⟡ Unidirectional data flow architectures (https://vimeo.com/168652278) - Presentation AtTheFrontend Conference by Andre Staltz (https://twitter.com/andrestaltz)
⟡ Cycle.js and functional reactive user interfaces (https://www.youtube.com/watch?v=uNZnftSksYg) - Presentation at ReactiveConf 2015 by Andre Staltz (http://twitter.com/andrestaltz)
⟡ Intro to Functional Reactive Programming with Cycle.js (https://www.youtube.com/watch?v=6_ETUyh0tns) - Presentation by Nick Johnstone (https://twitter.com/widdnz)
⟡ Cycle.js Fundamentals (https://egghead.io/series/cycle-js-fundamentals) - Playlist at egghead.io (https://egghead.io)
⟡ Cycle.js was built to solve problems (https://www.youtube.com/watch?v=Rj8ZTRVka4E) - by Andre Staltz at Frontend.fi (http://frontend.fi/)
⟡ Brains as Building Blocks (https://www.youtube.com/watch?v=1ToJ7cxb1R8) - by Andre Staltz at CycleConf 2016 (http://cycleconf.com/)
⟡ Back to the Future, Hot reloading with Cycle.js (https://www.youtube.com/watch?v=rbrnyC5fXMM) - by Nick Johnstone at CycleConf 2016 (http://cycleconf.com/)
⟡ From MVC to FRP (https://www.youtube.com/watch?v=-PCq4pXaDZw) - by Gleb Bahmutov at CycleConf 2016 (http://cycleconf.com/)
⟡ Cycle.js on the bash side (https://www.youtube.com/watch?v=Rx5N99TQ52g) - by Hadrien de Cuzey at CycleConf 2016 (http://cycleconf.com/)
⟡ Reactive Programming with Cycle.js (https://vimeo.com/175121069) - by Luca Mezzalira at JSDay 2016 (http://2016.jsday.it/)
⟡ Learning how to ride: an introduction to Cycle.js (https://youtu.be/31URmaeNHSs) - by Fernando Macias Pereznieto at JS Monthly London (http://www.meetup.com/js-monthly-london/)
⟡ User Interfaces as Pure Functions of Time (https://www.youtube.com/watch?v=9BG0Y3C6WqM) - Lightning talk by Thomas Belin (http://twitter.com/atomrc) at dotjs 2016 (http://dotjs.io/)
Slides
⟡ Cycle.js an honestly reactive framework for web user interfaces (http://slides.com/erykpiast/cycle) - by Eryk Napierała
⟡ Intro to Cycle.js (http://www.slideshare.net/aryelukashevski/cyclejs-introduction) - by Arye Lukashevki
⟡ Reactive Programming with Cycle.js (http://www.slideshare.net/flashplatform/reactive-programming-with-cyclejs) - by Luca Mezzalira
⟡ Cycle.js - building apps with streams only (http://lmatteis.github.io/cyclejs-slides/keynote/index.html) - by Luca Matteis
⟡ Functional Reactive Programming with Cycle.js (https://slides.com/artfuldev/frp-with-cycle-js) - by Sudarsan Balaji
⟡ Beyond flux: going full cycle with FRP (https://clementd-files.cellar.services.clever-cloud.com/blog/frp-full-cycle-ncrafts.html) - by Clément Delafargue (http://clementd.cleverapps.io/)
Example Applications
⟡ cyclejs/cycle-examples (https://github.com/cyclejs/cyclejs/tree/master/examples) - Official collection of small Cycle.js examples
⟡ Widdershin/tricycle ★23 (https://github.com/Widdershin/tricycle) - Scratchpad for trying out Cycle.js, relies on Ace Editor with Cycle
⟡ cgeorg/todomvp ★21 (https://github.com/cgeorg/todomvp) - Minimum Viable Pizza, an example webapp written in Cycle.js
⟡ erykpiast/cyclejs-examples ★9 (https://github.com/erykpiast/cyclejs-examples) - Example web applications built with Cycle.js.
⟡ grozen/trends-cycle ★3 (https://github.com/grozen/trends-cycle) - Slack trend searching written in Cycle.js
⟡ ivan-kleshnin/cyclejs-examples ★120 (https://github.com/ivan-kleshnin/cyclejs-examples) - Collection of CycleJS examples, ES6.
⟡ ivan-kleshnin/tetris-cyclejs ★12 (https://github.com/ivan-kleshnin/tetris-game) - Tetris game implemented in CycleJS, ES6
⟡ phadej/graafi ★20 (https://github.com/phadej/graafi) - Cycle.js experiment with SVG and global undo/redo
http://oleg.fi/graafi/
⟡ staltz/matrixmultiplication.xyz ★548 (https://github.com/staltz/matrixmultiplication.xyz) - A interactive matrix multiplication webapp (http://matrixmultiplication.xyz/)
⟡ staltz/rxmarbles ★2,577 (https://github.com/staltz/rxmarbles) - Interactive diagrams of Rx Observables http://rxmarbles.com/
⟡ MarcCloud/magic-cart ★6 (https://github.com/MarcCloud/magic-cart) - Simple shopping cart of a magic creatures store.
⟡ foxdonut/cycle-todolist ★11 (https://github.com/foxdonut/cycle-todolist) - demonstrates a simple Cycle.js TODO list app with CRUD.
⟡ Mercateo/component-check ★468 (https://github.com/Mercateo/component-check) - Common patterns for building Cycle.js components
⟡ edge/electron-cycle-media ★27 (https://github.com/edge/electron-cycle-media) - Media player written with Cycle.js and Electron.
⟡ kibin/cycle-example-who-to-follow ★16 (https://github.com/kibin/cycle-example-who-to-follow) - Small example partly implements twitter’s who to follow box using github api.
⟡ SkaterDad/cycle-snabbdom-examples ★12 (https://github.com/SkaterDad/cycle-snabbdom-examples) - Examples of nested components, using snabbdom-specific animations.
⟡ bahmutov/draw-cycle ★112 (https://github.com/bahmutov/draw-cycle) - Interactive visualization of counter application showing the data flow inside a MVI component glebbahmutov.com/draw-cycle (https://glebbahmutov.com/draw-cycle/)
⟡ andreloureiro/pomocycle ★21 (https://github.com/andreloureiro/pomocycle) - A simple Pomodoro timer.
⟡ laszlokorte/tams-tools ★24 (https://github.com/laszlokorte/tams-tools) - A set of tools for teaching and learning computer science built with cycle.js.
⟡ lucamezzalira/jsday-cycle-js ★16 (https://github.com/lucamezzalira/jsday-cycle-js) - Reactive Live London Tube trains status example built with Cycle.js.
⟡ cyclejs-community/built-with-cycle ★9 (https://github.com/cyclejs-community/built-with-cycle) - A website (http://cyclejs-community.github.io/built-with-cycle) to showcase the cool projects built with Cycle.js
⟡ class-ideas/cyclejs-hangman ★10 (https://github.com/class-ideas/cyclejs-hangman) - A hangman game built with Cycle.js
⟡ wmaurer/cyclejs-fractals ★15 (https://github.com/wmaurer/cyclejs-fractals) - Dancing pythagorean tree fractal - Animating 2048 SVG nodes.
⟡ fabiothiroki/cyclejs-starwars ★2 (https://github.com/fabiothiroki/cyclejs-starwars) - A Star Wars character search app using Cycle.js, RxJS and Virtual DOM tests.
⟡ staltz/mmmmm-mobile ★124 (https://github.com/staltz/mmmmm-mobile/) - A React Native + Cycle.js app to implement a social network on Secure Scuttlebutt networks
⟡ cyclejs/todomvc-cycle ★214 (https://github.com/cyclejs/todomvc-cycle/) - TodoMVC example (https://cyclejs.github.io/todomvc-cycle/) implemented in Cycle.js
⟡ jefersondaniel/cyclejs-notes (https://github.com/jefersondaniel/cyclejs-notes/) - Notes app using Cycle.js and Orbit.js https://jefersondaniel.com/cyclejs-notes
⟡ staltz/dat-installer ★77 (https://github.com/staltz/dat-installer) - Download, install, and update Android apps through Dat
⟡ usm4n/cycle-hn ★25 (https://github.com/usm4n/cycle-hn) - Hackernews Clone Using CycleJS
⟡ lizraeli/cycle-github-emojis (https://github.com/lizraeli/cycle-github-emojis) - A github emoji viewer made with Cycle.JS webapp (https://github-emoji.levizraelit.com/)
⟡ perjerz3434/meetup.com ★1 (https://github.com/perjerz3434/meetup.com) - Meetup.com RSVP visualization around the world using CycleJS
Tools
CLI
⟡ cyclejs-community/create-cycle-app ★160 (https://github.com/cyclejs-community/create-cycle-app) - Create Cycle.js apps with no build configuration.
Libraries
Drivers
⟡ @cycle/http (https://github.com/cyclejs/cyclejs/tree/master/http) - A Cycle.js Driver for making HTTP requests, based on superagent.
⟡ @cycle/dom (https://github.com/cyclejs/cyclejs/tree/master/dom) - A Cycle.js driver to enable interaction with the DOM. The driver is based on snabbdom as the Virtual DOM library.
⟡ @cycle/storage (https://github.com/cyclejs/storage) - A Cycle.js Driver for using localStorage and sessionStorage.
⟡ @cycle/history (https://github.com/cyclejs/cyclejs/tree/master/history) - This is the standard Cycle.js driver for dealing with the History API (https://developer.mozilla.org/en-US/docs/Web/API/History_API)
⟡ @cycle/isolate (https://github.com/cyclejs/cyclejs/tree/master/isolate) - A utility function to make scoped dataflow components in Cycle.js.
⟡ @cycle/time (https://github.com/cyclejs/cyclejs/tree/master/time) - Fast and beautiful tests and time management for Cycle.js
⟡ cyclejs/cycle-notification-driver ★20 (https://github.com/cyclejs/cycle-notification-driver) - A Cycle.js Driver for showing and responding to HTML5 Notifications.
⟡ axefrog/cycle-router5 ★30 (https://github.com/axefrog/cycle-router5) - A router driver using Router5
⟡ cgeorg/cycle-socket.io ★27 (https://github.com/cgeorg/cycle-socket.io) - A Cycle driver for Socket.IO clients
⟡ secobarbital/cycle-fetch-driver ★2 (https://github.com/secobarbital/cycle-fetch-driver) - A Cycle.js Driver for making HTTP requests, using the Fetch API.
⟡ r7kamura/cycle-fetcher-driver ★14 (https://github.com/r7kamura/cycle-fetcher-driver) - A Cycle.js Driver for making HTTP requests using stackable-fetcher (https://github.com/r7kamura/stackable-fetcher).
⟡ benji6/cycle-audio-graph ★12 (https://github.com/benji6/cycle-audio-graph) - A Cycle.js Driver for manipulating the Web Audio API using virtual-audio-graph (https://github.com/benji6/virtual-audio-graph)
⟡ CyclicMaterials/cycle-hammer-driver ★11 (https://github.com/CyclicMaterials/cycle-hammer-driver) - A Cycle.js driver to wrap Hammer.js and detect touch gestures
⟡ jessaustin/cycle-sse-driver ★6 (https://github.com/jessaustin/cycle-sse-driver) - Source driver for Server-Sent Events/EventSource.
⟡ tylors/cycle-snabbdom ★41 (https://github.com/TylorS/cycle-snabbdom) - DOM driver using Snabbdom
⟡ cyclejs-community/cyclic-router ★90 (https://github.com/cyclejs-community/cyclic-router) - Router Driver built for Cycle.js
⟡ Widdershin/cycle-animation-driver ★33 (https://github.com/Widdershin/cycle-animation-driver) - Cycle driver for requestAnimationFrame
⟡ dralletje/cycle-firebase ★21 (https://github.com/dralletje/cycle-firebase) - A Cycle.js Driver for Firebase
⟡ edge/cycle-blessed ★46 (https://github.com/edge/cycle-blessed) - A Cycle.js Driver for terminal applications
⟡ 10clouds/cyclejs-cookie ★2 (https://github.com/10clouds/cyclejs-cookie) - Cookies Driver for Cycle.js
⟡ whitecolor/cycle-async-driver ★25 (https://github.com/whitecolor/cycle-async-driver) - Factory for creating async request/response cycle.js drivers
⟡ raquelxmoss/cycle-keys ★35 (https://github.com/raquelxmoss/cycle-keys) - Driver for keyboard events
⟡ rektide/recyclec ★0 (https://github.com/rektide/recyclec) - Readline driver
⟡ goodmind/cycle-telegram ★15 (https://github.com/goodmind/cycle-telegram) - A Cycle.js Driver for Telegram Bot API
⟡ apoco/cycle-electron-driver ★22 (https://github.com/apoco/cycle-electron-driver) - Driver to interact with Electron interface from Cycle.js application
⟡ rkrupinski/cyclejs-animated-localstorage ★12 (https://github.com/rkrupinski/cyclejs-animated-localstorage) - A Cycle.js driver for animating (srsly) localStorage.
⟡ cyclejs-community/cycle-keyboard ★9 (https://github.com/cyclejs-community/cycle-keyboard) - A keyboard driver for cycle.js
⟡ garrydzeng/cycle-page ★3 (https://github.com/garrydzeng/cycle-page) - A tiny client-side router for Cycle.js
⟡ jbowden1982/cycle-socketcluster ★5 (https://github.com/jbowden1982/cycle-socketcluster) - A socketcluster driver for Cycle.js
⟡ cyclejs-community/redux-cycles ★599 (https://github.com/cyclejs-community/redux-cycles) - A Redux middleware that allows you to handle actions lifecycle with Cycle.js
⟡ JuniperChicago/cycle-gun ★18 (https://github.com/JuniperChicago/cycle-gun) - A basic Cycle.js driver wrapping a gun.js instance allowing graph storage and p2p sync
⟡ EnigmaCurry/cycle-deepstream ★8 (https://github.com/EnigmaCurry/cycle-deepstream) - A Cycle.js driver for deepstream.io (https://deepstream.io)
⟡ Alex0007/cycle-express-driver ★1 (https://github.com/Alex0007/cycle-express-driver) - A Cycle.js driver for Express.js server
⟡ mrpierrot/cycle-node-http-server ★4 (https://github.com/mrpierrot/cycle-node-http-server) - A Cycle.js driver for Node.js HTTP(S) server
⟡ mrpierrot/cycle-net ★0 (https://github.com/mrpierrot/cycle-net) - A Cycle.js driver for Node.js HTTP(S)/WS(S)/Socket.io server
⟡ Avalander/cycle-idb ★4 (https://github.com/Avalander/cycle-idb) - A Cycle.js driver wrapping IndexedDB
⟡ unhappychoice/cycle-pusher ★1 (https://github.com/unhappychoice/cycle-pusher) - A Cycle.js driver for Pusher (https://pusher.com/)
⟡ helmoski/cycle-selection-driver (https://github.com/helmoski/cycle-selection-driver) - A Cycle.js driver for interacting with the Selection API (https://developer.mozilla.org/en-US/docs/Web/API/Selection)
⟡ mjyc/cycle-posenet-driver ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/3rdparty/cycle-posenet-driver) - A Cycle.js drivers for pose detection using TensorFlow.js (https://js.tensorflow.org/)-powered PoseNet
(https://github.com/tensorflow/tfjs-models/tree/master/posenet)
⟡ @cycle-robot-drivers/speech ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/speech) - Cycle.js drivers for speech synthesis and recognition using Web Speech API (https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API)
⟡ @cycle-robot-drivers/sound ★1 (https://github.com/mjyc/cycle-robot-drivers/tree/master/sound) - A Cycle.js driver for playing sounds using HTMLAudioElement (https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement)
Utilities
⟡ staltz/chai-virtual-dom ★24 (https://github.com/staltz/chai-virtual-dom) - Chai assertion helpers to test virtual-dom VTrees
⟡ cgeorg/sinject ★10 (https://github.com/cgeorg/sinject) - a dependency injection tool supporting Cycle's circular dependencies
⟡ erykpiast/cyclejs-group ★20 (https://github.com/erykpiast/cyclejs-group) - Utility for CycleJS framework for reducing boilerplate when creating groups of streams.
⟡ erykpiast/cyclejs-wc ★2 (https://github.com/erykpiast/cyclejs-wc) - Utility for creating Web Components based on Cycle.js
⟡ ohanhi/hyperscript-helpers ★390 (https://github.com/ohanhi/hyperscript-helpers) - elm-html inspired helpers for writing hyperscript or virtual-hyperscript.
⟡ pH200/cycle-react ★342 (https://github.com/pH200/cycle-react) - use React instead of virtual-dom with a Cycle-like API
⟡ madcapjake/earlhyperscript ★2 (https://github.com/MadcapJake/earl-hyperscript) - A helper function and macro for using Earl Grey's document-building syntax (https://breuleux.github.io/earl-grey/doc.html#documentbuildingsyntax) with Cycle.js.
⟡ WorldMaker/cycle-gear ★4 (https://github.com/WorldMaker/cycle-gear) - A main function factory for Cycle based upon a formalization of Cycle's MVI pattern
⟡ SuperManitu/cyclejs-sortable ★15 (https://github.com/cyclejs-community/cyclejs-sortable) - Make everything sortable via drag and drop in only one line of code!
⟡ atomrc/cyclejs-auth0 ★22 (https://github.com/atomrc/cyclejs-auth0) - Everything you need to start playing with Auth0 on your Cyclejs app (Driver + component)
⟡ staltz/cycle-onionify ★244 (https://github.com/staltz/cycle-onionify) - Fractal state management for Cycle.js apps
⟡ maiermic/cycle-storageify ★5 (https://github.com/maiermic/cycle-storageify) - Augments your Cycle.js component (main function) by storing its onion-shaped state in local storage
⟡ shfrmn/cycle-lot (https://github.com/shfrmn/cycle-lot) - Handle dynamic lists of Cycle.js components with ease (full typesript support)
⟡ sarimarton/powercycle (https://powercycle.js.org) - Static VDOM composition and React-like development on top of Cycle.js
Boilerplates
⟡ andreloureiro/cyclejs-starter ★50 (https://github.com/andreloureiro/cyclejs-starter) - Cycle.js starter template with ES6 and Livereload.
⟡ Frikki/generator-cyclejs ★2 (https://github.com/Frikki/generator-cyclejs) - Scaffold out a Cycle.js Nested Dialogue module using Yeoman.
⟡ edge/cyc ★194 (https://github.com/edge/cyc) - Scaffold an isomorphic Cycle.js app in seconds.
⟡ cmdv/cycle-webpack-boilerplate ★101 (https://github.com/Cmdv/cycle-webpack-boilerplate) - Cycle app with routing, state handling and tests.
⟡ Widdershin/cycle-hot-reloading-example ★27 (https://github.com/Widdershin/cycle-hot-reloading-example) - A Cycle.js starter project with hot reloading using browserify-hmr
⟡ mciparelli/cycle-hmr-example ★0 (https://github.com/mciparelli/cycle-hmr-example) - A Cycle.js starter project using browserify and cycle-hmr
⟡ cycle-community/typescript-starter-cycle ★22 (https://github.com/cyclejs-community/typescript-starter-cycle) - A simple project for getting started with TypeScript in cycle.js, using Webpack. Has settings for Visual Studio Code as candy.
⟡ wyqydsyq/unicycle ★6 (https://github.com/wyqydsyq/unicycle) - A boilerplate universal Cycle app running on a Koa.js server with HMR and ServiceWorkers via Webpack
⟡ syarul/cycle-iso ★4 (https://github.com/syarul/cycle-iso) - A barebone boilerplate Cycle app with data stream base on promises and fetched with Falcor.js
⟡ snowpack-cycle (https://github.com/rajasegar/snowpack-cycle) - Snowpack app template to create Cycle.js projects with create-snowpack-app
Testing
⟡ erykpiast/cyclejs-mock ★22 (https://github.com/erykpiast/cyclejs-mock) - Utility for testing applications based on CycleJS framework.
⟡ jeysal/pretty-format-snabbdom ★0 (https://github.com/jeysal/pretty-format-snabbdom) - A pretty-format (https://github.com/facebook/jest/tree/master/packages/pretty-format) (Jest (https://facebook.github.io/jest/) snapshot) plugin for rendering
snapshots of snabbdom VNodes as nicely as those of React elements
Debugging
⟡ cyclejs/cycle-time-travel ★213 (https://github.com/cyclejs/cycle-time-travel) - A time travelling debugger for Cycle.js apps. Displays a stream visualizer that you can drag to go back in time.
Components
⟡ erykpiast/autocompleted-select ★10 (https://github.com/erykpiast/autocompleted-select) - Select Web Component with autocompletion. Based on RxJS and VirtualDOM.
⟡ enten/cyclejs-calendar ★11 (https://github.com/enten/cyclejs-calendar) - Calendar component for Cycle.js. Try it online here (http://enten.github.io/cyclejs-calendar/example).
⟡ mciparelli/cyclejs-gravatar ★0 (https://github.com/mciparelli/cyclejs-gravatar) - Cycle.js component for rendering a gravatar profile image.
⟡ tommy-the-runner/cyclejs-ace-editor ★0 (https://github.com/tommy-the-runner/cyclejs-ace-editor) - Cycle.js intergration with Ace Editor using brace (https://github.com/thlorenz/brace). Check an example here
(https://tommy-the-runner.github.io/cyclejs-ace-editor/).
⟡ raquelxmoss/cycle-color-picker ★44 (https://github.com/raquelxmoss/cycle-color-picker) - A Color Picker component for Cycle.js. Check out the example (https://raquelxmoss.github.io/cycle-color-picker).
⟡ cyclejs-community/cycle-svg-pan-and-zoom ★4 (https://github.com/cyclejs-community/cycle-svg-pan-and-zoom) - A Google Maps style SVG pan and zoom component for Cycle.js
Community
⟡ Gitter chat (https://gitter.im/cyclejs/cycle-core) - Ask 'how do I ...?'
License
!CC0 (http://i.creativecommons.org/p/zero/1.0/88x31.png) (http://creativecommons.org/publicdomain/zero/1.0/)
cyclejs Github: https://github.com/cyclejs-community/awesome-cyclejs