Skip to content

Instantly share code, notes, and snippets.

View boopathi's full-sized avatar
💭
I may be slow to respond.

Boopathi Rajaa boopathi

💭
I may be slow to respond.
View GitHub Profile
@ohanhi
ohanhi / frp.md
Last active May 6, 2024 05:17
Learning FP the hard way: Experiences on the Elm language

Learning FP the hard way: Experiences on the Elm language

by Ossi Hanhinen, @ohanhi

with the support of Futurice 💚.

Licensed under CC BY 4.0.

Editorial note

@gaearon
gaearon / combining.js
Created June 3, 2015 18:03
Combining Stateless Stores
// ------------
// counterStore.js
// ------------
import {
INCREMENT_COUNTER,
DECREMENT_COUNTER
} from '../constants/ActionTypes';
const initialState = { counter: 0 };
@chantastic
chantastic / on-jsx.markdown
Last active May 13, 2025 12:04
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

@zxbodya
zxbodya / render-react-with-rxjs.md
Last active November 1, 2021 08:49
React with RxJS, reactive way :)

Observable React elements with RxJS

Note: if you want to skip history behind this, and just looking for final result see: rx-react-container

When I just started using RxJS with React, I was subscribing to observables in componentDidMount and disposing subscriptions at componentWillUnmount.

But, soon I realised that it is not fun to do all that subscriptions(that are just updating property in component state) manually, and written mixin for this...

Later I have rewritten it as "high order component" and added possibility to pass also obsarvers that will receive events from component.

@larahogan
larahogan / app-perf.md
Last active May 7, 2021 01:18
Native app performance metrics

Native app performance metrics

This is a draft list of what we're thinking about measuring in Etsy's native apps.

Currently we're looking at how to measure these things with Espresso and Kif (or if each metric is even possible to measure in an automated way). We'd like to build internal dashboards and alerts around regressions in these metrics using automated tests. In the future, we'll want to measure most of these things with RUM too.

Overall app metrics

  • App launch time - how long does it take between tapping the icon and being able to interact with the app?
  • Time to complete critical flows - using automated testing, how long does it take a user to finish the checkout flow, etc.?
  • Battery usage, including radio usage and GPS usage
  • Peak memory allocation
@boopathi
boopathi / README.md
Last active June 29, 2025 14:49
Creating a Swift-ReactNative project

Settings

  1. Create a project in XCode with the default settings
    • iOS > Application > Single View Application
    • Language: Swift
  2. Under project General settings, add ReactKit to Linked Framework and Libraries
    • + > Add Other... and choose /path/to/react-native/ReactKit/ReactKit.xcodeproj
  3. Now ReactKit would have been imported. Link it by choosing it from the list.
    • + > lib.ReactKit.a
  4. Under project Build Settings,
@sebmarkbage
sebmarkbage / Enhance.js
Last active June 19, 2025 19:41
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() {
var Bar1 = base => class extends base {
componentWillMount(){
super.componentWillMount();
console.log('Bar1');
}
};
var Bar2 = base => class extends base {
componentWillMount(){
super.componentWillMount();

2015-01-29 Unofficial Relay FAQ

Compilation of questions and answers about Relay from React.js Conf.

Disclaimer: I work on Relay at Facebook. Relay is a complex system on which we're iterating aggressively. I'll do my best here to provide accurate, useful answers, but the details are subject to change. I may also be wrong. Feedback and additional questions are welcome.

What is Relay?

Relay is a new framework from Facebook that provides data-fetching functionality for React applications. It was announced at React.js Conf (January 2015).

@steipete
steipete / ReactNative.js
Created January 29, 2015 10:33
Facebook Group App's ReactNative
This file has been truncated, but you can view the full file.
__SSTOKENSTRING = "@generated SignedSource<<dbe928e1275c495c1922c1bf063ffb70>>";
! function(e) {
function t(e) {
function t() {
var t = Array.prototype.map.call(arguments, function(e) {
if (null == e) return null === e ? "null" : "undefined";
if ("string" == typeof e) return '"' + e + '"';
try {
return JSON.stringify(e)
} catch (t) {