Salesforce Lightning Components Important Points

Component Bundle

A component bundle contains component or an app and all its related resources. All resources in the component bundle  follow the naming convention  and are auto-wired. for example, a controller <componentName>Controller.js is auto-wired to its component, which means that you can use the controller within the scope of that component.


Using Expressions

expression is a placeholder for the expression.

Anything inside the {! } delimiters is evaluated and dynamically replaced when the component is rendered or when the value is used by the component. Whitespace is ignored.

The resulting value can be a primitive, such as an integer, string, or boolean. It can also be a JavaScript object, a component or collection, a controller method such as an action method, and other useful results.


Global Value Providers

globalID : 

The globalId global value provider returns the global ID for a component. Every component has a unique globalId, which is the generated runtime-unique ID of the component instance.

$Browser:

The $Browser global value provider returns information about the hardware and operating system of the browser accessing the application.

$Label:

The $Label global value provider enables you to access labels stored outside your code.

$Locale:

The $Locale global value provider returns information about the current user’s preferred locale.

$Resource:

The $Resource global value provider lets you reference images, style sheets, and JavaScript code you’ve uploaded in static resources.

Lightning Component Considerations


We recommend that you don't depend on the markup of a Lightning component as its internals can change in the future. For example, using cmp.get("v.body") and examining the DOM elements can wreak havoc should the component markup change down the road. With LockerService enforced, you won't be able to traverse the DOM for components you don't own. Instead of accessing the DOM tree, you can rely on the component tree and take advantage of value binding with component attributes. For example, you'll go far with cmp.find("myInput").get("v.name") instead of cmp.find("myInput").getElement().name.


Important Points

Add the force:appHostable interface to a Lightning component to allow it to be used as a custom tab in Lightning Experience or Salesforce1.


Configure Components for Custom Actions

Add the force:lightningQuickAction or force:lightningQuickActionWithoutHeader interface to a Lightning component to enable it to be used as a custom action in Lightning Experience or Salesforce1. You can use components that implement one of these interfaces as object-specific actions in both Lightning Experience and Salesforce1. You can use them as global actions only in Salesforce1.

Configure Components for Record-Specific Actions

Add the force:addRecordId to a lightning component to enable the component to be assigned with the Id of the currently displaying record.

force:addRecordId interface when used it adds the recordId attribute to the component. this attribute is set to the currently visible record Id.

recordId is only visible when used directly in the component. But when used inside another component this attribute will get nullified.


Add a new interface to your component

To appear in the Lightning App Builder or a Lightning Page, a component must implement the flexipage:availableForAllPageTypes interface.

Mark your resources, such as a component, with access="global" to make the resource usable outside of your own org. For example, if you want a component to be usable in an installed package or by a Lightning App Builder user or a Community Builder user in another org.


Add SLDS to Lightning Components

In order to add SLDS styling to lightning components which are run from developer console. add below line of code to your lightning component

<ltng:require styles="/resource/SLDS105/assets/styles/salesforce-lightning-design-system.css" />