ど〜も〜、GW最終日に足首を痛めたたかの人です。
いや〜、前回のブログを公開した後に走りに行ったのですが、1㎞走ったところで足首を痛めました（笑）
やはりマメに運動しないとダメですな(╯⊙ ⊱ ⊙╰ )
さて、今回も外部サービスを紹介いたします！
エンジニアのブログを運営するのであれば必要になるかと思います。
その名もcodepen！
codepen
他の方のエンジニアブログ等でもよくも見かけると思います。
ご存知かと思いますが、見た目はこのようになります。
See the Pen test by taka-no-hito (@taka-no-hito) on CodePen.
なかなかモダンでいい感じではないでしょうか？
ソースコードだけでなくプレビューも見せたい時にとても重宝します。
以前、本ブログではGistを紹介しておりました。
簡単にコードをブログに表示してみた。
このGistとの住み分けが難しいところではありますが、コードの一部やエラーコードなどをを見せたい時にはGistを、コードの全容やモック等を見せたい時にはcodepenを使用するといいかもしれません。
実はcodepen以外にもプレビューを表示してくれるサービスは多々あります。
しかしながら、どのサイトもちょっとデザイン的にちょっと残念、、、、
ですので、現段階ではcodepenがモダンで使いやすいかと思います。
codepenの導入方法は詳しく解説している記事がたくさんヒットするので、それを参考にしていただくのがいいかと思います。
（決して、面倒だからではないよ！多分。。。。）
見た目はデフォルト以外にも存在します！
が、残念ながら無課金版では上記の他にこの２種類が使用できます。
lightば〜じょん
See the Pen test by taka-no-hito (@taka-no-hito) on CodePen.
darkば〜じょん
See the Pen test by taka-no-hito (@taka-no-hito) on CodePen.
ブログのトンマナに合わせて多少使い分けができるかと思います。
それでも物足りない！！って方は有料版をおすすめします。
また、ご覧の通りメタ言語も使用できます。
自分の得意な環境に合わせて投稿できるので便利ですね！
これで、ようやくまともにコードを投稿できる環境が整ってしまった、、、、
真面目に投稿しなくては、、、、
以上、たかの人がお送りしました。
