📣 Attention Salesforce Certified Trailblazers! Link your Trailhead and Webassessor accounts and maintain your credentials by December 14th. Learn more.
close
trailhead

Get Books with Missing Author Data

Books4Everyone has recently discovered they have many books without an author listed. They want a component on the lower right corner of the home page to make sure these books can be updated quickly. Just like before, they provide you with the SQL.

Write a Right Anti Join

Here's the SQL query they gave you.

SELECT Name, Description
  FROM Book
  WHERE Author IS NULL
  

You know that in SOQL we will write it like this.

SELECT Name,Description__c
  FROM Book__c
  WHERE Author__c = null
  

Write the Apex and the New Component

Now, add the SOQL query to the Apex controller. 

  1. In the Developer console, open the Books4EveryoneHomeController Apex class.
  2. Add the following block of code after the first method.
    @AuraEnabled
    public static List<Book__c> getBooksWithoutAuthors(){
      return [SELECT Name
        FROM Book__c
        WHERE Author__c = null];
    }
        

Once again, create a new Lightning component for the Home page. 

  1. Close any open tabs in the Developer console and then choose File > New > Lightning Component.
  2. Name your new Lightning component Books4EveryoneMissingAuthors.
  3. In the component configuration section, select Lightning Page and click Submit.
  4. Inside the aura:component tabs, add the following code.
    <aura:component implements="flexipage:availableForAllPageTypes" access="global" controller="Books4EveryoneHomeController">
      <aura:attribute name="Books" type="Book__c" />
      <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
      <lightning:card title="Books4Everyone Missing Author List">
        <aura:set attribute="body">
          <table class="slds-table slds-table_bordered slds-table_cell-buffer">
            <thead>
              <tr class="slds-text-title_caps">
                <th scope="col">Book Title</th>
              </tr>
            </thead>
            <tbody>
              <aura:iteration items="{!v.Books}" var="books">
                <tr scope="row">
                  <td> {!books.Name}</td>
                </tr>
              </aura:iteration>
            </tbody>
          </table>
        </aura:set>
      </lightning:card>
    </aura:component>
        
  5. Click Controller on the right side of the page to create a controller for your component.
  6. Update the controller’s JavaScript with the following code.
    ({
      doInit: function(component, event, helper) {
        var action = component.get("c.getBooksWithoutAuthors");
        action.setCallback(this, function(data) {
          component.set("v.Books", data.getReturnValue());
          console.log(data.getReturnValue());
        });
        $A.enqueueAction(action);
      }
    })
        
  7. Save all your open tabs.

Let’s See This Component in Action!

Our final step is to ensure our query worked as expected by adding our component to our homepage.

  1. In your org, navigate to the Books4Everyone app.
  2. Click Home.
  3. In the upper right hand corner, click the gear icon and select Edit Page.
  4. On the left side of the Lightning app builder, find Books4EveryoneMissingAuthors in the list of custom components.
  5. Drag the component to the top right panel on the page.
  6. Click Save and then Back to return to the Home page.
  7. The final step is to check out the data on your Home page. It should look something like this.

This is an image showing the home tab and the three lightning components with SOQL-queried data

retargeting