Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LWCでローカルコンポーネント開発 / Local development on LWC
Search
Yuichi Maekawa
November 13, 2020
Programming
1
910
LWCでローカルコンポーネント開発 / Local development on LWC
Salesforce Developers Meetup #24
Yuichi Maekawa
November 13, 2020
Tweet
Share
More Decks by Yuichi Maekawa
See All by Yuichi Maekawa
やらないことを決める
kaelaela
1
900
ハイインテグリティコミットメントを実現するスクラム開発の進化 / Evolution of Scrum for High Integrity Commitment
kaelaela
0
540
アルプのロードマップ変遷 / Alp Roadmap History
kaelaela
0
2.3k
ApexでPofEAA / PofEAA by Apex
kaelaela
2
410
Zap Your DX!
kaelaela
1
470
Clasp使ってGASを快適に開発する / Let's play Clasp
kaelaela
0
500
Clean ArchitectureとEffで変更に強いAPIを設計する
kaelaela
8
3.7k
こんなに違う!ScalaとKotlin
kaelaela
2
1.9k
Share apk via Bitrise
kaelaela
4
3.3k
Other Decks in Programming
See All in Programming
The rollercoaster of releasing an Android, iOS, and macOS app with Kotlin Multiplatform | droidcon Berlin
prof18
0
110
初心者がおさえておきたいAWS CDKのベストプラクティス 2024
konokenj
15
7.3k
Rubyのパフォーマンスプロファイリングの改善 / Enhancing performance profiling for Ruby
osyoyu
1
410
ピグパーティにおけるMongoDB CommunityバージョンからAtlasへの移行事例
10969hotaka
0
130
AWS CDKにおける「再利用性」を考える / aws-cdk-reusability
gotok365
6
1.3k
最近追加した型の紹介とその振り返り
aki19035vc
0
180
GraphQL はいいぞ! ~Laravel で学ぶ GraphQL 入門~
azuki
1
160
Javaの現状2024夏 / Java current status 2024 summer
kishida
4
1.4k
開発部に不満を持っていたCSがエンジニアにジョブチェンしてわかった「勝手に諦めない」ことの大切さ
sakuraikotone
28
16k
ドメイン駆動設計の実践
masuda220
PRO
19
5.2k
最古の関数型言語「Lisp」ことはじめ / lisp_in_kamiyama
uhooi
1
190
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
Featured
See All Featured
Design by the Numbers
sachag
277
18k
Bash Introduction
62gerente
607
210k
Designing Experiences People Love
moore
136
23k
Designing the Hi-DPI Web
ddemaree
276
34k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
16
1.6k
Mobile First: as difficult as doing things right
swwweet
219
8.8k
Leading Effective Engineering Teams 2024
addyosmani
3
300
Rails Girls Zürich Keynote
gr2m
93
13k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
149
45k
Raft: Consensus for Rubyists
vanstee
134
6.5k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
44
4.7k
Visualization
eitanlees
139
14k
Transcript
LWCで ローカルコンポーネント開発 Salesforce Developers Meetup #24 2020/11/13 Maekawa Yuichi
Maekawa Yuichi Twitter: @_kaelaela Software Engineer@ サブスクリプションビジネスの効率化 収益最大化プラットフォーム https://scalebase.com/
Webアプリ開発での一般的な問題 - 画面の複雑化 - 状態管理の複雑化 - 依存関係の複雑化 ↓ ソースコードの肥大化、保守性の低下 これらはSalesforceのパッケージ開発でも同じことが起こる
Lightning Web Component Web Components - 再利用可能でカプセル化された独自HTMLタグ作成のためのWeb標準API コンポーネント開発により、カプセル化、関心の分離、再利用性を高める システムの複雑化をコンポーネントで減速させ、開発を加速させる Web
Components x Salesforce = LWC
Salesforce開発の困るところ... ソースコードをSalesforce上にデプロイしないと見れない deployが長いとTwitterを見てしまうのが人の性 手元でsave & buildしてチェックして開発速度を上げたい
local dev server
Local development(Beta) Local開発環境にサーバーを立ててdeployし、即座に変更を反映、確認ができる 導入 - Sfdxプラグインをインストール - ローカルサーバーを起動 - 開発後保存すると即座にlwcフォルダ内コードがデプロイされる
これだけ!
@salesforce/lwc-dev-serverプラグイン プラグインをinstall $ sfdx plugins:install @salesforce/lwc-dev-server ローカルサーバーの起動 $ sfdx force:lightning:lwc:start
tips package.jsonにscriptを追加しておくと楽
tips
open http://localhost:3333
コンポーネント作成手順 - lwcフォルダの下にフォルダ作成 - HTMLで<templace>を使ってレイアウト作成 - jsでコンポーネントロジックを書く - Local dev
serverで動作チェック - Sandboxとか用意するといい - 使いたいページで<c-XXX>で導入 以上
HTML
JS
使うページのHTML
localhost:3333
Thank you! アプリケーション開発に起こりがちなコードの肥大化 - コンポーネント開発で乗り切ろう Salesforce開発のスピードをあげたい - Local dev serverを使おう
Component開発 - HTML/JSを書いて<c-xxx>で使うだけ!