Salesforce Platform Developer I：LWC Appインストールの三つ方法

# LWC Appインストールの三つ方法
**・ロック解除パッケージを使用したアプリのインストール：**
　　このオプションを使用すると、ローカルの開発環境をインストールしなくても、誰でもサンプルアプリを体験できます。
**・Scratch Orgを使用したアプリのインストール：**
　　これは推奨されるインストールオプションです。アプリとコードを体験したい開発者の場合は、このオプションを使用してください。
**・DeveloperEdition組織またはTrailheadPlaygroundを使用したアプリのインストール：**
　　Trailheadバッジに取り組む場合、またはアプリをScratch組織よりも永続的な環境にデプロイする場合に便利です。

# 各方法のやり方
## ロック解除パッケージを使用したアプリのインストール
①「playground Starter」の「パッケージをインストールする」をクリック
②以下のパッケージIDを入力して、「すべてのユーザのインストール」を選択して、インストールする
　"04t3t000002sAHUAA2"
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/18e0be04-a2a6-a603-4ace-cc26a6b1510a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/add56948-47c8-b65f-5e0f-c6935d7a57e2.png)
③以下のリンクからcsvファイルダウンロード、データインポートウィザードで「取引先と取引先責任者」をインポートする
https://raw.githubusercontent.com/trailheadapps/lwc-recipes/main/data/Accounts-Contacts.csv
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/2d235ff8-cb0d-fe1f-a054-1ed75b045097.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/31638658-8d3a-e7d4-25ff-71e5da09b1ba.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/5fc2b87c-b1b2-f457-8d8c-9ad73137feb5.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/408142c0-e8c0-2a7e-6e3c-82d417d83950.png)
④割り当ての管理設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/66436c32-bda5-de84-b0a1-ebab2a1b4b38.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/897d1d13-c137-d3ff-186b-e5c1524eb1ed.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/503ba751-112c-83db-d5ec-c32f0f5060fe.png)
⑤テーマおよびブランド設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/f235f8bc-5264-d95d-d6cd-f81977b6821d.png)
⑥設定結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/cd189515-70a3-7c8f-648a-92608dcc3daf.png)
## Scratch Orgを使用したアプリのインストール
<font color="Red">※一時の環境の認識でよい、短期で使用する設定用の組織、主に実装/単体テストのフェーズで開発者単位に作成して動作確認を行うために使用します。</font>
①Dev Hub有効化する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/f3cee363-6cb0-8e25-f526-cd4872f7d759.png)
②SalesforceCLIインストール
③Visual StudioCodeインストール
④VSCodeにSalesforce Extension Packインストール
⑤以下のコマンド実行、接続環境設定
```sfdx auth:web:login -d -a myhuborg```
-d：ログインの組織をスクラッチ組織作成のデフォルト環境に設定
-a <string>：別名設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/0fbe0e04-5fe9-50a5-3f19-7c968833f89a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/7352161d-f12d-327b-9f27-f79d23fb1070.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/288e0d02-3ab7-6d29-c7c0-b89ea3d7b7fa.png)
⑥Gitから既存のlwc-recipesリポジトリのクローンを作成
```git clone https://github.com/trailheadapps/lwc-recipes
cd lwc-recipes```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/e200bf55-5afd-51e4-2fdf-1e6ce3cd906f.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/e9f8b8f5-9f39-d7c4-a461-01d31aa2f9fc.png)
⑦スクラッチ組織を作成
```sfdx force:org:create -s -f config/project-scratch-def.json -a lwc-recipes```
-s：作成した組織をデフォルトのユーザー名として設定
-f：組織定義ファイルへのパス
-a：作成された組織の別名
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/d085d52d-414e-c9b1-51bb-e66a4da4158b.png)
⑧アプリをプッシュする
```sfdx force:source:push```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/6f1c3e28-6b3c-6ba5-27a8-4871bfbde21b.png)
⑨権限セット設定（権限セットの名前は「recipes」）
```sfdx force:user:permset:assign -n recipes```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/184f672c-5d38-094d-84c5-061ae6f265c8.png)
⑩サンプルデータのインポート
```sfdx force:data:tree:import -p ./data/data-plan.json```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/abc4a2c0-4251-67c0-2ec4-0c089559403e.png)
⑪スクラッチ組織起動
```sfdx force:org:open```
テーマおよびブランド設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/f235f8bc-5264-d95d-d6cd-f81977b6821d.png)
⑫設定結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/8d26dbaa-3415-b365-b59b-b5b477de9aa9.png)
⑬スクラッチ組織の確認
　英語：Active Scratch Orgs 日本語：スクラッチ組織情報
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/60967026-ef0e-2c33-7cee-232358ab30bc.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/9e00ebe4-1b9b-5292-d993-fd6844374897.png)
## DeveloperEdition組織またはTrailheadPlaygroundを使用したアプリのインストール
①Gitから既存のlwc-recipesリポジトリのクローンを作成
```git clone https://github.com/trailheadapps/lwc-recipes
cd lwc-recipes```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/15be093c-df81-60a9-de03-f22fec58e9e8.png)

②Trailhead PlaygroundまたはDeveloper組織接続（「mydevorg」は別名）
```sfdx auth:web:login -s -a mydevorg```
-s：ログインの環境
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/61a391d2-a17b-4885-fddf-7820c0715d02.png)
③アプリケーションデプロイ
```sfdx force:source:deploy -p force-app```
④権限セットをデフォルトユーザーに割り当て
```sfdx force:user:permset:assign -n recipes```
⑤データインポート
```sfdx force:data:tree:import -p ./data/data-plan.json```
⑥組織開く
```sfdx force:org:open -u mydevorg```
⑦テーマおよびブランド設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/f235f8bc-5264-d95d-d6cd-f81977b6821d.png)
⑧設定結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/424429/cd189515-70a3-7c8f-648a-92608dcc3daf.png)