Jakub Chodorowicz chodorowicz

Proposal for a lightning talk at the Reactive 2016 conference → https://reactiveconf.com

Star ⭐ the Gist to vote on this talk.

Move all your side effect to middleware using redux-saga

Redux saga is side effects middleware which allows us to orchestrate even very complex logical flows - think multiple AJAX request which depending on the responses, writing state to localstorage etc. More over it's output are descriptions of actions which can be later processed by middleware, which makes it pure and easily testable. This talk would be a short intro to redux-saga, which would hightlight benefits of concentrating all of side effect in one place and making both actions creators and sagas pure and easily testable.

	function initAnalytics() {
	(function(i,s,o,g,r,a,m) {i["GoogleAnalyticsObject"]=r;i[r]=i[r]\|\|function() {
	(i[r].q=i[r].q \|\|[]).push(arguments);},i[r].l= 1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m);
	})(window, document, "script", "//www.google-analytics.com/analytics.js", "ga");

	ga("create", "UA-XXXXXXXX-X", "auto");
	ga("send", "pageview");
	}

	<?php
	// based on, fixed warnings http://www.designtoday.info/removing-li-menu-from-wordpress/

	class Description_Walker extends Walker_Nav_Menu {
	function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
	$classes = empty($item->classes) ? array () : (array) $item->classes;
	$class_names = join(' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
	!empty ( $class_names ) and $class_names = ' class="'. esc_attr( $class_names ) . '"';
	$output .= "";
	$attributes = '';

	o/ o/ \ /
	\| \| \|
	/ \ / \ /o\

	L(・o・)」

	/**
	* dynamically loading all stories with .stories.js extension
	*/

	import { configure } from '@kadira/storybook';
	require('es6-promise').polyfill();
	import 'babel-polyfill';
	const stories = require.context('../app/js/components', true, /.stories.js$/);

	function loadStories() {

	require('dotenv').config({ silent: true });
	var express = require('express');
	var app = express();
	var port = process.env.PORT \|\| 3002;
	var smptSender = require('./smtp-sender');
	var bodyParser = require('body-parser')
	const compress = require('compression');
	const nunjucks = require('nunjucks');
	const isDeveloping = process.env.NODE_ENV !== 'production';

	// count elements
	// http://webdriver.io/api/protocol/elements.html
	browser.elements('.OrdersList .Row')
	.then(elements => {
	assert.equal(elements.value.length, 999);
	})

	/** attach event diretly to DOM element */
	var myelement = document.getElementById('my-div');
	myelement.onclick = function() {
	alert('Ouch!');
	}

	/** add event listener */
	var mypara = document.getElementById('my-div');
	mypara.addEventListener('click',
	function() {alert('Boo!')},

	const express = require('express');
	const nunjucks = require('nunjucks');

	const app = express();

	const nunjucksConfig = {
	autoescape: true,
	express: app
	};