コラム
column
2021.06.23
codepenのようなコード共有サイト「CodeSandbox」が便利
コードを他の人と共有したい場合、CODEPENを利用する場合が多くありますが、CodeSandboxも便利だったのでご紹介します。
サイト「Create Sandbox」を押すと以下の画面になります。
ReactやVueや知らないものまで多くのテンプレートから選べます。
![](https://planning-a.jp/wp-content/uploads/2021/06/40a7e86786816a8810ebadc0b51de236-595x248.png)
Vueを選択しますとVue Cliで作成した時のようなテンプレートが準備されてすぐにコーディングを始めることができます。
![](https://planning-a.jp/wp-content/uploads/2021/06/663ba641d0f1e00826fe7a222461fc35-595x373.png)
パッケージも「Dependency」という所から検索してすぐに入れられます。
sassとsass-loaderを入れたらscssがすぐに使えました。
外部のリソースやGoogleFontもすぐに入れられます。
![](https://planning-a.jp/wp-content/uploads/2021/06/add2af4751e3743684a91a5908af8f7e.png)
Embedボタンを押すとiframeのソースが表示されるので外部サイトへの埋め込みも簡単です。
![](https://planning-a.jp/wp-content/uploads/2021/06/9eebf228943ef5808545dfe44915ba7c-595x489.png)
ちょっとしたものを試す場合やコードを共有したい場合、便利なので今後も使いたいと思います。
阿部