FCP Scroll - スクロール中にセクションが中央に固定されて中のコンテンツが進むアレ

#はじめに
**"スクロール中にセクションが中央に固定されて中のコンテンツが進むアレ"**を実装しようとしたところ、相応の記事が見当たらなかった（見つけられなかった）ので備忘録として載せておきます。

#アレってどれ？
アレってどれだよって感じなので簡単なDEMO貼っておきます。

See the Pen FCP-Scroll (fixed center position scroll) by Zakime (@zakime) on CodePen.

#FCP Scroll
名前が分からないので勝手に"FCP Scroll(fixed center position scroll)"と名付けました。
正式な名前があれば教えてください。
また、すでに王道な手法やりライブラリがあればぜひ教えてください。

#作り方

1. 表示したいコンテンツ(群)をdivで囲んでposition:fixedで画面中央に固定する。この時、囲むfivの高さを100vh未満にしたい場合は上下のdivも一緒に囲んでおく必要がある。
2. 切り替えたいコンテンツの数だけそれに対応する判定用のdivを作る。
3. screenの中央を監視（IntersectionObserver）して、判定用のdivが中央線に重なっているときに、そのdivに対応したコンテンツを表示する。

お前の語彙力雑魚過ぎて意味不明なんだけどって感じだと思うので下記参照。
図を描いたり文字を書くのが面倒なわけではありません。

See the Pen Base of FCP-Scroll by Zakime (@zakime) on CodePen.

中のコンテンツ次第で書き方が変わるので汎用的なコードにはなりませんが、骨組みのところは変わらないのでに自分で書くのダルいって方は参考にしてください。