Start tracking your progress
Trailhead Home
Trailhead Home

Create Your First Page


Lightning App Builder lets developers and business users build beautiful custom user interfaces that are designed to work perfectly on your desktop and mobile devices, all without writing a single line of code. In this Quick Start, you'll build a geolocation app for sales reps in the field using the Lightning App Builder. You'll use a pre-built Lightning Component and the drag-and-drop interface of Lightning App Builder to create this app.

Create Your First Page

A Lightning Page is a container for Lightning Components. Create your first page and add a component to it.

  1. If you haven’t already, log in to Trailhead, then launch your Trailhead Playground by clicking Launch at the bottom of this page. This opens your Trailhead Playground in a new tab.
  2. If you're not already on the Setup home page, click Gear icon to access Setup in Lightning Experience. and select Setup to launch Setup in a new tab.
  3. Enter Lightning App Builder in Quick Find and select Lightning App Builder.
  4. Under Lightning Pages, click New.
  5. Select App Page then click Next.
  6. In the Label field, type Field Sales App and click Next.
  7. In Create a New Lightning Page, select Two Regions.
  8. Click Finish.

Now that you have a page, you can add components. For your first component, drag a Filter List component onto the page.

  1. In the Desktop drop-down list, click Tablet - Portrait. The canvas's preview layout changes from the standard single column to two columns.
  2. From the Standard Components menu on the left, drag the List View to the left column.
  3. Set the properties of this component using the Properties list in the right sidebar.
    • In the Object drop-down list, select Account.
    • In the Filter drop-down list, select My Accounts.
    • In the Number of Records to Display field, enter 7. Screenshot of the Lightning App Builder - Field Sales App
  4. Click Save and then click Not Yet in the popup window. We will activate this page in a later step.
    Page saved popup