Quick start with Salesforce Lightning components

Step 1: Sign up for a Developer Edition Environment

1. Go to: http://bit.ly/lightningcomponents

2. Fill out the form, noting the following:a. Make sure to use an email address you can easily check right now.b. The username is in the form of an email address, but it doesn’t have to be the same as your email address. your.name@DF14.com is a perfectly good username, even if it isn’t your actual email address.

Step 2: Create a Namespace

Every Lightning component is prefixed by a namespace, so the first thing you need to do is

register for a unique namespace.

1. Click Setup | Create | Packages and then click Edit.

2. Click Continue.

3. Type a namespace and then click Check Availability to see if it’s unique.

4. Click Review My Selections and then Save.

Step 3: Enable Lightning Components

1. From Setup, click Develop | Lightning Components.

2. Select the Enable Lightning Components checkbox and click Save.

Step 4: Create a Lightning App

Bundles are like folders that hold related files. The first bundle you’ll create is an

app bundle.

1. In your Developer Edition (DE) environment, Click <your_name> and then Developer

Console.

2. Select File | New | Lightning Application.

3. Name it HelloWorld and click Submit.

Step 5: Edit the App

1. If HelloWorld.app isn’t open, click APPLICATION in the sidebar.

2. Add some HTML, such as My First Lightning App!

     <aura:application>

            <h1>My first Lightning app!</h1>

    </aura:application>

3. Save the app.

Step 6: Test the App

In the Developer Console, click the Preview button on the sidebar to open the app.

Step 7: Create a Component

As you just saw, you can place markup directly inside the app. However, putting it in a

component allows you to reuse it across different apps.

1. Select File | New | Lightning Component.

2. Type hello and then click Submit.

3. Add the following code and then Save.

     <aura:component>

          <h1>Hello World!</h1>

      </aura:component>

Step 8: Embed the Component in the App

1. In the Developer Console, open HelloWorld.app.

2. Add code to use your hello component.

    <aura:application>

           <jam:hello />

     </aura:application>

3. Make sure to replace the jam namespace with your own namespace. Then Save.

4. Click the Preview button on the sidebar to view the updated app.