【ブログ投稿キャンペーンエントリー記事】Lightning Web コンポーネントの学習方法について
この記事はSalesforce 開発者向けブログ投稿キャンペーンへのエントリー記事です。
家にいると勉強がはかどらないタイプ。かなさんです。
ブログ投稿キャンペーンの第2弾が発表され、「よし、3つぐらい投稿しちゃうぞ～」と思ってたはずなのに気が付いたら月末でしたorz
自身のおさらいも兼ねて、「Lightning Web コンポーネント開発のオススメの学習方法」を書こうと思います。
１．開発ツールを入れよう
残念なことに、開発者コンソールではLightning Web コンポーネントの作成・編集ができません。学習のために、開発に必要なSalesforce CLIとVisual Studio Codeと拡張機能を入れましょう。
Trailheadのプロジェクト「クイックスタート: Lightning Web コンポーネント」にインストール・設定手順が記載されていますので、手順に従って設定しましょう。
なお、先日発表された「Salesforce Code Builder」が使えるようになればこの作業は不要になります。早期のリリースを期待したいところです。
※簡単な機能の確認だけであれば「Lightning Web Components Playground」で可能です
２．作り方を知ろう
Trailheadのプロジェクト「Lightning Web コンポーネントの基本」で、Lightning Web コンポーネントの概要や作り方を知りましょう。
必要となるHTML、JavaScript、CSS の解説はないため、別途学習が必要です。
３．SAMPLE GALLERYを活用しよう
Lightning Web コンポーネントのサンプルを集めた「SAMPLE GALLERY」を活用しましょう。
プロジェクトをクリックするとGithubに飛び、ソースを確認することができます。
また、Salesforceにその資材をコピーしてどのように動いているのか見ることができます。
かなさんの一押しはなんといっても「LWC Recipes」！
同じような資材にちょっとずつコードが加わっていき、だんだん機能が増えていくのでとても勉強になります。
最近フォーカスされたプロジェクト「Quick Start: Explore the LWC Recipes Sample App」も増えたので、ぜひチャレンジしてみてください。
４．ガイドやレファレンスを読もう
「Lightning Web Components Dev Guide」にはLightning Web コンポーネントの概要からテスト、関連のレファレンスまで幅広い情報が記載されています。
量が多いので、気になる箇所から読んで徐々に読み進めていくのもありです。
「Component Reference」にはLightning Web Componentsのコンポーネントはもちろん、Auraのコンポーネントの情報も記載されています。
自作する前に使えるコンポーネントがないか、必ず確認しましょう！
５．オリジナルのコンポーネントを作ろう
ぜひ、オリジナルのコンポーネントを作ってみましょう。
難しく考えず、サンプルを修正したものでOKです。
自分の考えたものを実装し、動かしてみるのが一番勉強になります。
●最後に
Lightning Web コンポーネントが気になっているのなら、まずはやってみましょう！
最初はちょっと戸惑うかもしれませんが、慣れれば意外と大丈夫だったり、困ったら相談に乗ってくれるベテラン勢がいたりします。
さあ、あなたも今日からLet'sチャレンジ！
