Salesforce are pushing, and pushing hard, for customers to transition into the newer Lightning UI. That's not to say that Visualforce is going away any time soon, but it's time to think about moving with the cheese!
Where to start?
Choose a migration strategy
Patterns for Migrating from Visualforce to Lightning Componentshttps://t.co/l5v4pJ7Veo #Salesforce #salesforcedevs
— Daniel Ballinger (@FishOfPrey) July 25, 2016
Mike Topalovich did a great blog series and presentation on migrating from Visualforce to Lightning.
In Part 1 he covers the background on Visualforce and Lightning so you know what each is an isn't.
In Part 2 he covers the roles Visualforce can play in Lightning.
Finally, in Part 3 he covers migration strategies for getting an existing org into Lightning.
Adopt the Lightning Design System in Visualforce
I recently completed a project to create a public facing Sites page for some Salesforce data. As it was a new project I thought I'd use a Lightning App and components to put it together. However, as at Winter'17, a Visualforce page that is rendering in a public facing site won't work if it contains a Lightning Component.
Instead I opted to use the Salesforce Lightning Design System (SLDS) with existing Visualforce components. I found this to be a good introduction to the SLDS as I was still using the very familiar Visualforce components.
The first thing I realized about the SLDS was all form and no minimal function. Take the Trees for example. You get a collection of CSS classes and attributes to apply, but must provide all the JavaScript functionality to apply and toggle those classes and attributes as required.
As part of the design for this new page I tried to focus all the page content into separate Visualforce components that communicated via JavaScript. Hopefully with the features come to use Lighting components in this scenario the transition will be easier.
See also, the Trailhead Lightning Design System module.
Locker Service
Coming back to needing to provide all the JavaScript logic to use the SLDS, it's important to consider the compatibility of any third party code you are bring in with the LockerService. See Introducing The LockerService For Lightning Components
Getting helps - Salesforce StackExchange
As always, the Salesforce StackExchange postings on lightning and lightning-components can be great resources for specific questions.
I found these ones in particular interesting:
- Guidance on styling existing Visualforce pages adequately in Lightning Experience without major rework
This is interesting as a stop gap measure to make Visualforce based pages use the SLDS. - What is suggested approach to transfer VF pages to be lightning ready
This features a Visualforce page template to apply the SLDS styling.
Developer Tools
The following tools can make if much easier to develop and debug lightning components
- Install the Salesforce Lightning Inspector Chrome Extension
Salesforce Lightning debugger extensions in Chrome. Via @msrivastav13 at #MidwestDreamin16 pic.twitter.com/yXjlWgvMAp
— Daniel Ballinger (@FishOfPrey) July 22, 2016 - Enable the Debug Mode for Lightning Components
Trailhead
At the time of writing there are 11 modules on Lightning in Trailhead targeting developers.
- Lightning Experience Basics
- Lightning Experience Development
- Visualforce & Lightning Experience
- Salesforce Connect
- Lightning Components Basics
- Lightning Experience Data Management
- Process Automation
- Lightning App Builder
- Lightning Apps
- Lightning Alternatives to JavaScript Buttons
- Lightning Design System