Skip to content

Instantly share code, notes, and snippets.

anonymous
anonymous / palindrom_dm.js
Created May 31, 2016 13:55
'use strict'; // avoid ambiguity and sloppy errors
/**
* Tests whether or not a given string is a Palindrome
* @param {string} stringToTest - the string to test.
*/
function isPalindrome(stringToTest) {
var start = 0,
end;
@gaearon
gaearon / slim-redux.js
Last active May 5, 2024 15:14
Redux without the sanity checks in a single file. Don't use this, use normal Redux. :-)
function mapValues(obj, fn) {
return Object.keys(obj).reduce((result, key) => {
result[key] = fn(obj[key], key);
return result;
}, {});
}
function pick(obj, fn) {
return Object.keys(obj).reduce((result, key) => {
if (fn(obj[key])) {
@chantastic
chantastic / on-jsx.markdown
Last active May 30, 2024 13:11
JSX, a year in

Hi Nicholas,

I saw you tweet about JSX yesterday. It seemed like the discussion devolved pretty quickly but I wanted to share our experience over the last year. I understand your concerns. I've made similar remarks about JSX. When we started using it Planning Center, I led the charge to write React without it. I don't imagine I'd have much to say that you haven't considered but, if it's helpful, here's a pattern that changed my opinion:

The idea that "React is the V in MVC" is disingenuous. It's a good pitch but, for many of us, it feels like in invitation to repeat our history of coupled views. In practice, React is the V and the C. Dan Abramov describes the division as Smart and Dumb Components. At our office, we call them stateless and container components (view-controllers if we're Flux). The idea is pretty simple: components can't

@sebmarkbage
sebmarkbage / Enhance.js
Last active January 31, 2024 18:33
Higher-order Components
import { Component } from "React";
export var Enhance = ComposedComponent => class extends Component {
constructor() {
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {
@danthareja
danthareja / promises.js
Last active July 25, 2023 03:05
A conjurer's guide to promises
/*
* A quick example of how to use Bluebird and Q to conjure your own promises
*
* Everything going on here is explained further in the following video:
* http://youtu.be/OU7WuVGSuZw?list=PLT-DLWOBKbB4dZ83I_7Ca-sUTvorckG-E
*
*/
// Import node modules
var Q = require('q');
@koistya
koistya / ReactJS-Server-Side-Rendering.md
Last active September 15, 2023 07:32
Server-side Rendering (SSR) for ReactJS / Flux Applications. Setting document.title

Files

The basic structure of a React+Flux application (see other examples)

 - /src/actions/AppActions.js     - Action creators (Flux)
 - /src/components/Application.js - The top-level React component
 - /src/constants/ActionTypes.js  - Action types (Flux)
 - /src/core/Dispatcher.js        - Dispatcher (Flux)
 - /src/stores/AppStore.js        - The main store (Flux)
@tkafka
tkafka / LICENSE.txt
Last active May 17, 2024 02:08
Drop-in replacement for ReactCSSTransitionGroup that uses velocity.js instead of CSS transforms. Add your own transitions to `transitions` hash.
The MIT License (MIT)
Copyright (c) 2014 Tomas Kafka
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
@sebmarkbage
sebmarkbage / ElementFactoriesAndJSX.md
Last active May 17, 2022 11:06
New React Element Factories and JSX

New React Element Factories and JSX

In React 0.12, we're making a core change to how React.createClass(...) and JSX works.

If you're using JSX in the typical way for all (and only) React components, then this transition will be seamless. Otherwise there are some minor breaking changes described below.

The Problem

@spoike
spoike / reflux.js
Created June 29, 2014 22:23
A simpler implementation of React.JS's Flux
var EventEmitter = require('events').EventEmitter,
_ = require('lodash');
/**
* Creates an action functor object
*/
exports.createAction = function() {
var action = new EventEmitter(),
eventLabel = "action",
@staltz
staltz / introrx.md
Last active July 22, 2024 09:31
The introduction to Reactive Programming you've been missing