＜概要＞ アプリケーションの品質と生産性を向上させるためには、適切なプラットフォーム及びフレームワークの選択と、それに適した開発ツールを利用することが重要です。今日求められるモダンなエンタープライズアプリケーションを開発するにあたり、Salesforce DXとLightning Web Componentsを組み合わせれば最適解の一つとなり得ます。 こちらの資料では、この2つのテクノロジを組み合わせたアプリケーション開発方法とその利点について解説します。 ＜ご紹介する内容＞ Salsforce DXとは? Salesforce DXの利用方法とTips Lighting Web Componentsとは? Lighting Web Componentsの利用方法とTips 参加対象者 : Salesforce 開発者

1. ,
, C
,

2. A I ,AA 9 0F F F
0F F F F - F 0 5 F E , F 9 F A A 5F A
1 E E F F A K 5A F A I AA 9 EF F FE F F A E E 5 F F E EE F A E K E 5 5 F F E
F L A K A F EE F A E A E 5A 5F F E FE A E E A 5 5A 5 5A F K A F E FE
EE A K F A I AA 9 EF F FE I EF F FE AF F EF F FE A EFA 5 5F 5A
A I AA 9 5 9 K A 5F A E A A 5F A E 5 FK E E5 9 AIF 9E E A AF
5 F E K EF F FE 9 9 EF F 9 E A E A 9 F A F A F A E EF F FE A K
EF F FE 5A 5 9 I A 9 E 5 E A F 5 A A9K A FE 5 EFA 5A F 5FE A E A A E 5 E
1 E E 5 F F E FA A 5 F AF F FA E E EEA5 F I F A 9 9 I
5F A FK A A E 5 I A 5FE E 5 E A I E EE A A EF A F 9 AEE E AEE 5F F A E A
A F 9 E FE F A 9 AIF F F A E A KE A AEF 9 5 A A E 5 FK E E F A F5A A K
F 9 F A E E EEA5 F I F 5A F K AEE 9 E 5C E F A E F F F I 5 I A F A
F K F A F 9 EFA K A FK FA F AF F A AK E 9 A 9 AIF I E E A
A E 5 E 55 EE 5 EFA AK F A F EFA K E 9 A E E A 5 5A A 5FE F L F A E 9 FA
9 F E 5 EFA E F A F A A AF F 5FA E F F 5A 5F F 5 E FE A E E A 5 5A 5 E
5 A A F A A A F AEF 5 F E5 K A C F K A F A A . A F AEF 5 F
E5 C F 1 E A5 FE AF E 5A F 9 A F F E5 AE E A F 0 9E E 5F A A F EFA
A F A E 5F A A A E F
K E E 5 E A F E 5 F E A AF E F F A E EE E E A 5 EF F FE AF 5 F K
K AF A F A F EFA E I A 5 E A E 5 E E A F 5 E 5 E A E E
A F E F F 5 F K 0 E A 5 5A 5 EE E A A 9 F A A E AF F FA F F E A I
AA 9 EF F FE

3. Salesforce DX
Lightning Web Components

5. ( )(

6. DD OP
B
C
D D

8. •
•
•
•
•
•
•
•
•
Principles of Modern Application Development
https://www.nginx.com/blog/principles-of-modern-application-development/

10. SaaS
Additional
Dev

11. Salesforce DX

13. Salesforce

14. S
• ec
l S
• oS
S
• S
• D
S Xa f

15. Developer Experience (DX)

16. Salesforce DX

17. Salesforce DX

18. Salesforce CLI -
Salesforce CLI
• CI
•
•
•
•
sfdx

19. Salesforce CLI -
sfdx force:org
• (Dev Hub , )
sfdx force:source
• (Push & Pull)
sfdx force:mdapi
• Metadata API Deploy
sfdx force:data
•
–h or –-help

20. Dev Hub
• -
• Sandbox
•
• Edition
• Features
• Preference
• CI/CD
• 1 Dev Hub 1 80
• DE 1 5
Salesforce CLI/API
Edition 1 Scratch Org Scratch
Enterprise 80 40
Unlimited 200 100
Performance 200 100
Developer Edition 5 20

21. ● Salesforce CLI Integration
● Apex
● Apex Replay Debugger
● Apex Interactive Debugger
● Aura Components
● Visualforce
● + Lightning Web Components
Visual Studio Code
Salesforce Extension Pack

22. Demo

23. D L I
C
CLI Engine
Plugin Management Interface
Custom
Plugin
DX Toolbelt
DX Language
Services
Lightning CLI
Plugin
Custom
Plugin
Config Logging Auth/ TransportFlags/Args
SFDX-Falcon ISV
https://qiita.com/atskimura/i
tems/37c6f58d000189dc7a9
d
Salesforce
sfdx-
migration-automatic
https://qiita.com/stomita/ite
ms/8d4afe92402ed66a4f97

24. Lightning Web Components

25. ( ( b 6 cm6 6
6
( ( ) ( aCA A J
S ES oe i
p ( + n
Lightning Web Components
Salesforce

26. 2014 Web Stack

27. ●
●
●
●
● JS

28. W3C ECMAScript
● ECMAScript 6,7,8,9
● Classes
● Modules
● Promises
● Decorators
● Web components
● Custom elements
● Shadow DOM
● Templates and slots

29. 5
2014 2019

30. 0 0
C 1 2 19 1
2014 2019

33. https://developer.salesforce.com/docs/component-
library/documentation/lwc/lwc.reference_decorators
@api
●
●
@track ●
@wire ● Apex

34. Lightning Web Components
●
●
●
●
●

35. Demo
github.com/trailheadapps-jp/ebikes-lwc-jp

36. Lightning Web Components

37. : Lightning Web Components
1. Template Lightning web component ?
a. HTML
2. @track JavaScript ?
a. HTML
3. Lightning web component ?
a. Salesforce CLI, vscode
4. (cacheable=true) Apex ?
a. platform Apex

38. 1.
2. Salesforce DX Salesforce
3. LWC