Scribd
Upload
136 views5 pages

Lightning Web Components Book

Uploaded by

Kaleem
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
136 views5 pages

Lightning Web Components Book

Uploaded by

Kaleem
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Lightning Web Components

Purpose of the zine


Purpose of the zine is to make sure that you get acquainted yourself with LWC in a couple
of hours and start be able to create your own Lightning Web Components.

In that process you will get a fair understanding of the main concepts used in LWC, you
will be able to understand how things work behind the scenes and best practice to build
Lightning Web Components.

This works very well in case you want to revise all the key accepts in LWC in less than an
hour.

However, there are a lot of other things that’s not mentioned in the book, as the purpose is
to keep it simple, make sure you understand the basics and get started.

Will I become an expert in LWC if I read this?


You will understand all the concepts that revolves around LWC. However a lot of practice is
need to become an expert in LWC.

Any Prerequisites?
I have prepared this zine with the assumption that you know Aura components. However,
in case you don’t know Aura components, it shouldn’t be a problem when it comes to
understanding LWC.

What’s next?
Follow me @kkteja on Twitter for more updates.

Table of Content

Introduction
What’s the Lightning Experience
WhyLightning?
Why not ReactJS or other frameworks?
What are Aura components?
What’s the problem with Aura Components?
Why LWC?
Should I start with Aura or LWC?
What is component based framework?
Give a requirement how can I break it in to small reusable components?

Creating your first LWC


Template File
JavaScript File
What’s Import & Export
Should I end a statement with Semi – Colon?
Configuration file
Additional JS Files
Tests
A little more about namespaces

LWC in Detail
Variables vs Attributes vs Properties
DataBinding
Conditional Rendering
RenderingLists
Few things to know about Decorators
Terminology & Behaviour of Components
Data Flow
Slots
What’s DOM
What’s shadow DOM
Working with static Resources
Calling API from JavaScript
Life Cycle Hooks

Lightning Data services (LDS)


<lightning-record-form></lightning-record-form>

<lightning-record-view-form></lightning-record-view-form>

<lightning-record-edit-form></ lightning-record-edit-form>

Lightning Data services with Adapters


getRecords()
createRecords()
updateRecords()
deleteRecords()
Working with Apex
Wiring property with Apex
Sending data as params to Apex
Wiring JS function with Apex
Call Apex method Imperatively

Events
How to work with basic Events
How to pass data in Events
Handle Events
Programatically
Declaratively
Phases in Events
Bubbling
Capturing
Various configuration in LWC
A little about pub-sub

Navigation in LWC
Lightning Out
Aura Coexistence

What Is Lightning Experience?

Introduction
Lightning Experience is representation of salesforce in a new way altogether.

Salesforce took the advantage of modern JS and rebuilt quite a few things.

Why Lightning?
Salesforce already had Apex & Visualforce which are pretty much mature.
But they were built keeping in mind desktop computing. Back then mobile computing was
not a thing.

Also, in parallel around 2015 there is a huge shift in IT sector because of JavaScript.
Earlier when we wanted to build a desktop app, we had to do it in three variants, once in
Windows, Once in Mac and once in Linux. With ElectorJS things changed a lot. We write
apps in native HTML, CSS and JS and we can export a Windows variant, Mac variant and
Linux Variant.

When we had to build an app for iOS and Android platforms, we had to built in twice once
for iOS ecosystem and once for Android, with React Native things changed a lot.

Salesforce wanted to give that the power to Salesforce Developers.


Customising existing framework to match the new JS standards was hard(maybe) rather
than building a new framework altogether. And then salesforce did come up with a new
framework altogether.

Why not ReactJS or other Frameworks?


They are not tightly integrated with salesforce ecosystem like, sobjects, Apex, Static
Resources and etc

What are Aura Components?


Salesforce came up with Aura Components initially, where we are supported to write Aura
code and they will be compiled to native JS in runtime.

What is the problem with Aura Components?


Salesforce started working on Aura Framework even before modern JS came into picture.

If a new feature is added to modern JS or web components, it has to be reimplemented in


Aura Components.

Why LWC?
Salesforce wanted a framework that religiously follows web components standard and has
all the advantages of modern JS. Hence it had come up with LWC.

Should I start with Aura or LWC?


Always try to use LWC and in case if there is any limitation in the framework that is
stopping you from using LWC then hop on to Aura Components.

What is Component based Framework?


LWC is a component based framework.
Given a requirement, we have to break it down in to small, modular, reusable components,
where each component is super independent and reusable.

An example is, Google was working on a conceptual mobile phone called project Ara.,
where we can build a mobile phone by combining together camera components, battery
components, memory card component and etc.

What we do in LWC is pretty much similar. We build a feature but putting together small,
reusable pieces

You might also like