Moving to Lightning? Should you learn about Aura or LWC?

January 2, 2023February 19, 2023 ~ Sara Morgan ~ 6 Comments

I have had a few people ask me this question and I think it is a good one, so I wanted to answer it in a post. First of all, for anyone not sure what the difference is between Aura and LWC, you might want to checkout this post I did.

As for the answer….wait for it…..It depends. It depends on:

How experienced you are as a Developer with JavaScript and HTML5, or modern development tools such as Visual Studio Code, Command Line Interfaces, GitHub? If you are very experienced and have even done work with React or Angular, then I would suggest starting with LWC’s. Developing with Aura components is a legacy method that Salesforce is not actively enhancing.
HOWEVER, If you are supporting or might be supporting a legacy Salesforce org? Knowing about Aura (and even Visualforce) is a very valuable skill set to have. For example, if you are doing work for a large org that is currently using many Aura components and there is no need to change these components, then having that Aura skillset can be invaluable. If you want to learn about Aura components, you night want to check out this course I did on Pluralsight. Most importantly, as of early 2023, LWC’s cannot be used to override standard buttons.

Like Salesforce Evangelists, I do think that LWC’s are the better alternative in terms of component performance, but if all you need to build are very simple components, then there is no reason why you cannot start with Aura and transition to LWC’s. To be entirely honest, LWC’s are more challenging to create for developers that are not already familiar with modern web development.

I hope this post helps anyone not sure about which technology to approach first. Feel free to reach out to me if you have additional questions or concerns.

Sara

Top 5 Tips for Working with Salesforce Extensions for Visual Studio Code

October 6, 2020 ~ Sara Morgan ~ 1 Comment

After spending quite a lot of time working with the Salesforce Extensions for Visual Studio Code and discovering many hidden gems, here is a list of my top 5 tips. Hope they help you in your development journey.

#1 – Install the Expanded Extension Pack

This VERY handy version of the regular Salesforce Extension Pack, includes not only all the core SFDX plugin’s, but all the third-party ones you might need, like Prettier, ESLint, etc.

#2 – Run Update as Often as Possible

This is perhaps the MOST important tip I will offer. Unlike the rest of Salesforce software, the SS Salesforce Extensions are updated every week. That’s right. And they are constantly adding really cool features, so if you have not run…

sfdx update

in a while, you are probably wayyyyy behind and need to do it immediately!

#3 – Use the CLI Help Feature

For all of you that depend solely on the Command Palette, you really need to start using the built-in help that is offered. Come on, the Terminal is not that scary.

Not only will you get access to some really helpful info, but you will learn a heck of a lot about the CLI in general. Start by just typing sfdx help.

Go even further down the stack, but use –help past the first level. For example, to see the help for the project create command, so the following:

sfdx force:project:create --help

#4 – Use Code Completion and Snippets

If you do a lot of work with Apex, then you definitely want to check out using the Code Completion and Code Snippets features. This can be really helpful when creating Apex classes or triggers (especially if you are like me and do not do it that often).

#5 – See all SFDX Commands

When you are first learning how to work with the extensions, it can be helpful to see a list of all the available commands. This is accomplished by entering the following command: sfdx commands

New Pluralsight Course: Getting Started Customizing Salesforce with Lightning Aura Components

July 2, 2020August 14, 2020 ~ Sara Morgan ~ Leave a comment

I am very proud to announce the release of my latest Pluralsight course, “Customizing Salesforce with Lightning Aura Components“. This is actually a total re-write of my most popular course, “Customizing Salesforce with Lightning Components”, released in 2017. The key word change in the title is the addition of the word, “Aura“.

New Pluralsight Course, which includes working with VS Code and the CLI

This course is different because at the time that course was released, Lightning Components were not called Lightning Aura Components AND most importantly, the new modern toolset known as Salesforce DX was not yet available. There were also no Lightning Web Components available yet.

I personally believe that for many developers, transitioning to LWC would be much easier if they were to first learn to build simple Aura components using the new modern tools first.

In this course, all those great shiny new tools will be used to build very simple Aura Lightning Components. The original course used the online Developer Console, which is what Trailhead still uses in all their content about Aura Components. On Trailhead, the new tools are only used for Lightning Web Components.

So, if you want to learn about building Aura Components, while also embracing the new modern toolset, this course is perfect for you. And if you want to learn about Lightning Web Components (LWC’s), then you can check out the “Building Your First Lightning Web Component (LWC) for Salesforce” course that I released earlier this year.

Either way, you will be knowledgeable in all the latest that Salesforce has to offer. I personally believe that for some developers, transitioning to LWC would be much easier if they were to first learn to build simple Aura components using the new modern tools first.

This course includes a GitHub Repo that features all the code covered in the course. The material covered includes the following:

Understanding the Lightning Component Framework

Refer to the following blog post #1 . In this post/Pluralsight module), you will learn:

Who Should be Building Aura Components?
Where Can Aura Components Be Used?
Anatomy of an Aura Component Bundle
Creating an Aura Component Bundle

Creating Aura Components with the Salesforce CLI

Refer to the following blog post # 2 .

Using an Interactive Development Environment (IDE)
Getting Setup with an IDE
Understanding Salesforce DX (SFDX)
Creating an Aura Component in Visual Studio (VS) Code
Exposing Aura Components to Lightning App Builder

Working with Data

Refer to the following blog post # 3 .

Working with Controllers
Working with Apex and DML
Creating a New Open Cases Component
Using the CLI to Load Data to Scratch Org
Enforcing Apex Security
What About Caching and Usability?

Working with Record Forms

Refer to the following blog post # 4 .

Working with Record Form Base Lightning Components
Creating a New Quick Case Component
Creating Quick Actions

Working with Salesforce Mobile

Refer to the following blog post # 5 .

Working with the new Salesforce Mobile App
Using the Salesforce Mobile App QuickStart Page
Wrapping Up

Building Your First Lightning Web Component for Salesforce Pluralsight Course is Live!!!

January 15, 2020January 15, 2020 ~ Sara Morgan ~ 2 Comments

I am so excited to finally announce that my new Pluralsight course, “Building Your First Lightning Web Component for Salesforce” course is Live!

New Pluralisght course "Building Your First Lightning Web Component for Salesforce"

The development of this course was a labor of love for me and I have to admit something I worked so hard on. I would not compromise the quality for anything (including the three deadlines I missed). Luckily, I was working with some of the best editors in the world (huge shout out to Bentley Lignell, Stacy Sohn and Austin Allen).

As for the course, it covers the following:

LWC Benefits and what are Web Components
Setting up you development environment with Salesforce, Visual Studio Code and Salesforce DX
Component Design using Custom DOM events
Working with Salesforce Data using the Wire Adapter and Debugging with Chrome Developer Tools
Converting Aura components and lessons I learned
Testing your JavaScript with Jest

In the course, we will be building an application that will look like this:

If you are looking for the final code created in this course, you can find it here.

For anyone that might not be a Pluralsight subscriber yet, here is a link to a free 10-day trial.

And finally, please feel free to send me your feedback on the course. Good or bad. I appreciate it all because it helps me to develop better content that meets your needs.

Lightning Web Components Have Arrived!

January 24, 2019 ~ Sara Morgan ~ 2 Comments

Yesterday, I had the huge honor of being able to attend (in person) the official launch of Lightning Web Components. What a day! Only 250 people were invited to this event, and I was one of them. And for any of you that did not get a chance to tune in to the live broadcast, you can check out the recording here.

ecwialwnskatytru+ovkpa — Our fearless leader Sarah Franklin leading off the broadcast

I know I work for Salesforce, but Lightning Web Components are simply AMAZING!!! Built on native web standards, one of the things that was shared by Dory Weiss (the VP of Engineering at nCino) was that she thought using Lightning web components was as close to future proofing as she could come for her organization.

liwvrvfksjyrroz0vo24va — Leah McGowen-Hare leading a panel of experts discussion

So what is it that makes Lightning web components (LWC’s) so amazing?

1.) Performance – Tests have already shown that LWC’s significantly out perform aura components (what used to be called Lightning components). Why are they so much faster? Well, aura components were built on the aura framework (hence the name). This adds a layer of abstraction (aka, more code that ends up getting executed). But, LWC’s are built entirely on “game changing” native web standards that are built-in to the browser. No extra code to execute.

Screen Shot 2019-01-24 at 11.10.03 AM.png

2.) Interoperability – LWC’s can be embedded inside of aura components, communicate with events and access the same underlying services. This is not an all or nothing thing. If you have already created a lot of aura components, there is no need for you to upgrade them immediately. You can take your time and target those components that are simple or having specific performance problems.

3.) Referential Integrity – LWC’s allow you to import static schema elements which gives you referential integrity. It makes your LWC’s metadata aware. This means that no one in your org can delete a field or object that is used in your JavaScript code. Boom!

4.) It’s FUN – In the words of Dave Carroll and just about every LWC pilot participant, developing LWC’s is fun! Gone are many of the pain points with developing aura components.

Ready to dive in? Check out the following resources:

Developer Docs

Introducing Lightning Web Components

Trailhead Quick Start: Lightning Web Components

Introducing Lightning Web Components with Recipes, Patterns and Best Practices

New Way to Cache in Lightning Components

December 30, 2018 ~ Sara Morgan ~ 2 Comments

One of the best ways to gain performance in your Lightning pages is through caching. I have spoken and written about how one Lightning best practice is to use Storable Actions. File_Server_Cache_Blue This means data served up from your server side actions is cacheable and after they are accessed the first time, they are super fast to render a second or third time. This is still a best practice, but what I wanted to make you aware of was that there is a new and even easier way to get the best of caching.

And, the best part is that you can get the benefits of caching using this technique for both your Aura components and any new Lightning web components you might create.

Prior to the Winter 19 release, if you wanted to cache data you had to call setStorable() for every action that called your apex method, such as in this example:

var action = component.get('c.getRacesDB');
action.setStorable();
action.setCallback(this, function(response) {
            // Code here to handle the response
}
$A.enqueueAction(action);

In the code above, I am making a call to an apex method named getRacesDB, and this will return to me a list of race data. To make that data cacheable, I only have to add the line of code that marks the action as setStorable. Even though this is only a single line of code, if I had multiple places that needed to call the getRacesDB method (which is very likely in a large and complex application), the setStorable line of code would have to be repeated.

With Winter 19 and the API version of 44.0 or greater, you can simply annotate your @AuraEnabled apex method with the cacheable=true attribute. You no longer need to use setStorable. For example, if I wanted to make getRacesDB method cacheable, I would just add the cacheable=true attribute and the data it returns will be cacheable for any actin that calls it.

public with sharing class ListRacesController {

    @AuraEnabled(cacheable=true)
    public static PageResult getRacesDB(Decimal pageSize, Decimal pageNumber) {
        // Code to return the list of races goes here

Just make sure to remember to use API version 44.0 and above when using this new attribute.

Relax, here are some important things to know about Lightning Web Components (LWC)

December 13, 2018December 14, 2018 ~ Sara Morgan ~ Leave a comment

On December 13, 2018, Salesforce announced the upcoming release of Lightning Web Components at Salesforce World Tour in New York. In a nutshell, Lightning Web Components is a new programming model that represents a big shift in Salesforce development towards web components and modern JavaScript development.

If you are an existing Salesforce developer, then that last statement may have made you cringe a bit and you may now be thinking:

made at imgflip.com

“Big Shift? Wait…What?”

“Didn’t we just go through a big shift with Lightning Components?”

“Are you saying I have to learn something new again? I am still not even sure how Lightning Components work. Please tell me you are kidding!”

To help ease your discomfort, or even if you are excited about the announcement, I will attempt to answer some questions you may have:

Aura Components aren’t going away and will work very well with LWC’s

And now you might be asking, “Wait, what are Aura Components?”

“Aura Components” are what was previously known as “Lightning Components”. They will now be known as Aura Components because there was a need to distinguish them from the new Lightning Web Components. The name “Aura” is used because these components are based on the Aura framework. Lightning Web Components are named as such because they are based on standard web components.

Basically, there are now two ways to develop Lightning components:

Aura components – what you have known as lightning components
Lightning Web Components – the new way to create lightning components

So if you have invested a lot of time learning about Lightning Components, don’t worry. Those components are not going anywhere and you can continue to create and use them. At the same time, you can start to learn about the new Lightning Web Components and once you are ready you can start building either kind, or both. The really cool thing is that LWC’s are designed to work together with aura components.

Components you build with LWC should render faster

LWC’s will take advantage of native web standards that exist in the browser. This means there is no added abstraction layer, like the Aura framework (or any framework for that matter) to slow things down. It also means LWC’s will most likely render faster than aura components.

That does not mean that aura components are bad and should be avoided. However, in cases where performance is really important to a components success, you should probably consider LWC’s.

Developing LWC’s is fun!

I have been fortunate to be part of the pilot for LWC’s and the overwhelming feedback that has been coming in from all the other people that are part of the pilot is that “Developing LWC’s is fun”. One reason it is fun, is because developers are able to finally use modern JavaScript syntax that has been off limits to aura components. And if you are not sure what I am talking about with modern JavaScript, check out this post.

As an added bonus, because LWC’s utilize common web standards, it should be easier to find developers with the skills to develop LWC’s. It might also be easier to transition existing developers to using LWC’s because there is no additional framework to learn.

You need to check out the new and updated apps in the Sample Gallery

You may not know this, but the Developer Relations team hosts a very cool sample app gallery available here. This app gallery features LWC updated versions of all the sample apps you have grown to love (like Dreamhouse and Northern Trail Outfitters), but it also includes two new sample apps you will love even more:

Recipes – This app is all about bite-sized (30 lines of code or less) LWC recipes. Once installed you will have access to several tabs and each one features multiple LWC’s that highlight a very specific use case. The best part about this app is that you can rest assured that best practices were considered right from the start. Feel free to use this as the starting point for all your new LWC’s.

E-Bikes – This represents what an actual retailer might build using LWC’s. It shows off all the best of LWC’s in a real-world kind of application.

You cannot create LWC’s in Dev Console and need to use VS Code and the extensions

Sorry to say, but you cannot create LWC’s in Developer Console. For now (and Safe harbor, note the word “now”), you will need to use Visual Studio Code and the CLI extensions for SalesforceDX. Now, just in case you have not dipped your toes into the world of SalesforceDX, this represents your perfect opportunity to get started. I would suggest you start by checking out this great trail on Trailhead.

Going GA in Spring 19 – At that time it will support LEX, Mobile App and Communities

LWC’s will not be generally available until the release of Spring 19, which should be in February 2019. But, there is no reason to wait until then. You can sign up for a pre-release org now and your first step after that should be to go to Trailhead and earn the Quick Start: Lightning Web Components badge. It only takes 20 minutes and it will get you setup with everything you need to start building your own LWC’s.

Hopefully, you are feeling a little less apprehensive about this shift. It truly is a GREAT time to be a developer and I have no doubt that in time you will come to love creating LWC’s. Have fun!!!

Modern JavaScript Development – What is it and why should I care?

November 14, 2018November 15, 2018 ~ Sara Morgan ~ Leave a comment

Are you an experienced software developer? Well, unless you have been living under a rock, you have probably heard at least once that you should learn more about JavaScript to remain relevant as a developer. You may have even heard the phrase “Modern JavaScript Development” tossed about like knowing what that means is just common knowledge. But is it? I don’t think so.

I am very happy to announce that a new Trailhead module I have been working on called, Modern JavaScript Development was just released. It is part of a new trail called Learn to Work with JavaScript. This trail not only features my module, but one written by the fabulous developer Evangelist, Peter Chittum that was released in September called JavaScript Skills for Salesforce Developers.

My module was written specifically for Trailblazers that only have a basic understanding of the syntax and features of JavaScript ES5. And if you don’t know what I mean by ES5, then it is also for you. Basically, if you have ever copied some JavaScript and maybe not understood everything it does, then this module is for you. Along with the one that Peter wrote.

And here are just some of the things you will learn in this module:

Describe the current state of JavaScript development.
Describe the difference between function and block scoping.
Recognize shorthand ES6+ syntax used to initialize variables.
Identify the new destructuring syntax used to separate data.
Identify the backtick character used to create template literals.
Recognize the fat arrow syntax for functions.
Explain why defining optional parameters in ES6+ results in cleaner code.
Describe the different uses for the ‘…’ operator.
Explain what’s different about how you create and invoke classes in ES6+.
Recognize the basic syntax and different importing styles used to define modules.
Demonstrate how asynchronous calls can be chained together using promises.
Demonstrate how an async function can be used to call a promise.
Identify the different elements used in a Jasmine testing script.
Create a simple Jasmine test suite and run it stand-alone.

Sound exciting? I hope so. And I hope you find the module useful. There is an awful lot that can be said about Modern JavaScript Development and ES6 specifically, but I tried to boil it down to just the most important things I thought you should be aware of.

And finally, if you want to learn even more about JavaScript and Salesforce, you should also check out Dan Appleman’s FREE Pluralsight course called Getting Started with JavaScript in Salesforce.

Not to be missed Developer Content on Trailhead

October 5, 2018 ~ Sara Morgan ~ Leave a comment

THLogo Ok, I know I work for Trailhead and so I am a little bit biased, but I just have to say that we released some incredibly awesome developer-based content in September. If you are a serious Salesforce developer that has been waiting for some juicy content from Trailhead, I think you will really like what we have out right now. This post highlights my favorites.

Got Slack?

A lot of teams do and they love it. If your team does, wouldn’t it be cool if you could integrate Slack with systems in your own company? Well you can. Using webhooks, you can bring notifications and data in from other systems and build your very own Slack app. You can even use AI services to create your own intelligent Slack bot.

To get started, check out this beginner module, Slack Development Basics. Once you know the basics, you can move on to working through the Build a Welcome Bot for Slack. In that hands-on project, you will use Node SDK’s and the Slack API’s to build a welcome bot that interacts with users that signup to your channel.

What about Heroku?

If you have not been playing around with Heroku, then you are missing out. Seriously! Heroku is such an incredible platform and EVERY Salesforce developer should be looking at how they can work with it to deliver incredible online experiences.

We have two new projects that you need to check out. If you are new to Heroku, then look at Quick Start: Build a Java App on Heroku, which is a simple three step project that will get your feet wet with creating, deploying and scaling a simple Java app on Heroku.

More experienced developers wanting to see a rich end-to-end solution will want to move straight to Develop a Heroku App that Integrates with Salesforce, which walks you through installing the Dreamhouse App to Heroku and then setting up Heroku Connect so that property data is synced both ways between your Salesforce org and Heroku app. You will even see how to implement continuous delivery through Heroku Pipelines and Flow.

Need to know more about JavaScript?

Every Salesforce developer should be trying to enhance their JavaScript skills since the Lightning platform is all about JavaScript. JavaScript Skills for Salesforce Developers is just what you need to learn the key JavaScript skills that you need to take your Visualforce pages and Lightning Components to the next level.

Think you know enough about Unit Testing?

I bet you could learn some more and I know just the module to help. This new module called Unit Testing on the Lightning Platform dives deep into topics such as positive and negative testing, using a mock and a stub, as well as permission-based testing. It even covers testing JavaScript with the Lightning Testing Service.

Finish it all off with Alexa

Ready for some fun? We have a super fun project that uses a new voice platform called Violet to build an Alexa-based app that links back to your Salesforce org. Quick Start: Violet will walk you through setting up an Alexa Skill that lets you plan a game night for your friends.

Have fun!!!