kdichev

// bad
<div
	className={`miniBook__tab miniBook__tabOneWay${oneWay ? ' miniBook__tab--active' : ''}`}
	onClick={() => this.tabOnClick(oneWay)}
>
	{children}
</div>

// better
<div

kdichev

// that needs to become something readable for a pathfinding algorithm like
// [
//    [0, 0, 0, 1, 0],
//    [1, 0, 0, 0, 1],
//    [0, 0, 1, 0, 0],
// ]

const apiData = [
    [
      "west",

kdichev

// data contains width * height walkable path entries
// each entry has at most two walls "west" | "north"
// to find all walkable directions from X use the array entries X, X+1 and X+width to construct walls

// grid is 15x15 blocks
const data = [["west","north"],["north"],["west","north"],["north"],["north"],["west","north"],["north"],["north"],["west","north"],["north"],["north"],["north"],["west","north"],["north"],["north"],["west","north"],["west"],["west"],["north"],["west"],["west"],["west"],["west"],["north"],["north"],[],["west"],["north"],["north"],[],["west"],[],["west"],["west"],["north"],[],["west"],["north"],["north"],["west","north"],["north"],[],["west","north"],["north"],["west"],["west"],["north"],["north"],["west"],["north"],["north"],["north"],["north"],["west"],["north"],["north"],["north"],["west"],["west"],["west"],["west","north"],["north"],["west"],["west"],["west","north"],["north"],["north"],["west"],["west","north"],["north"],["west"],["west"],[],["west"],["north"],["west"],["west

kdichev

const data = [
    [
      'west',
      'north'
    ],
    [
      'north'
    ],
    [
      'north'

kdichev

mutation {
  createCar(
    name: "car" 
    carBrand: "Mercedes-Benz" 
    carMode: "C63 AMG" 
    carYear: "2018-06-19T19:51:13.701Z"
  ) {
    id
    carBrand
  }

kdichev

const asyncAction = (dataMaybe) => async (dispatch, getState) => {
  // u can dispatch all kinds of actions here according to outcome
  dispatch({type: "FETCHING_START"} 
  
  // if u need to use store data but can be passed as arg from react component when invoking
  const store = getState().theReducer 
  const response = await myFetchFunction()
  
  if (response) {
    dispatch({type: "FETCHING_SUCCESS", payload: {response}}

kdichev

import { connect } from "react-redux";

const mapStateToProps = ({
  theReducer: { city, humidity, temperature, wind }
}) => ({
  city, 
  humidity, 
  temperature, 
  wind
});

kdichev

import { combineReducers } from "redux";

const initialState = {
  hi: "hi"
};

export const theReducer = (state = initialState, action) => {
  switch (action.type) {
    case "SOMETHING_HAPPENING":
      return { ...state, hi: "bye" };

kdichev

import { createStore, applyMiddleware, compose } from "redux";
import thunkMiddleware from "redux-thunk";

const configureStore = (initialState) =>
  createStore(
    // here reducers
    // REDUCERS.js
    persistedState,
    compose(
      applyMiddleware(

kdichev

import React from 'react'

// simple stateless component (children is reserved word)
const DisplayHelloWorld = (props) => (
  <div>
    message: {props.children}
    name: {props.name}
  </div>
)