acdlite

Demo: Coordinating async React with non-React views

tl;dr I built a demo illustrating what it might look like to add async rendering to Facebook's commenting interface, while ensuring it appears on the screen simultaneous to the server-rendered story.

A key benefit of async rendering is that large updates don't block the main thread; instead, the work is spread out and performed during idle periods using cooperative scheduling.

But once you make something async, you introduce the possibility that things may appear on the screen at separate times. Especially when you're dealing with multiple UI frameworks, as is often the case at Facebook.

How do we solve this with React?

fdaciuk

Create Reducer

Less boilerplate when create a new reducer on Redux

Method:

'use strict'

const createReducer = (initialState, actionHandlers) => {

JCMais

// @flow

// https://github.com/FormidableLabs/react-native-svg-mock
import React from 'react';

const createComponent = function(name: string) {
  return class extends React.Component {
    // overwrite the displayName, since this is a class created dynamically
    static displayName = name;

chourobin

Bridging Native & React for iOS & Android

js -> native

• Simple Example
• Callbacks
• Promises
• Properties

native -> js

mjackson

// using createRouteElement
import { Route, createRouteElement } from 'react-router'

const RouteWithQuery = (routeProps) => (
  <Route {...routeProps} render={props => (
    const query = parseQueryString(props.history.location.search)
    return createRouteElement({ ...routeProps, ...props, query })
  )}/>
)

nrollr

Install MongoDB on macOS Sierra

This procedure explains how to install MongoDB using Homebrew on macOS Sierra 10.12.
Official MongoDB install documentation: here

Install Homebrew

• Installing Homebrew is effortless, open Terminal and enter :
  $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

mjackson

// Here is a function that I use all the time when creating public
// async APIs in JavaScript:
const resolvePromise = (promise, callback) => {
  if (callback)
    promise.then(value => callback(null, value), callback)

  return promise
}

// Sometimes I like to use callbacks, but other times a promise is

jarretmoses

RN < 0.50 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache
RN >= 0.50 -  watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* && rm -rf $TMPDIR/metro-bundler-cache-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache
RN >= 0.63 - watchman watch-del-all && rm -rf node_modules && npm install && rm -rf /tmp/metro-* && npm run start --reset-cache

npm >= 5 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache verify && npm install && npm start -- --reset-cache

Windows - del %appdata%\Temp\react-native-* & cd android & gradlew clean & cd .. & del node_modules/ & npm cache clean --force & npm install & npm start -- --reset-cache

mmazzarolo

# iOS
app_identifier "com.myapp.app" # The bundle identifier of your app
apple_id "[email protected]" # Your Apple email address
team_id "1234ABCD"  # Developer Portal Team ID

# Android
json_key_file "./google-play-api-secret.json" # Path to the json secret file - Follow https://github.com/fastlane/supply#setup to get one
package_name "com.myapp.app" # Your Android app package

cmcewen

var CryptoJS = require('crypto-js');

function uploadImage(uri) {
  let timestamp = (Date.now() / 1000 | 0).toString();
  let api_key = 'your api key'
  let api_secret = 'your api secret'
  let cloud = 'your cloud name'
  let hash_string = 'timestamp=' + timestamp + api_secret
  let signature = CryptoJS.SHA1(hash_string).toString();
  let upload_url = 'https://api.cloudinary.com/v1_1/' + cloud + '/image/upload'