Aura is an open source UI framework used to create dynamic web apps for all devices on Salesforce platform. It is its modularity approach that makes it popular as you can break your web app development into various components that can interact with each other. Therefore, you can divide a project into different team members and develop a complex application conveniently. There are so many components and features pre-built that will enhance the development time to the least. Most importantly, you do not have to optimize your web apps for different devices. Aura framework comes in two versions. One version runs on Java backend and it is called Aura OSS. The second variant is for Salesforce1 platform and it is called Aura On The Platform(AotP).By Aura framework, people generally refer to AotP.
A Brief Tutorial On Aura Framework –
Before you get started with Aura framework, make sure you create a custom Salesforce domain name.
Namespace Convention –
Aura framework follows the namespace convention of <YourNameSpace: Component>. For example, for an input field, you have to use ‘ui’ as in <ui:inputFieldText> but for the rest, you have to use ‘aura’ as in <aura:event>. But Aura provides you the opportunity to change the namespace conveniently.
Developer Console –
Since Aura framework works inside Salesforce, you have to open Developer console from Admin User menu. Then you have to create a new application from File>New. You know that Aura contains various pre-built components and these components are nothing but a collection of files which are called Aura Bundle. Aura Bundle is more like a package in other programming languages. One of the reasons to use Aura framework is also that you can create independent apps that are free of your data in Salesforce.
Creating Components –
Using a framework is all about modularity and hence, instead of using a code repeated in different files, you can create a component on Aura and call it from another file to use it seamlessly. For that, all you have to do is write your code inside <aura:component> Code Here </aura:component> part. To embed the component in another file, you have to use the tag <aura:application> Call here </aura:application>. It is important to remember that you can add or integrate one component into another but you cannot add one app inside another. An app is a collection of multiple components.
Creating Events –
In Aura framework, there are two different types of events – component event and application event. Events are mainly used to pass data using <aura:attribute>. You can create an event from File>New>Aura Event. You have to specifically and explicitly mention event type. For example, if it is an application event, you have to write <aura:event type=”APPLICATION”> code here </aura:event>. If it is a component event, you can to replace APPLICATION by COMPONENT.
Creating Objects and Tabs–
Objects are used in Aura framework to store records and data like a small database. You can create an object from Create>Objects> New Custom Objects. After creating it, you can add the field name and type as per requirement.
To show the records stored in an object, you need a Tab. You can create Tab from Create> Tabs> Custom Object Tabs> New. Then a wizard will launch where you have to select the object and the style of the Tab.
Note: You can create your own CSS while creating an app. The option is available in the sidebar once you create a new Aura application from File> New > Aura application.
Some Common Warnings – There are some common warnings associated with if and iteration in Aura framework. There are scenarios when they occur and you should know the exact reason for their occurrence. Clean unrendered body warning occurs you use if statement unnecessary and you are not really using them yet they are consuming rendering time. Similarly, multiple items set warning is common when you change attributes multiple times in a rendering cycle to affect the speed of rendering unknowingly.
Summary Of How To Go About –