Mary Rose Cook's notebook

The public parts of my notebook.

My homepage.

How people use their Nintendo Switches

How people use their Nintendo Switches


#notebook

Simple React patterns, Lucas Reis

Simple React patterns, Lucas Reis


Loading data cleanliness


Solo render function pattern

const PlanetView = ({ name, climate, terrain }) => (
  <div>
    <h2>{name}</h2>
    <div>Climate: {climate}</div>
    <div>Terrain: {terrain}</div>
  </div>
);



Patterns for when the model code doesn't need to be reused

Mixed component pattern



export default class Dagobah extends React.Component {
  state = { loading: true };

  componentDidMount() {
    fetch("https://swapi.co/api/planets/5")
      .then(res => res.json())
      .then(
        planet => this.setState({ loading: false, planet }),
        error => this.setState({ loading: false, error })
      );
  }

  renderLoading() {
    return <div>Loading...</div>;
  }

  renderError() {
    return <div>I'm sorry! Please try again.</div>;
  }

  renderPlanet() {
    const { name, climate, terrain } = this.state.planet;
    return (
      <div>
        <h2>{name}</h2>
        <div>Climate: {climate}</div>
        <div>Terrain: {terrain}</div>
      </div>
    );
  }

  render() {
    if (this.state.loading) {
      return this.renderLoading();
    } else if (this.state.planet) {
      return this.renderPlanet();
    } else {
      return this.renderError();
    }
  }
}



Container/view pattern


class PlanetView extends React.Component {
  renderLoading() {
    return <div>Loading...</div>;
  }

  renderError() {
    return <div>I'm sorry! Please try again.</div>;
  }

  renderPlanet() {
    const { name, climate, terrain } = this.props.planet;
    return (
      <div>
        <h2>{name}</h2>
        <div>Climate: {climate}</div>
        <div>Terrain: {terrain}</div>
      </div>
    );
  }

  render() {
    if (this.props.loading) {
      return this.renderLoading();
    } else if (this.props.planet) {
      return this.renderPlanet();
    } else {
      return this.renderError();
    }
  }
}

class DagobahContainer extends React.Component {
  state = { loading: true };

  componentDidMount() {
    fetch("https://swapi.co/api/planets/5")
      .then(res => res.json())
      .then(
        planet => this.setState({ loading: false, planet }),
        error => this.setState({ loading: false, error })
      );
  }

  render() {
    return <PlanetView {...this.state} />;
  }
}

export default DagobahContainer;



Container/branch/view pattern


const LoadingView = () => <div>Loading...</div>;

const ErrorView = () => <div>Please try again.</div>;

const PlanetView = ({ name, climate, terrain }) => (
  <div>
    <h2>{name}</h2>
    <div>Climate: {climate}</div>
    <div>Terrain: {terrain}</div>
  </div>
);

const PlanetBranch = ({ loading, planet }) => {
  if (loading) {
    return <LoadingView />;
  } else if (planet) {
    return <PlanetView {...planet} />;
  } else {
    return <ErrorView />;
  }
};

class DagobahContainer extends React.Component {
  state = { loading: true };

  componentDidMount() {
    fetch("https://swapi.co/api/planets/5")
      .then(res => res.json())
      .then(
        planet => this.setState({ loading: false, planet }),
        error => this.setState({ loading: false, error })
      );
  }

  render() {
    return <PlanetBranch {...this.state} />;
  }
}

export default DagobahContainer;



Patterns for when the view needs to be decoupled from the model


Higher order component pattern


const withDagobah = PlanetViewComponent =>
  class extends React.Component {
    state = { loading: true };

    componentDidMount() {
      fetch("https://swapi.co/api/planets/5")
        .then(res => res.json())
        .then(
          planet => this.setState({ loading: false, planet }),
          error => this.setState({ loading: false, error })
        );
    }

    render() {
      return <PlanetViewComponent {...this.state} />;
    }
  };

export default withDagobah(PlanetBranch);




const hoc = withPlanet('tatooine')(PlanetView);


Render props pattern (AKA Children as function pattern)


class Dagobah extends React.Component {
  state = { loading: true };

  componentDidMount() {
    fetch("https://swapi.co/api/planets/5")
      .then(res => res.json())
      .then(
        planet => this.setState({ loading: false, planet }),
        error => this.setState({ loading: false, error })
      );
  }

  render() {
    return this.props.render(this.state);
  }
}

export default () => (
  <Dagobah
    render={({ loading, error, planet }) => {
      if (loading) {
        return <LoadingView />;
      } else if (planet) {
        return <PlanetView {...planet} />;
      } else {
        return <ErrorView />;
      }
    }}
  />
);



Context


Provider pattern

import React from "react";
import PropTypes from "prop-types";

const contextTypes = {
  dagobah: PropTypes.shape({
    loading: PropTypes.bool,
    error: PropTypes.object,
    planet: PropTypes.shape({
      name: PropTypes.string,
      climate: PropTypes.string,
      terrain: PropTypes.string
    })
  })
};

// provider

export class DagobahProvider extends React.Component {
  state = { loading: true };

  componentDidMount() {
    fetch("https://swapi.co/api/planets/5")
      .then(res => res.json())
      .then(
        planet => this.setState({ loading: false, planet }),
        error => this.setState({ loading: false, error })
      );
  }

  static childContextTypes = contextTypes;

  getChildContext() {
    return { dagobah: this.state };
  }

  render() {
    return this.props.children;
  }
}

// higher order component

const withDagobah = PlanetViewComponent =>
  class extends React.Component {
    static contextTypes = contextTypes;

    render() {
      const { props, context } = this;
      return <PlanetViewComponent {...props} {...context.dagobah} />;
    }
  };

const DagobahPlanet = withDagobah(PlanetView);



#medianotes #notebook

The Knick, Steven Soderbergh

The Knick, Steven Soderbergh


#notebook

Why project-based learning fails, James Koppel

Why project-based learning fails, James Koppel

  1. Write the networking component of a larger system.
  2. Write test cases for a small existing program that tempts you to make classic testing mistakes.
  3. Coordinate with coach to build something, committing pseudocode. The coach deliberately misunderstands your instructions and sees if you pick them up on it.
  4. Write small project in a team where tasks are divided up extremely small. Each person writes tests for another's code. (Integrates skills of 2 and 3.)

#notebook #medianotes

Chris Hecker interview

Chris Hecker interview

[assets/DN36_Chris_Hecker.mp3]


DN37_Chris_Hecker.mp3


#notebook

Peak, Anders Ericsson and Robert Pool

Peak, Anders Ericsson and Robert Pool

Review

Some excellent techniques for deliberate practice. Includes plenty of supporting evidence for skill being born of practice, not talent. A good accompaniment to Mindset.


The brain is plastic (including mindset stuff)


Mental representations


Finding good mental representations



Chunks



Planning



Misc


Practice


Motivation, not willpower



Types of practice

Naive practice



Purposeful practice



Deliberate practice



Effective practice techniques



Finding a coach/expert



10,000 hours


#notebook #medianotes

Principles, Ray Dalio

Principles, Ray Dalio

#notebook

The Benjamin Franklin Method of Reading Programming Books

The Benjamin Franklin Method of Reading Programming Books


About this time I met with an odd volume of the Spectator. It was the third. I had never before seen any of them. I bought it, read it over and over, and was much delighted with it. I thought the writing excellent, and wished, if possible, to imitate it. With this view I took some of the papers, and, making short hints of the sentiment in each sentence, laid them by a few days, and then, without looking at the book, try'd to compleat the papers again, by expressing each hinted sentiment at length, and as fully as it had been expressed before, in any suitable words that should come to hand. Then I compared my Spectator with the original, discovered some of my faults, and corrected them.


— Benjamin Franklin, Autobiography



#notebook

Jonathan Pie, why Trump won

Jonathan Pie, why Trump won

President Trump: How & Why... - YouTube


#notebook

Calvin and Hobbes, somehow it's always right now until it's later

Calvin and Hobbes, somehow it's always right now until it's later


#notebook

Balenciaga dress

Balenciaga dress


A dress made out of just two pieces of fabric.


#notebook

Universal paperclips

Universal paperclips





Micro-economics


Indirection


You manage what you measure


Risk


Automation


#notebook

Playfair and Michelangelo

Playfair and Michelangelo


#notebook

Thoughts on Dynamicland

Thoughts on Dynamicland

Layers of abstraction


In Dynamicland, there seem to be three layers of abstraction.


They use the phrase “operating system” to refer to the software that runs the cameras, projectors, dynamic pages and so on. Despite being a low level, this layer seems manipulable. It is still within the system.


Above that layer is the set of programs that run on pages. These seem to be written in Lua.


Above that layer are the dynamic objects that can be manipulated using “real-world” tools: arms, hands, pens, glue and so on.


It seems likely that the higher layers will be changed more often than the lower layers.


It seems likely that, as you go up the layers, the tools become increasingly accessible to non-programmers.


The name


Is the name, Dynamicland, an oblique reference to DisneyLand?


Pretend worlds vs the real world


Ordinary creative programs like Photoshop generate a pretend world inside the computer. The user interacts with the world using only a few of their faculties: sight, hearing and limited movements.


VR also creates a pretend world inside the computer. But the user can interact with the world using a wider range of movements.


AR puts some of the real world into a pretend world.


Dynamicland is the real world. But it projects virtual worlds into the real world.


It feels like the approach of Dynamicland is to start by picking a different set of assumptions. Instead of assuming that the power of a cohesive simulation is too great to let go of, Dynamicland seems to assume that the power of our bodies in the real world is too great to let go of. Starting from that assumption, it seems to try to bring back as many simulated elements as possible.


#notebook

Rachel Whiteread, (Paperbacks)

Rachel Whiteread, (Paperbacks)


My Dad and I saw the Whiteread retrospective. I don’t think I like her art very much, but we did talk a lot about it. Which means it’s probably better than I think it is.


#notebook

Computer history

Computer history

It was magical to see some of my favourite computers.


The PDP-1, the machine that started programmer culture.



XEROX Alto, the computer that preceded the Macintosh.



The original Macintosh.




The NeXT Computer, the computer that ran the operating system that preceded OS X.



The Apple campus.



Bandley Drive, where the original Macintosh was designed.



The Google campus.



Palo Alto.



#notebook

On the road

On the road

LA to SF.












#notebook

LA

LA



The Norton Simon Museum



The insane array of juices at Ehrwone. I had the beetroot, grapefruit and orange one and it was incredible.



Driving around Bel Air



Venice Beach



#notebook

My dad and I went to the location of the shootout after the bank robbery in Heat

My dad and I went to the location of the shootout after the bank robbery in Heat

The steps outside the bank.




The trees that Vincent Hanna runs past when he arrives late to the robbery.




The bridge that the robbers work their way towards.




Past the bridge.




#notebook

Playboy interview with Larry Page and Sergey Brin

Playboy interview with Larry Page and Sergey Brin

Playboy Interview: Google Guys


#notebook

A documentary about the making of Heat

A documentary about the making of Heat

(Gone from YouTube.)


#notebook

Playboy Interview: Steve Jobs

Playboy Interview: Steve Jobs

Playboy Interview: Steve Jobs


#notebook

Eden

Eden


A reality programme about twenty trying to live in the wilderness for a year. It’s interesting to see some of the mechanics of subsistence.


#notebook

Greg Fox

Greg Fox

Greg Fox – Boiler Room In Stereo - YouTube


Lauren and I saw him play at Cafe Oto yesterday.


#notebook

Chinatown

Chinatown


Lauren and I saw this at the cinema last weekend. The big screen meant that, in this scene, I noticed Faye Dunaway’s face reflected in the car window.


#notebook

Mindset, Carol S. Dweck

Mindset, Carol S. Dweck

I got a lot out of this. I’d read about growth and fixed mindsets before, and had taken some steps to working on my own mindset. But reading lot of examples helped me go much deeper.


Also, I think that reading a book lets you learn a lot more than a long article, even if they have the same content. Reading a book means you live with its subject. Your life is immersed in it for a while. There’s more chance for regularly-occuring thoughts or events to come up that you can tie into the material.


#notebook

The Big Sick

The Big Sick


#notebook

An oblique account of a visit to Bret Victor's lab

An oblique account of a visit to Bret Victor's lab

https://limn.it/utopian-hacks/?doing_wp_cron=1498868053.3908839225769042968750


#notebook

What job do you hire a milkshake to do? Clayton Christensen

What job do you hire a milkshake to do? Clayton Christensen

Jobs to be done.


Market Disruptions & Online Learning - YouTube


#notebook

Check It

Check It

CHECK IT (2017) Official Trailer - YouTube


A good documentary about a gay, black gang in Washinton D.C.


#notebook

The Seasons in Quincy: Four Portraits of John Berger

The Seasons in Quincy: Four Portraits of John Berger


#notebook

Aged 8 in Paxos

Aged 8 in Paxos


#notebook

Lauren and me in Rome

Lauren and me in Rome

Laocoön and His Sons, the Vatican. The high priest of Troy was suspicious of the Greeks’ Trojan horse. The Gods wanted Greece to win the war with Troy, so they sent snakes to kill the high priest and his two sons.



Apollo Belvedere, the Vatican



The ceiling of the Sistine Chapel, the Vatican



The Oculus of the Pantheon



A column in the Pantheon



Saints at St. Peter’s Basilica



Pietà, Michelangelo. Sculpted when Michelangelo was 23



The Forum



Lauren and a column at the Forum



Lauren and me at the Forum



#notebook

A speedboat in Venice

A speedboat in Venice


#notebook

Your War (I’m One of You): 20 Years of Joan of Arc

Your War (I’m One of You): 20 Years of Joan of Arc

Your War (I'm One Of You): 20 Years Of Joan Of Arc - YouTube


#notebook

Norman Foster’s sketch of the evolution of the design of Apple’s new campus

Norman Foster’s sketch of the evolution of the design of Apple’s new campus


From Steven Levy’s article.


#notebook

Alan Kay, How to Invent the Future

Alan Kay, How to Invent the Future

The YC / Stanford startup class.


Part 1

https://www.youtube.com/watch?v=id1WShzzMCQ


Learn the rules of the pros, remember the perfume


Learn all the rules of the pros, then forget it all so you can come up with new ideas. You'll retain the perfume of the rules which will help guide you towards the right stuff when you're coming up with the new ideas.


Don't increment, create an industry


Big leaps forward are rejected by companies because middle management would rather just make the thing that made the company successful make more money because it's not very disruptive to their lives.


The present is the worst place to live


Living in the present means you're completely out of it. What we have now is always crap. See it as punchcards and mainframes. So if you want to invent the future, you can't be living in the present.


Vision + problem finding


When you're working on hard things, using a vision and problem finding is much better at the beginning. If you problem solve too early, you run the risk of choosing the wrong problem because you'll be blinded by the present.


High rate of failure is fine


Failing to implement something is an error. You should be ashamed. But failing to invent something new is a not shameful. You expect a high failure rate for design.


Invent the things you need to reach the vision


The XEROX PARC stuff was done in about 12 years. But it was preceded by research done for WWII (the Manhattan Project) and research done for the Vietnam War (MIT Building 20 radar project). So it was actually 30 years in the making. So much stuff had to be invented to enable the inventions of PARC.


Don't see what's available and make do with it. Instead, you have to invent the things the vision needs.


An important outcome of the research is better researchers.


MacCready sweet spot



You shouldn't focus on better or worse (the orange wiggly line), you should problem find until you hit something that is really needed. Then the area between the short blue line above MacCready's head is the area you can explore to find great solutions.


Focus on thresholds. That way, you're not always just comparing to local variations.


MacCready was the man who invented man-powered flight. This was the problem that was actually needed. Contrast with the Moon landings which were a dead end because landing on the Moon wasn't what was needed and the technology to do (burning tons of chemicals that are so heavy you need a huge rocket to do it) was a dead.


Wayne Gretzky skated to where the puck is going to be


Kay used this idea to talk about a way to get out of the present. Extrapolate to 30 years in the future where you think, "Surely we'll have X". (The skating.) Then dial it back to 15 years in the future and use extremely expensive/overpowered technology to implement it.


Part 2

https://www.youtube.com/watch?v=DIR6Rmhm3To)


Context is worth 80 IQ points


IQ. Leonardo had IQ. But he couldn't ever build an engine to power his machines because he didn't have the knowledge.


Knowledge. Henry Ford did have that knowledge, even though he might not have been as smart.


Context / world view. Newton had the right context / world view to invent the laws of motion.


(Kay doesn't really say what constitutes context.)




Watched up to 8m.


#notebook

Michael Nielsen

Michael Nielsen

http://cognitivemedium.com/trouble_with_definitions/index.html


A book I love is “Proofs and Refutations” (Imre Lakatos). A big point of that book is that people tend to think of definitions & categories as starting points, from which we derive theorems or scientific results about the world. But the process really works the other way round. Definitions and categories are things which emerge after we’ve understood phenomena in the world, and as a consequence of that understanding. And so while it’s worth making very tentative definitions, it’s a mistake to do so too prematurely, or to hold too strongly to them. Those tentative definitions are, at best, scaffolding to help arrive at an understanding, which may eventually result in good definitions.


#notebook

The Social Network- Sorkin, Structure and Collaboration

The Social Network- Sorkin, Structure and Collaboration

The Social Network — Sorkin, Structure, and Collaboration - YouTube


#notebook

Thinking in Systems, Daniella H Meadows:

Thinking in Systems, Daniella H Meadows:

President Jimmy Carter had an unusual ability to think in feedback terms and to make feedback policies. Unfortunately, he had a hard time explaining them to a press and pbulic and didn’t understand feedback.


Carter was trying to deal with a flood of illegal immigrants from Mexico. He suggested that nothing could be done about that immigration as long as there was a great gap in opportunity and living standards between the United States and Mexico. Rather than spending the money on border guards and barriers, he said, we should spend money helping to build the Mexican economy, and we should continue to do so until the immigration stopped.


That never happened.


You can imagine why a dynamic, self-adjusting feedback system cannot be governed by a static, unbending policy. It’s easier, more effective, and usually much cheaper, to design policies that change depending on the state of the system. Especially when there are great uncertainties, the best policies not only contain feedback loops, but meta-feedback loops - loops that alter, correct and expand loosp. These are policies that design learning into the management process.


#notebook

An MVP for a car

An MVP for a car


An incredibly touching gift from the developers I coached at Makers Academy.


#notebook

Thinking in Systems, Donella H. Meadows

Thinking in Systems, Donella H. Meadows

No physical entity can grow forever. If company managers, city governments, the human population do not choose and enforce their own limits to keep growth within the capacity of the supporting environment, then the environment will choose and enforce limits.


#notebook

A Hard Rain’s A-Gonna Fall, Bob Dylan:

A Hard Rain’s A-Gonna Fall, Bob Dylan:

Where black is the color, where none is the number

And I’ll tell it and think it and speak it and breathe it

And reflect it from the mountain so all souls can see it

Then I’ll stand on the ocean until I start sinkin’

And I’ll know my song well before I start singin’


#notebook

Pieta, Michelangelo

Pieta, Michelangelo


I saw a reproduction of this in the Michelangelo and Sebastiano exhibition at the National Gallery. I’m really excited to see the original in Rome this summer.


#notebook

Talking Funny

Talking Funny

Talking Funny - HBO - YouTube


A discussion between Ricky Gervais, Chris Rock, Louis C.K. and Jerry Seinfeld.


#notebook

Thinking in Systems, Donella H. Meadows

Thinking in Systems, Donella H. Meadows

The system starts out with enough oil in the underground deposit to supply the initial scale of operation for 200 years. But, actual extraction peaks at about 40 years because of the surprising effect of exponential growth in extraction. At an investment rate of 10 percent per year, the capital stock and therefore the extraction rate both grow at 5 percent per year and so double in the first 14 years. After 28 years, while the capital stock has quadrupled, extraction is starting to lag because of falling yield per unit of capital. By year 50 the cost of maintaining the capital stock has overwhelmed the income from resource extraction, so profits are no longer sufficient to keep inventment ahead of depreciation. The operation quickly shuts down, as the capital stock declines. The last and most expensive of the resource stays in the ground; it doesn’t pay to get it out.


#notebook

Maria Montessori felt that children learn to write before they learn to read

Maria Montessori felt that children learn to write before they learn to read

Here’s what she wrote in The Secret of Childhood:


One day two or three mothers came to me and asked me to teach their children how to read and write…All that I taught these four- or five-year-old children were some letters of the alphabet which I had the teacher cut out of cardboard…They would march up and down in procession holding up the letters of the alphabet like banners and uttering shouts of joy…“To make Sofia, you have to have an ’S’, an ‘O’, an 'F’, an 'I’ and an 'A’.”…In the beginning, a written language is distilled from its spoken counterpart…The child who first make the discovery was so astonished that he shouted out loud: “I’ve written, I’ve written!” The children excitedly ran up to look at the words which he had traced on the floor with a piece of chalk…The children were rarely interested in reading what another had written. Many of the children would turn around and look at me in amazement when I read out loud the words they had written, as if to ask, “How do you know it?” It was only after some six months that they began to understand what it is to read, and they did this only by associating reading with writing. They watched my hand as I traced letters on a piece of white paper and came to realise that I was communicating my thoughts.


#notebook

Now Play This

Now Play This

This weekend, Lauren and I went to Now Play This, an experimental games festival. It was at Somerset House. We played some really cool stuff.


Many of my favourites are hard to talk about. This seems like a good thing.


A game where you catch balls on a wire. You control the wire with a physical rope that you can stretch and relax. In this way, you can gather the balls and spring them into the air.


A game where you try to draw a replica of a work of art. You draw by pressing one of the many buttons. Each button does something different. It might shift certain colours, or move sections of the drawing. Because the labels on the buttons are cryptic, and because each action tends to act on the whole drawing, it’s hard to act intentionally. The game shows a score for the similarity between the two pictures. This is the one guide. Press a button for a moment. If the score goes up, keep pressing the button. If the score goes down, press a different one. Following this metric makes your drawing a secondary, surprising result.


A game where you cooperate. Each level has a key, a door and some obstacles to jump over. The goal is to pick up the key, unlock the door and walk through the door. There are ten players. Each player controls a little guy who can jump. The trick is that the little guys need to stand on each other’s heads to reach the key or get over obstacles. What really left an impression on me was that, when I saw it, the game was being played by ten people who were strangers to one another. Yet, wordlessly, they cooperated. They developed simple techniques like standing on each other’s heads. They developed more complex techniques like standing on each other’s heads and staggering their bodies to create stairs.


#notebook

Bacalaureat

Bacalaureat


The new film by Cristian Mungiu. Very good.


#notebook

Index pages: home, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11