Apropcalypseという造語に出会ったのでまとめる

記事作成時期:2019/02

Defining Component APIs in ReactというReactのコンポーネントのプラクティスを列挙している記事を見ていたところ「Apropcalypse」という単語に出会った。

はて見覚えもないしなんだろうと読み進めるとこれは「
The how and why of flexible React components」のスライドで語られている造語で、「Apocalypse + props」らしい。Apocalypseは「啓示・黙示録」など出てくるがこの場合は「この世の終わり・世の終末」あたりの意味合いの方が近そう。

下記ほとんど原文のとおりだが、一応自分なりの咀嚼を記述しておくと、
これは下記のようなものを指している。

<Button
  icon={starIcon}
  text="hello"
/>

で、このボタンが色々膨れていくと

<Button
  icon={starIcon}
  afterIcon={heartIcon}
  hoverIcon={filledStarIcon}
  text="hello"
  color="red"
  primary={true}
  ...
/>

みたいな感じで膨れて地獄が完成していく。結構あるあるだろう

なのでchildrenをちゃんと生かしてこうしていこうという事になる

<Button>
  <StarIcon />
  <InnerText color="red">hello</InnerText />
  <HeartIcon />
</Button>