今年もアドベントカレンダーの季節がやってきました。
というわけで、ネタ切れしてたので個人的にちょっと試したものを載せたいと思います。
Lightning Web Components Playground って？
Salesforce.com 社が用意している、Web 上で lwc を試せる環境です。
Web 上でコードを編集したものを実行できるものとして、次のようなものがあるかと思います。
- Codepen.io
- jsfiddle
- StackBlitz (Angular)
- CodeSandbox
- Glitch
サイトへ次の URL で行くことができます。
https://developer.salesforce.com/docs/component-library/tools/playground
どんな感じなのか
画面は次の画像のような感じです。(2019/12/08 時点)
ざっくり
- ファイル構成
- エディター
- 表示画面
という構成になっています。
試す
自動コンパイル
試しに app.html のファイルの中を編集すると、変更があるたびに自動でコンパイルが走り、レンダリングされます。
この設定は Live Compilation のチェックがデフォルトで入っているため、自動で変更が反映されます。
Live Compilation のチェックを外すと、ファイルを変更しても自動での反映は行われず、Run ボタンを押すことで反映されます。
コード補完
文字を入力すると、サジェスチョンがいくつか出てきます。
入力した感じだと、標準のHTMLタグは出てくるようなのですが、lwcのサジェスチョンは出ない感じでした。
これから変わっていくのかもしれません。
どのように使っていくか
あくまで Playground なので、当然のことながら本格的な開発を想定して作られたmのではありません。
個人的な感覚ではあるのですが、要件定義の段階で試しに見せたり、あるいは PoC で何かを簡単に作るときなんかには試せるのかもしれません。
合わせて参照
試す前に、こういったものを見て感覚を掴んでからもいいかも
Sample Gallery