【Salesforce】Developer EditionでLightningアプリケーションの作成とDevOps Centerの導入をしてみた

# はじめに
「**そうだ、良い機会だからSalesforceの資格を取ろう**:baby_chick:」

と思い立い、認定アドミニストレーター取得に向けて学習を始めました。
個人学習は、Trailheadを中心に学習していましたが、より様々な機能の理解を深めるために、SalesforceのDeveloper Editonを使って、自己学習環境を整備していきます。
主に標準機能や馴染みのない機能などの学習を進めていけたら、と思っています。

:::note
記事を読んで、アドバイス等あれば、ぜひお願いします！
:::

今回は、以下の内容をメインに書きます。
- DevOpsCenterを導入する
- 開発環境でLightningアプリケーションを作成する
- DevOpsCenterを使ってデプロイする

:::note warn
結果的に、新規Lightinigアプリケーションのデプロイは失敗しました。
代わりに、カスタムオブジェクトを作成してデプロイしています。
:::



# Developer Editionの登録
https://developer.salesforce.com/signup
まずは、上記URLからDeveloper Editionのアカウント登録をします。

Developer Editionは、無料で使えるプライベート開発環境です。
>プラットフォームと API にアクセスできます。開発者は、Salesforce を拡張し、他のアプリケーションと統合して、新しいツールやアプリケーションを開発できます。Developer Edition では、Enterprise Edition で使用できる機能の多くにもアクセスできます。

https://help.salesforce.com/s/articleView?id=xcloud.overview_edition.htm&type=5



# 実際の画面
ログインすると、すぐに使える状態になっています。
アプリケーションランチャーには、サービス、セールスなどが入っています。
![Cursor_と_ホーム___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/17682a82-6137-a2f0-fca9-fb6413456153.png)

サンプルレコードもいくつか存在しています。
![スクリーンショット_2025_02_11_16_47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/798c1a7d-aaad-a7d7-04e9-693f385fc28f.png)

### サービス
![Cursor_と_ホーム___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/40e0ab69-c51c-066c-1ab5-d9555d4703c4.png)

### セールス
![ホーム___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/e59c7779-c4f6-07b1-fcc0-6d244231f467.png)

設定で「アプリケーションマネージャー」を選択すると、一覧が表示されます。
![アプリケーションマネージャー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/34eee06b-50c6-a614-555c-395275962093.png)



# DevOps Centerのインストール
DevOpsCenterは、Salesforce上で変更管理とリリース管理ができる機能です。従来の変更セットの後継機能のようです。
Developer Editionでも利用可能なので、導入していきます。
[公式のヘルプページ](https://help.salesforce.com/s/articleView?id=platform.devops_center_setup_install.htm&type=5)と[Salesforce DevOps Centerについてまとめてみた](https://qiita.com/arufian/items/675a61af6c765d1977db)を参考にさせていただきながら、進めていきます。

まずは、[設定] から[DevOps Center] を選択し、有効化にチェックを入れます。
![DevOps_Center___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/f3a10852-c96d-e9d4-8f0e-4982266fda00.png)

[パッケージをインストール]をクリック、[管理者のみのインストール]を選択してインストールします。
![Install_Package.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/1dc687a0-1de5-924f-803a-089829fb1e22.png)

インストールが完了すると、メールが届きます。
また、[インストール済みパッケージ]でも確認することができます。
![インストール済みパッケージ___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/208124ac-0086-7c20-1a25-c3c4abfb103e.png)



# 接続アプリケーションの作成
[設定]から[アプリケーションマネージャー]を選択し、[新規接続アプリケーションマネージャー]をクリックします。

[接続アプリケーションを作成]を選択して、続行をクリックします。
![アプリケーションマネージャー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/20bdddf0-ae39-ae7d-a480-ac82e0bf8cfd.png)

下記の情報を入力して、保存をクリックします。
- 接続アプリケーション名: DevOps Center
- API 参照名: DevOps_Center
- 取引先責任者メール: support@salesforce.com
- ロゴ画像 URL: https://tinyurl.com/doc-icon
- 説明: 開発およびリリースプロセスの管理
- 開始 URL: /sf_devops/DevOpsCenter.app
![アプリケーションマネージャー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/e48b38dd-25e5-dcd2-01db-84e8ede1d99d.png)

[接続アプリケーションを管理する]で[manage]をクリックします。
[権限セット] セクションで、[権限セットの管理] をクリックします。
[sf_devops_NamedCredentials]を選択し、[保存]をクリックします。
![Lightning_Experience___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/d9371dae-2eaf-15bb-5145-0e6e85a0423b.png)



# DevOps Center 権限セットを割り当てる
DevOps Centerの権限セットは5種類あります。
![DevOps_Center_権限セットを割り当てる.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/4ff60c0e-8c54-3e78-772a-0db3b16ede6c.png)
[DevOps Center]と[sf_devops_NamedCredentials]は全員に、その他の3つは役割によって付与する運用方法のようです。

今回、割り当てるユーザーは1人なので、[設定]の[ユーザー]から該当ユーザーを選択します。
[権限セットの割り当て]の[割り当ての編集]を選択し、5つとも追加して有効化します。
![権限セット___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/c1b846f8-d541-a665-83f5-e12e32b48d26.png)



# セッションの設定の定義
[設定]から[セッションの設定]を選択します。
[ログイン時の IP アドレスとセッションをロック] を選択解除します。
（今回は元から解除されていました）
![Cursor.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/077630a4-dfcd-fea6-0edb-956ad51a239d.png)



# 許可リストに登録された接続アプリケーションの API アクセスコントロール設定の無効化
「[設定]から[API コントロール]を選択」となっていますが、項目が見当たらないので、一旦省略します。



# スクラッチ組織の作成
Developer EditionではSandboxの作成ができません。
そのため、開発環境としてスクラッチ組織を作成します。

[設定]から[Dev Hub]を選択し、以下の2つを有効化します。
- Dev Hub を有効化
- Developer Sandbox および Developer Pro Sandboxのソース追跡を有効化
![Dev_Hub___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/b4338809-7527-66d7-72b2-1dc969af6b1a.png)

VSCode上でDeveloper Editionの組織に接続します。
`SFDX: Create a Default Scratch Org`で、スクラッチ組織を作成します。
期間はとりあえず30日間にしました。



# GitHub プロジェクトリポジトリの設定
DevOps Centerのアプリを起動して、[New Project]をクリックします。
「Connet to GitHub]をクリックして、GitHubと連携します。
![DevOps_Center.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/fcf6ed16-1314-b8a5-111e-4317133726ef.png)

連携ができたら、[New Project]からプロジェクトを作成します。
リポジトリを新規作成するので、[Create a repository for my project that uses the Salesforce DX project structure.]を選択します。
![DevOps_Center.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/ae537cae-848f-1670-0d76-cf46a76d17b7.png)

[インテグレーション][UAT][ステージング]は今回作成しないので、Stage Nameの横にある▼をクリックして[Remove Stage]をクリックします。

[Development Environments]の[Add Development Environment]から、スクラッチ組織を接続します。
![DevOps_Center__sf-developer-edition___Pipeline.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/9533f78e-93e5-f958-90e1-d7137e07fadc.png)

Stage Name「本番」を英語表記に変更して、Developer Editionの組織を接続します。

::: note warn
下記の記事でStage Nameが日本語表記のままだと、不具合が生じるとの記載がありました。
本番は関係ないかもしれませんが、一応変更しました。
[Salesforce DevOps Centerを触ってみた〜注意するポイント・期待すること〜](https://note.co-meeting.co.jp/n/n3fb9f17107d0)
:::



# プロジェクトの作業項目の作成と割り当て
[Work Items]から[New Work Item]をクリックします。
今回は、この後の作業としてLightningアプリケーションの作成をするので、作業内容に入力して保存します。
![DevOps_Center__sf-dev-edition___Work_Items.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/51930af8-6ae9-e72b-532a-cd559b682569.png)


タスクのIDをクリックして、「I want to develop and commit my changes to the work item feature branch from DevOps Center using a connected development environment.」を選択します。
※Sandboxやスクラッチ組織で作業を行う場合は上を、DevOps Center外 (開発環境に接続しない)で作業を行う場合は下を選択します。

![スクリーンショット_2025_02_12_1_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/daa1e11c-93f0-709a-8544-0e8fc459fd95.png)

開発環境が本番環境と同期していないと、下記のメッセージが表示されます。
![DevOps_Center__新規Lightningアプリケーションの作成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/c15a98ba-336b-ad28-6c44-fb4fa3ba8913.png)

Pipelineのページ遷移するので、開発環境の[Sync...]をクリックします。
[Changes to Synchronize]は下記の2種類です。
- Changes not in dev environment
　開発組織に存在しないもの and 差分のみを同期する
- All metadata in the UAT stage's branch
　上位組織を全て同期する
 
[Test Options]の[Default]を選択して、[Start Sync]をクリックします。
テストの選択肢は、変更セットの時と同じです。
![DevOps_Center__sf-dev-edition___Pipeline.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/46f06d6e-0f84-a7f7-5612-26ee8a7d336a.png)

少し経つと、同期が完了します。
![スクリーンショット_2025-02-12_1_12_15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/96b22feb-c394-2a45-44f5-464f4915d8f9.png)

再度、タスクのIDをクリックして、[Proceed]を押すとBranchが作成されます。
![スクリーンショット_2025-02-12_1_15_33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/d41930cc-cb99-b8c5-1a7e-318d584ccb53.png)



# Lightningアプリケーションの作成
スクラッチ組織で、Lightningアプリケーションを1つ作成してみます。

[新規Lightningアプリケーション]を選択して、情報を入力します。
アプリケーション名は、目の前にカエルの置物があったからです。特に意味はありません。
（今回のアイコンは[ICOON MONO](https://icooon-mono.com/)からお借りしました）
![Cursor_と_アプリケーションマネージャー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/c3b3fd31-96b7-5bf8-10e5-b3c6c1216d27.png)

下記のセクションは、デフォルトのまま次に進めます。
- アプリケーションオプション
- ユーティリティ項目 (デスクトップのみ)

ナビゲーション項目は、あまり触れたことのない標準機能を中心に追加します。
![frogs_-_Lightning_アプリケーションビルダー.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/c9c9b993-cdfb-c54d-5285-cd9fdbaf2dc9.png)

ユーザープロファイルは、全部追加します。
![アプリケーションマネージャー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/d129d6e8-9135-2d46-faba-d51947c161a4.png)

[設定]の[クイック検索]に[アプリケーションメニュー]を入力して、選択します。
新規作成したアプリケーションを一番上に配置します。
![アプリケーションメニュー___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/7ec164a5-594b-4e78-e2c0-81202292b799.png)

作成したアプリケーション[frogs]を選択すると、ホームが表示されます。
![ホーム___Salesforce.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/9d360161-1397-f328-bc7c-230b027c947e.png)

先ほど設定したので、アプリケーションランチャーの一番上に表示されています。
![スクリーンショット 2025-02-11 16.37.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/89963de4-1ad1-875c-cf86-cca2db2c3085.png)



# Commitの作成
開発組織で作業が終了したら、本番組織でDevOps Centerを開きます。
[Work Items]からタスクIDを選択して、[PullChanges]をクリックします。
変更部分が表示されるので、反映させたいものにチェックをつけて、[Commit Changes]をクリックします。
commitが完了すると、メッセージが表示されます。
![スクリーンショット_2025-02-12_1_48_28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/23438226-1053-199a-9cbb-631796c1c10b.png)

[Create Review]を押すと、自動的にPRが作成されます。
![2025-02-12_1_57の画像.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/3daa6571-50d1-596e-dc62-dd97d3a6c0d9.jpeg)

[Ready to Promote]を押すと、ステータスが[昇格準備完了]に変更されます。
![DevOps_Center__新規Lightningアプリケーションの作成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/c6d0eb29-9cb7-3f0a-485b-56301c989916.png)

本来は、テスト環境などを挟みますが、今回はすぐに本番へデプロイします。
デプロイする項目にチェックを入れて選択します。
[Promote Selected]をクリックします。
![スクリーンショット_2025_02_12_2_04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/b5111238-d9a0-e314-e9df-cb5aee779e87.png)

[Changes not in prod stage]と[Default]を選択します。
[Promote]をクリックして、デプロイを実行します。
![DevOps_Center__sf-dev-edition___Pipeline.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/ed257590-d4db-c629-e015-5e6adbb15ef9.png)

デプロイが失敗しました:no_mouth:
エラーが表示されます。
![スクリーンショット_2025_02_12_2_06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/2799ec08-79d6-3b63-cb82-980e499fbdf0.png)

エラーの詳細も確認することができます。
![DevOps_Center__sf-dev-edition___Pipeline.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/d3e9a43a-ac36-dbe3-a258-aa854a08eaa5.png)

右上の[Ready to Promote]のチェックを外すと、ステータスが[レビュー中]に戻ります。
![DevOps_Center__新規Lightningアプリケーションの作成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/0707d6b2-480e-cf47-b3dd-b9e548b161b6.png)

画像が足りないと怒られている気がするので、commitに追加します。
![2025-02-12_2_12の画像.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/3e454a5e-d54c-0a8a-e901-7edcd34060a0.jpeg)

# 作業項目のステータスを [なし] に変更する
その後も異なるエラーが表示されて、Lightningアプリケーションのデプロイはできませんでした。
代わりにカスタムオブジェクトを作成してデプロイします。

まずは、現在のWork Itemのステータスを変更します。
[Work Items]のメニューから、[Changes Status to Never...] を選択します。
![DevOps_Center__タスクのステータスを「なし」にする.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/605e24ef-d1fc-453b-90d4-efaadd922b60.png)

[Work Items]からWork Itemを新規作成します。
その後、開発環境（スクラッチ組織）で、カスタムオブジェクトを作成してデプロイします。
![スクリーンショット_2025_02_12_19_58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/37c2fd91-43c3-4b9e-a9f9-c0433c665d48.png)

再度デプロイすると、今度は成功しました。
![スクリーンショット_2025-02-12_19_54_08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3577266/d6c86973-da50-4291-9a95-aae6a0cfccb8.png)



# まとめ
今回はDevOps Centerを使って、本番環境へのデプロイをすることができました。
変更セットでの移送も慣れてはきたのですが、こちらの方が個人的にはわかりやすいです。

今までだと、気になったものを試しに触れても、実装まで辿り着かないことばかりでした。
しかし、最近はSalesforceや色々な知識が少しずつ身についてきたおかげで、つまづきポイントを乗り越えられることが増えてきました。

もう少しでエンジニアになって1年が経つので、多方面から技術を吸収して、良い形で2年目を迎えられるように頑張ります。