MaximeHeckel

// reducer.js
export const initialState = {
  data: null
};

const reducer = (state, action) => {
  const reduced = { ...state };
  switch (action.type) {
    case "FETCH_DATA":
      return {

MaximeHeckel

Page 0 appear

SWIPE

Page 1 appear

SWIPE

Page 2 appear

MaximeHeckel

import React from "react";


const Announcements = (props) => {
  return (
      <div aria-live="polite" aria-atomic="true" 
        className="visuallyhidden">
        {props.message}
      </div>
  );

MaximeHeckel

import { ThemeProvider as EmotionThemeProvider } from 'emotion-theming';
import React from 'react';
import themeDark from '../theme_dark';
import themeLight from '../theme_light';

interface InterfaceState {
  dark: boolean;
  toggleDark: () => void;
}

MaximeHeckel

const sequence = ['arg1', 'arg2','arg3'].reduce(async (previousPromise, nextArg) => {
  await previousPromise;
  return somePromise(nextArg)
}, Promise.resolve());

sequence
  .then(() => console.log('Done'))
  .catch((e) => console.error(`An error occured: ${e}`));

MaximeHeckel

import React, { useState, useContext, useEffect, createContext } from "react";
import logo from "./logo.svg";
import "./App.css";

const CounterContext = createContext(0);

const Hello = () => {
  // This avoids render props and the use of Context.Consumer
  // way easier!
  const count = useContext(CounterContext);

MaximeHeckel

import React, { Suspense, Fragment } from "react";
import { createCache, createResource } from "simple-cache-provider";

const cache = createCache();

const createFetcher = callback => {
  const resource = createResource(callback);
  return () => resource.read(cache);
};

MaximeHeckel

import React, { Component } from 'react';
import findByType from './findByType';
import css from './somestyle.css';
// We instantiate the Title sub-component
const Title = () => null;
class Article extends Component {
  // This is the function that will take care of rendering our Title sub-component
  renderTitle() {
    const { children } = this.props;
    // First we try to find the Title sub-component among the children of Article

MaximeHeckel

import React from 'react';
const findByType = (children, component) => {
  const result = [];
  /* This is the array of result since Article can have multiple times the same sub-component */
  const type = [component.displayName] || [component.name];
  /* We can store the actual name of the component through the displayName or name property of our sub-component */
  React.Children.forEach(children, child => {
    const childType =
      child && child.type && (child.type.displayName || child.type.name);
    if (type.includes(childType)) {

MaximeHeckel

// @flow
import React, { Component } from 'react';
import type { Node } from 'react';
import findByType from './findByType';
import css from './styles.css';

const Title = () => null;
const Subtitle = () => null;
const Metadata = () => null;
const Content = () => null;