Start tracking your progress
Trailhead Home
Trailhead Home

Get Started with Lightning Development

Learning Objectives

After completing this unit, you’ll be able to:

  • List the key benefits of the Lightning Component framework.
  • Explain how to use both low-code and pro-code tools to increase your productivity.
  • Describe the standards, services, and files that form Lightning Web Components.

Hey Visualforce Developer, Welcome to Lightning Experience!

If you are an experienced Visualforce developer who wants to build modern and engaging user experiences with the best Lightning Experience tools, you’ve found the right place. 

Prerequisites

To get the most out of this module, you should have experience writing JavaScript and an understanding of the role JavaScript plays in the Lightning Component framework. If you haven’t already completed the Learn to Work with JavaScript trail, we strongly recommend that you do that now.

Even though Visualforce still works in Lightning Experience, you can build more seamless, engaging, and responsive user experiences with Lightning Experience tools. In this unit, we share why we developed the Lightning Component framework, consider two approaches to developing user interfaces for Lightning Experience: low-code and pro-code, and describe the fundamentals of Lightning web components.

Lightning Experience and the Lightning Component Framework

Designed and optimized for the web of 2006, Visualforce was based on a technology stack that aligned with other enterprise solutions of its era. The server-side rendering of Visualforce met the user requirements of the time. 

After 2006, however, the landscape changed. Today, users expect more interactive, immersive, and responsive experiences. To meet those requirements, Salesforce launched Lightning Experience, built on the Lightning Component framework. 

Instead of building monolithic pages with Visualforce, developers create small building blocks of Lightning components and assemble them in many ways to create different user interfaces. 

Benefits of the Lightning Component framework include:

  • Component reuse across Salesforce, maximizing developer productivity
  • Easy extensibility of app functionality
  • Custom components: download them from AppExchange or create your own
  • Builders that help you create responsive designs that are optimized for mobile devices
  • Base components that work great across device form factors

UI Development in Lightning Experience: Low-code and Pro-code

Salesforce offers two ways to build user interfaces (UI) in Lightning Experience: low-code and pro-code. 

  • Use low-code point-and-click tools to implement business logic or build user interfaces.
  • Use pro-code tools to write your own code and fully customize your apps.

As a developer, when you begin developing something new, your instinct may be to start coding immediately. Instead, consider using low-code tools to get a headstart. If you use low-code tools for the repetitive boilerplate work, you have more time to spend on coding for complex requirements. As a bonus, the solutions you build with low-code tools are easy to change and extend with both low-code and pro-code tools.

UI Development in Salesforce

Low-code Pro-code
  • Lightning pages
  • Quick actions
  • URL buttons
  • Utility bar
  • Flows
  • Lightning Web Components
  • Aura Components
  • Visualforce

If you’re not familiar with Lightning Experience low-code solutions, we strongly recommend learning about them by earning these Trailhead badges.

For pro-code tools, Salesforce provides two Lightning programming models: Lightning Web Components and Aura Components. We won’t dive too deeply into them here, just know that Lightning Web Components is the preferred way to develop custom UI in Lightning. It is more performant, easier to build, and more portable. If you’re interested in learning more about the differences between Aura components and Lightning web components, read the Get to Know Lightning Experience unit in the Lightning Experience Basics module here on Trailhead.

Lightning Web Components Fundamentals

Lightning Web Components is a lightweight programming model based on the web components standards. It abstracts the more complex parts of the web components API and manages the component lifecycle, allowing you to write components easily, with less boilerplate code.

Lightning web components consist of HTML, JavaScript, and CSS. The skills that you learn writing Lightning web components are transferable to any other JavaScript-based technology. 

Lightning web components are isolated and secured by the Lightning Locker service. Lightning Locker enforces JavaScript strict mode, provides DOM access containment, uses secure versions of global objects, and follows the Content Security Policy (CSP) standard to prevent code injection attacks. 

Note: Before continuing, we recommend that you read the Discover Lightning Web Components in the module. There you’ll learn more about the foundations for Lightning Web Components and the files that shape a Lightning web component.

Resources