CodePen 2.0

2026年7月30日 CodePen 2.0 おそらく私のキャリアにおける最大の功績である、CodePen 2.0のローンチについて触れます。信じられないかもしれませんが、オリジナル版CodePenの全作成よりもはるかに多くの労力がかかりました。ここで、私たちが何を行い、なぜそれを行ったのかをすべて詳細に説明する場所ではありません。興味がある方は、おそらく私たちの「Why 2.0?」ポッドキャストや「What’s New?」ページをご覧ください。代わりに、ローンチ初週からのいくつかのエピソードを紹介します。 初めて会う人とデモを一緒に作業していました。それは彼（クラシック）のPenから始まりました。彼は別のJavaScriptをインポートする必要があったので、3つのPenを使用して、他の2つからJavaScriptをメインのデモにプルしました。彼はnpmパッケージも必要としていました。私はPenをフォークし、彼を共同編集者に招待したので、いつでも私たち両方が一緒に作業できるようになりました。JavaScriptをメインのPenのファイルに移動しました。これは作業がはるかに容易になるためです。npmパッケージは、簡単なバージョン管理のためにpackage.jsonファイルにあります。私たちは両方とも、自分たちの好みに合わせてそれをきれいにしました。 Keyframers（DavidとShaw）は再結成し、ローンチ当日にライブストリームを行いました。彼らも招待機能とライブコラボレーションを使用しました。彼らは何時間も一緒に作業し、バグがいくつかありましたが、それほど大きな問題はなく、うまくいきました。私が気に入った点の一つは、彼らがPenのライブビューを共有したことです。そのため、彼らが作業している間、私たちもデモを自分で試すことができました。 ローンチに関するメールを作成していたとき、私はそれらを特別言語であるMJMLで作成していました。CodePenにMJMLをブロックとして追加したので、CodePen内で直接作成できるようになりました。奇妙なものでも、うまく機能します。今後、さらに多くのブロックが登場する予定です。 Penエディターから直接小さなウェブサイトを作成してデプロイできるのが本当に気に入っています。例えば、slideVarsライブラリやcodepen.schoolのサイトなどです。たくさんの奇妙な小さなウェブサイトを作りたいという気持ちになります。 関連記事