Skip to content

Instantly share code, notes, and snippets.

Goals:

  1. Provide smooth upgrade path
  2. Avoid npm install trolling
  3. Shed backwards compatibility quickly

Assumptions:

  1. Most package.json entries use ^ like this: ^1.0.0
  2. Many app test suites fail with console warnings, and therefore assume
var flattenObj = function (object, target, prefix) {
prefix = prefix || '';
return _(object).inject(function(result, value, key) {
if (_.isObject(value)) {
flattenObj(value, result, prefix + key + '.');
} else {
result[prefix + key] = value;
}
@lelandrichardson
lelandrichardson / ensureShallowPurity.js
Created September 12, 2017 23:00
safer react-redux
/* eslint no-restricted-syntax:0 */
const hasOwnProperty = Object.prototype.hasOwnProperty;
function shallowDifferences(a, b) {
const result = [];
if (a === b) {
return result;
}
@tkafka
tkafka / LICENSE.txt
Last active September 5, 2019 13:38
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:
@rikukissa
rikukissa / POST.md
Last active January 27, 2020 08:10
Unit testing Angular.js app with node.js, mocha, angular-mocks and jsdom #angular.js #testing
title slug createdAt language preview
Unit testing Angular.js app with node.js, mocha, angular-mocks and jsdom
unit-testing-angular-js-app-with-node
2015-07-05T18:04:33Z
en
Majority of search result about unit testing Angular.js apps is about how to do it by using test frameworks that run the tests in a real browser. Even though it's great to be able to test your code in multiple platforms, in my opinion it creates a lot of boilerplate code and makes it hard to run the tests in, for instance a CI-server.

Testing Angular.js app headlessly with node.js + mocha

Lean unit tests with minimal setup

@gaearon
gaearon / reducers.js
Last active December 11, 2020 14:56
How I'd do code splitting in Redux (pseudo code, not tested!)
import { combineReducers } from 'redux';
import users from './reducers/users';
import posts from './reducers/posts';
export default function createReducer(asyncReducers) {
return combineReducers({
users,
posts,
...asyncReducers
});
.
├── actions
├── stores
├── views
│   ├── Anonymous
│   │   ├── __tests__
│   │   ├── views
│   │   │   ├── Home
│   │   │   │   ├── __tests__
│   │   │   │   └── Handler.js
@bvaughn
bvaughn / react-lifecycle-cheatsheet.md
Last active March 2, 2023 13:29
React lifecycle cheatsheet

React lifecycle cheatsheet

Method Side effects1 State updates2 Example uses
Mounting
componentWillMount Constructor equivalent for createClass
render Create and return element(s)
componentDidMount DOM manipulations, network requests, etc.
Updating
componentWillReceiveProps Update state based on changed props
@anvk
anvk / promises_reduce.js
Last active October 11, 2023 09:02
Sequential execution of Promises using reduce()
function asyncFunc(e) {
return new Promise((resolve, reject) => {
setTimeout(() => resolve(e), e * 1000);
});
}
const arr = [1, 2, 3];
let final = [];
function workMyCollection(arr) {

This is a proposal for a lightning talk at the Reactive 2016 conference. If you like this, star the Gist.


Thinking metrics on React applications

In regular websites, it is common to send multiple events to track user clicks. Single Page Applications change the way you look at metrics. This is a talk about a simple pattern we created at Globo.com to manage a metrics layer for http://globoplay.globo.com. The talk will cover how to track user flow using Google Analytics and other services. We solved the challenge of tying metrics and components, keeping information across pages and having global data. Also some React, React Router and React Side Effects concepts like context, higher order components, history state will be covered.