Tips for Passing the Lightning Web Components Specialist Superbadge – Challenge 5

Tips for Passing the Lightning Web Components Specialist Superbadge – Challenge 5 This post describes about the Lightning Web Components Specialist Superbadge Challenge 5 Guide (Tips and Guidelines). Lightning Web Components Specialist Superbadge Challenge 5: Build the component boatTile To Pass the Lightning Web Components Specialist Superbadge Challenge 5, require to […]

Tips for Passing the Lightning Web Components Specialist Superbadge – Challenge 5

This post describes about the Lightning Web Components Specialist Superbadge Challenge 5 Guide (Tips and Guidelines).

Lightning Web Components Specialist Superbadge Challenge 5: Build the component boatTile

To Pass the Lightning Web Components Specialist Superbadge Challenge 5, require to create LWC component called “boatTile“.

After Completing the Lightning Web Components Specialist Superbadge Challenge 5: Build the component boatTile, you’ll be able to learn:

Possible Errors:

boatTile.html

We can’t find the component boatTile. Make sure the component was created according to the requirements.

We can’t find the correct settings for the h1 related to the boat name in the component boatTile. Make sure the component was created according to the requirements, including styling.

We can’t find the correct settings for the h2 related to the owner’s name in the component boatTile. Make sure the component was created according to the requirements, including styling.

We can’t find the correct settings for the div tags related to the boat price, length, and type in the component boatTile. Make sure the component was created according to the requirements, including the correct fields for price, length and the boat type’s name.

boatTile.js

We can’t find the required imports in the component boatTile JavaScript file. Make sure the component was customized according to the requirements, including the imports from Lightning Web Components.

We can’t find the correct decorators for the variables in the component boatTile JavaScript file, including boat and selectedBoatId. Make sure the component was created according to the requirements, using the proper case-sensitivity.

We can’t find the correct settings for backgroundStyle() in the component boatTile JavaScript file. Make sure the function was created properly, returning the boat picture URL for the background, according to the requirements, using the proper case-sensitivity.

We can’t find the correct settings for tileClass() in the component boatTile JavaScript file. Make sure the function was created properly, returning the correct tile-wrapper class depending on if the boat is the currently selected boat, using the proper case-sensitivity.

Tips/Guide to passing the LWC Challenge 5:

  • Create boatTile LWC Components as per instructions
  • Read Carefully in the instructions and add the boat information in the HTML UI file to render the boat information with appropriate H1, H2 & Div HTML tags for the boat name, boat owner name, price, length and type values.
  • Import properly in the JS file
  • add the necessary api decorators to the property/variables in JS file.
  • Getter for dynamically setting the background-image in the backgroundStyle() in the JS file
  • Getter for dynamically setting the title class based on the selected boat in the tileClass() in the JS file
  • Create CustomEvent with passing the selectedBoatId and dispatchEvent which created

Reference Link:

Mark a Configuration Object Property as Dynamic and Reactive in LWC – https://developer.salesforce.com/docs/component-library/documentation/en/lwc/data_wire_service_about
Create and Dispatch Events  – https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.events_create_dispatch
Lightning Formatted Number in LWC- https://developer.salesforce.com/docs/component-library/bundle/lightning-formatted-number/example

Refer the following post about the Tips for Passing the Lightning Web Components Specialist Superbadge Challenges:-

  1. Lightning Web Components Specialist Challenge 1
  2. Lightning Web Components Specialist Challenge 2
  3. Lightning Web Components Specialist Challenge 3
  4. Lightning Web Components Specialist Challenge 4
  5. Lightning Web Components Specialist Challenge 5
  6. Lightning Web Components Specialist Challenge 6
  7. Lightning Web Components Specialist Challenge 7
  8. Lightning Web Components Specialist Challenge 8
  9. Lightning Web Components Specialist Challenge 9
  10. Lightning Web Components Specialist Challenge 10
  11. Lightning Web Components Specialist Challenge 11
  12. Lightning Web Components Specialist Challenge 12
  13. Lightning Web Components Specialist Challenge 13
  14. Lightning Web Components Specialist Challenge 14
  15. Lightning Web Components Specialist Challenge 15
  16. Lightning Web Components Specialist Challenge 16
  17. Lightning Web Components Specialist Challenge 17
  18. Lightning Web Components Specialist Challenge 18

 

The post Tips for Passing the Lightning Web Components Specialist Superbadge – Challenge 5 appeared first on TheBlogReaders.com.

ASNF

Next Post

10 Highlights from the Salesforce.org Community This Month

Mon Aug 17 , 2020
Image credit: Melissa Hill Dees snags a screenshot of the community from the Salesforce.org Diversity Equity & Inclusion Mini Sprint in July, 2020, @melissahilldees. The HubCap is an overview of the top 10 highlights from the Salesforce.org online community, the Power of Us Hub, including product updates, best practices, events, […]