In this tutorial we're going to build a set of parser combinators.
We'll answer the above question in 2 steps.
- What is a parser?
- and, what is a parser combinator?
So first question: What is parser?
let cache = new Map(); | |
let pending = new Map(); | |
function fetchTextSync(url) { | |
if (cache.has(url)) { | |
return cache.get(url); | |
} | |
if (pending.has(url)) { | |
throw pending.get(url); | |
} |
Before reading: | |
This is a soft auth check. Auth check should always be done server side, if not, your rest api are not checking correctly for auth. | |
1. Auth is in the store. | |
You need to setup constants for AUTH_SET_TOKEN and AUTH_LOGOUT, | |
then create the action creators authSetToken(token) and authLogout() action creators. | |
Then setup a reducer that when AUTH_SET_TOKEN is dispatched, sets the internal state to {token: token}, | |
and when logout is dispatched, clears it. | |
Now setup a utility function isLoggedIn(state) function, that only checks in state.auth.token exists, this is a soft check. |
// give it a name so it reuses the same window | |
var win = window.open(null, "redux-devtools", "menubar=no,location=no,resizable=yes,scrollbars=no,status=no"); | |
// reload in case it's reusing the same window with the old content | |
win.location.reload(); | |
// wait a little bit for it to reload, then render | |
setTimeout(function() { | |
React.render( | |
<DebugPanel top right bottom left > |
// part of a pair of functions intended to isolate code that kills the optimizing compiler | |
// https://github.com/petkaantonov/bluebird/wiki/Optimization-killers#2-unsupported-syntax | |
function functionize(func, arg) { | |
switch (typeof func) { | |
case 'string': | |
return arg ? new Function(String(arg), func) : new Function(func); | |
case 'function': | |
return func; | |
default: | |
return function () {return func;}; |
// array utils | |
// ================================================================================================= | |
const combine = (...arrays) => [].concat(...arrays); | |
const compact = arr => arr.filter(Boolean); | |
const contains = (() => Array.prototype.includes | |
? (arr, value) => arr.includes(value) | |
: (arr, value) => arr.some(el => el === value) |
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
var gulp = require('gulp'); | |
var browserify = require('browserify'); | |
var notify = require('gulp-notify'); | |
var source = require('vinyl-source-stream'); | |
var watchify = require('watchify'); | |
var plumber = require('gulp-plumber'); | |
var less = require('gulp-less'); | |
var csso = require('gulp-csso'); | |
var watch = require('gulp-watch'); | |
var envify = require('envify'); |
(function() { | |
// Do not use this library. This is just a fun example to prove a | |
// point. | |
var Bloop = window.Bloop = {}; | |
var mountId = 0; | |
function newMountId() { | |
return mountId++; | |
} |
WebSockets is a modern HTML5 standard which makes communication between client and server a lot more simpler than ever. We are all familiar with the technology of sockets. Sockets have been fundamental to network communication for a long time but usually the communication over the browser has been restricted. The general restrictions