Skip to content

Instantly share code, notes, and snippets.

View alfondotnet's full-sized avatar
๐Ÿ„โ€โ™‚๏ธ
๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„

Alfonso Embid-Desmet alfondotnet

๐Ÿ„โ€โ™‚๏ธ
๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„ ๐Ÿ„
View GitHub Profile

Usage

  1. npm install babel-loader imports-loader webpack --save
  2. Create webpack.config.js
  3. Move index.ios.js to src/index.ios.jsx
  4. webpack --watch

Example

src/index.ios.jsx

@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.

@nicolashery
nicolashery / rxjs-react.js
Last active August 1, 2022 03:36
Fetching data asynchronously with RxJS and React
import React from 'react';
import _ from 'lodash';
import Rx from 'rx';
import superagent from 'superagent';
let api = {
host: 'http//localhost:3001',
getData(query, cb) {
superagent
@PhilippKrone
PhilippKrone / calendar.js
Created August 20, 2015 09:54
Calendar based on react-native-calendar
'use strict';
var React = require('react-native');
var PropTypes = require('ReactPropTypes');
var Dimensions = require('Dimensions');
var moment = require('moment');
var Icon = require('react-native-vector-icons/Ionicons');
var config = require('../../config/config.js');
var {
@paulirish
paulirish / what-forces-layout.md
Last active August 15, 2025 09:34
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@staltz
staltz / slim-cycle-core.js
Created September 22, 2015 12:35
Cycle.js without sanity checks and comments in a single file. Don't use this, use normal Cycle.js. :-)
let Rx = require(`rx`)
function makeRequestProxies(drivers) {
let requestProxies = {}
for (let name in drivers) {
if (drivers.hasOwnProperty(name)) {
requestProxies[name] = new Rx.ReplaySubject(1)
}
}
return requestProxies
@lambdahands
lambdahands / _readme.md
Created September 28, 2015 17:09
FlowType and CSS Modules

Huh?

So basically FlowType doesn't know about CSS Modules, a really handy way of dealing with the plagues of CSS in codebases (global variables and dependency wackiness mainly).

What WebPack allows us to do is "require" CSS files and use their class names:

import styles from "my_styles.css";
import React from "react";

I thought it would be pertinent to respond to some points presented by Andrey "Rarst" Savchenko in recent post Progressive Enhancement.

Progressive Enhancement

Unlike Rarst, I don't value progressive enhancement very highly and don't agree it's a fundamental principle of the web that should be universally employed. Quite frankly, I don't care about not supporting JavaScript, and neither does virtually anyone else. It's not that it doesn't have any value, or utility - but in a world where we don't have unlimited resources and time, one has to prioritise what we'll support and not support.

I'm a proponent of putting my ideas and creations into the world for people to make use of; and if I had to cover 100% of use cases for doing that, I wouldn't put much out there. I'm fine with losing the 1.1% of

@satya164
satya164 / class-properties-to-methods.js
Created January 8, 2016 18:17
Codemod to convert class methods to properties, and remove `.bind(this)` in JSX props
// Codemod to convert class methods to properties, and remove `.bind(this)` in JSX props.
// Doesn't support Flow annotations yet
export default function(file, api) {
const j = api.jscodeshift;
const convertToClassProps = p => {
const node = p.node;
if (node.key.name.indexOf('_') === 0) {
node.type = 'ClassProperty';
@ethicalhack3r
ethicalhack3r / chrome-uri.txt
Last active February 20, 2024 03:02
Chrome 'protocol handlers' extracted from Google Chrome browser source code (chromium-50.0.2624.0.tar.xz downloaded from https://gsdview.appspot.com/chromium-browser-official/). A lot will not work, some are probably from unit tests.
chrome://-alkuisissa
chrome://-nettadresser
chrome://-webbadresser
chrome://ChromeTestChromeWebUIControllerFactory
chrome://DummyURL
chrome://URLs
chrome://about
chrome://accessibility
chrome://anything
chrome://app-list