Learning how to develop Lightning Web Components (LWC) brings with it many benefits: they follow the most modern web standards, they’re easy to reuse inside and outside the platform, they’re highly performant and they adapt well to different form factors. However, we know that moving from Visualforce to LWC is not easy, as Lightning Web Components are developed in a pretty different way. To help you through the transition, we’ve released some amazing resources that you can leverage! Let’s take a look at them:
Trailhead content
As we love Trailhead and we believe it’s the best way to learn, we’ve released three badges that will help you on your way towards Lightning Web Components development:
- Lightning Web Components for Visualforce Developers: This is a Trailhead module that will allow you to take advantage of the concepts that you know from Visualforce while learning the LWC development process. You’ll learn how Visualforce and LWC architecture differs, and how some coding concepts are similar. You’ll learn how the Lightning Data Service can give you a direct replacement for Apex in some cases and how you can still use Apex code when the need arises! You’ll also learn how to navigate to pages and how to reuse Visualforce with LWC.
- Quick Start: Explore the Visualforce to LWC Sample App: We’ve just released five quick starts to introduce some of the apps in the Sample Gallery. And, yes! There is a new app called Visualforce to LWC that you can deploy to your org to take a look at code examples that implement patterns found both in Visualforce and LWC. Let’s talk a bit more about the app in the next section.
- Lightning Web Components and Salesforce Data: This module is targeted for all LWC developers, not just developers with a Visualforce background, but we’re sure it’ll help you in your transition. It explains when and how to use Lightning Data Service or when to go for Apex to work with Salesforce data in detail, and how to handle server errors in both cases.
Visualforce to LWC sample app
To help you understand how some typical Visualforce patterns are implemented in LWC, we’ve created the Visualforce to LWC sample app. The app includes examples that show how to replace typical layout patterns, how to create UIs to work with single, mixed and lists of records, and how to implement error handling patterns.
The best way to start with the app is to tackle the Quick Start project, but if you want to directly take a look at the code, check it out here, it’s open source.
Visualforce to LWC series Trailhead Live sessions
Additionally, we’re hosting a series of Trailhead Live sessions called “Visualforce to LWC Series” that explain all these concepts in detail. We’re presenting each session both in English and in Spanish.
- Architecture and Coding Concepts: In this session we introduce the web standards on which LWC is based and how to configure your environment for development and debugging. We review the architectural differences between Visualforce and LWC, and we take a look at some of the Visualforce coding concepts that you can extrapolate to learn LWC.
- Coding Concepts Continued: We continue reviewing coding concepts, as template directives, how to call JavaScript, component composition and the navigation service. We also take a look at the base components and how they match Visualforce standard components.
- Working with Salesforce Data: In this session we talk about the different ways to work with Salesforce data in LWC. We see how to use the different form base components, Lightning Data Service and Apex.
- Combining Visualforce and LWC: In this last session, we review the different ways to use Visualforce with LWC. Either using Lightning Components for Visualforce or the Lightning Message Service.
Watch the sessions on Youtube in English or in Spanish.
Next steps
Now you have a variety of resources to start with! There is not a required order for these, so tackle whichever one you are most comfortable with first, then continue with the other resources.
Do you have questions? Ask them on the Trailblazer community, the Salesforce Stack Exchange or Twitter, or you can also connect with us during the upcoming Trailhead Live sessions. We’ll be happy to help you. Happy coding!
About the author
Alba Rivas works as a Lead Developer Evangelist at Salesforce. She focuses on Lightning Web Components and Lightning adoption strategy. You can follow her on Twitter @AlbaSFDC.