Lightning – Create or Place a Component Dynamically.

Your Mark.up

<aura:component>
<div aura:id="YOUR_DIV_ID"/>
</aura:component>

Your Controller.js

DoInit:function(component, event, helper){
$A.createComponent("c:ComponentName",
                      {"recordId": t },
                      function(cmp, status, errorMessage){
                           var divComponent = component.find("YOUR_DIV_ID");
                             if (divComponent.isValid()) {
                                   var body = divComponent.get("v.body");
                                   body =[];
                                   body.push(cmp);
                                   divComponent.set("v.body",body);
                               }
                     }
  );
}

References : https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/js_cb_dynamic_cmp_async.htm

The syntax is:

$A.createComponent(String type, Object attributes, function callback)

Type—The type of component to create; for example, “ui:button”.
attributes—A map of attributes for the component, including the local Id (aura:id).
callback(cmp, status, errorMessage)—The callback to invoke after the component is created. The callback has three parameters.
cmp—The new component created. This enables you to do something with the new component, such as add it to the body of the component that creates it. If there’s an error, cmp is null.
status—The status of the call. The possible values are SUCCESS, INCOMPLETE, or ERROR. Always check the status is SUCCESS before you try to use the component.
errorMessage—The error message if the status is ERROR.

5 Lightning Tips for Visualforce Devs!

About an year ago, the word “Lightning” was a bit daunting, not because there were less information available to admins and developers, but as we were so used to Sales-force Classic that we were not ready to acquire this fascinating skill that time. Nowadays, things are rapidly changing and everybody is getting on to the lightning aspects. This is leading to increase in demand for LEX and Custom Component Development.

Most of the enterprises are migrating to Lightning experience from their traditional classic Salesforce application. This causes for a big ask for Salesforce developers who has hands on experience on Lightning framework.

I’ve been working on Lightning since a year and still exploring more exciting features while developing custom lightning components. So, here are some tips to help Visual-force Page Developers while working on Lighting.

1) #Lightning Component Development Tools :

Below specified tools will help you in Lightning component development.

  1. Force.com IDE – You just need to install a new version of force.com plugin and you can directly start the component development there.
  2. Developer Console – Salesforce developer console is the most ideal one for developing the Lighting Component.
  3. Salesforce Lightning CLI – Use CLI Tool to validate your code for use within the LockerService Service Architecture.
  4. Salesforce Lightning Inspector Chrome Extension – The Salesforce Lightning Inspector is a Google Chrome DevTools extension that enables you to navigate
    the component tree, inspect component attributes, and profile component performance. The extension also helps you to understand the sequence of
    event firing and handling.
  5. Sublime Text 3 – This tool is also available for lightning development.

2) Available Documentation : It always helps us to learn a new technology or new way of development. If every thing is documented, it becomes so easy to understand and apply.
That’s why we love Salesforce Trailhead.

  • Lightning Trailheads – Apply your learning skills with the new approach provided by Salesforce. There are various trailheads added for Lightning.
  • http//yourinstance.lightning.force.com/auradocs – This page will show you the aura standard components along with custom developed components in your org. Just replace “yourinstance” by your own org’s instance.
  • This is a lightning component development guide.

3) Base Lightning Components : Remember, we used to refer the “Component Reference” while designing the visual-force page. Now, we have the same one for Lightning Components. But it is just that instead of Apex tags, Salesforce has added base lightning components which are useful for Lightning experience, Salesforce1 and Lightning commuties user interfaces.

For more details, refer this link – Lightning Overview

basic-lightning-com

4) Error: In Development process we do mistakes and the new error log view is very useful to know where the code is breaking with new error log UI.

lighting-error-message

5)  Security Works Differently : As Visualforce developers, you have been spoiled as far as security is concerned. Visualforce apps operate out of the Force.com domain, which is not shared with Salesforce code. But, Lightning apps and components run in a special domain that is shared with Salesforce-authored Lightning code.

This means that the security for Lightning components are subject to a Content Security Policy (CSP). The rules surrounding what is and what is not allowed with these components will just tighten as time goes on. Go here to learn more about all the concerns regarding Lightning Security.

One important thing that you need to know is that any of your AuraEnabled Apex classes must do an explicit check for CRUD and FLS permissions. This was handled automatically for you in Visualforce pages, but in Lightning, unless you are using the new Lightning Data Service, you will need to do this check manually. You can do so using the isAccessible(), isCreateable(), isDeleteable(), and isUpdateable() methods. You can learn more about how this is done here.

Extras Points

6)  CSS (Cascading Style Sheets) : I really like the CSS feature of Lightning. if you are using the same class name for two different components, still you don’t have to worry about the fact that they may collapse with each other some day. (.this) allows you to separate style sheet for different components.

7) Returning Errors from an Apex Server-Side Controller :

Errors happen. Sometimes they’re expected, such as invalid input from a user, or a duplicate record in a database. When your server-side controller code experiences an error, two things can happen. You can catch it there and handle it in Apex. Otherwise, the error is passed back in the controller’s response.

When you use an AuraHandledException you have an opportunity to add some detail back into the response returned to your client-side code.

8) How to get URL Param :-

urlparam