CodePenアカウントの作成方法【HTML、CSS、JS】

前回はCodePenの使い方についてご紹介しました。

上の記事でお伝えした通り、CodePenを最大限に活用するにはアカウント作成（無料）が必須になります。大して難しい作業ではありませんが、念のため画像付きでアカウント作成の手順をお伝えします。では、サクッと行ってみましょう！

Contents

CodePenのアカウント（無料）作成手順

まずは下記のリンクからCodePenのサイトへGO。 CodePen こんな感じのサイトです。

英語だらけで少し後ずさりしてしまいますが、怪しいサイトでは無いのでビビらずに進みましょう。

真ん中左にある緑色のボタンをクリックします。（右上のボタンでもOK）

Sign Upボタンを押すと登録画面に飛びます。

SNSアカウント（Twitter、GitHub、Facebook）またはメールアドレスを入力して登録します。メールアドレスで登録したい場合は「Sign Up with Email」のボタンをクリックすると、入力フォームが出現するようになっています。

登録が完了するとこちらの画面に飛びます。

ここの画面でプロフィールの入力を求められますが、スルーしても構いません。 ※CodePenはSNSとしての側面も持つためプロフィールの入力が求められるのです。

CodePenからこの様なメールが届きます。

真ん中上あたりにある「Click to Verify Email」をクリックすればメール認証が完了します。

以上で登録完了です。お疲れ様でした。これで自分が書いたコードをブログに埋め込んだり、他人が公開しているコードを自分でいじって勉強したりできます。

トップメニューの「Popular」をクリックすると、世界中で投稿されたペン（コード）の中から人気のコードが見られます。

かっこいいコードからユニークなコードまで色々。眺めているだけでも楽しめます。

今回はCodePenのアカウント作成についてご紹介しました。無料で登録できてHTML、CSS、JavaScriptの勉強が捗るcodePen、おすすめです！