AakashRaina

class ProgressiveImage extends React.Component {
  constructor(props) {
    super(props);
    this.placeholderAnimated = new Animated.Value(0);
    this.imageAnimated = new Animated.Value(0);
  }

  handlePlaceholderLoad = () => {
    Animated.timing(this.placeholderAnimated, {
      toValue: 1

AakashRaina

// The classic AJAX call - dispatch before the request, and after it comes back
function myThunkActionCreator(someValue) {
    return (dispatch, getState) => {
        dispatch({type : "REQUEST_STARTED"});
        
        myAjaxLib.post("/someEndpoint", {data : someValue})
            .then(
                response => dispatch({type : "REQUEST_SUCCEEDED", payload : response}),
                error => dispatch({type : "REQUEST_FAILED", error : error})
            );    

AakashRaina

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

1. Clarify and agree on the scope of the system

• User cases (description of sequences of events that, taken together, lead to a system doing something useful)
  • Who is going to use it?
  • How are they going to use it?

AakashRaina

// This is an advanced example! It is not intended for use in application code.
// Libraries like Relay may make use of this technique to save some time on low-end mobile devices.
// Most components should just initiate async requests in componentDidMount.

class ExampleComponent extends React.Component {
  _hasUnmounted = false;

  state = {
    externalData: null,
  };

AakashRaina

import React, { Component } from 'react';

// Create a context first of all //
const MyContext = React.createContext();

// Make a component class which returns the context using a provider //
class MyContextProvider extends Component {
  constructor(props) {
    super(props);

AakashRaina

// Enable component-scanning and auto-configuration with @SpringBootApplication Annotation
// It combines @Configuration + @ComponentScan + @EnableAutoConfiguration
@SpringBootApplication
public class FooApplication {
  public static void main(String[] args) {
    // Bootstrap the application
    SpringApplication.run(FooApplication.class, args);
  }
}

AakashRaina

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

---

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

---