Salesforce LWC (Lightning Web Component) with Live Project

Learn to run anonymous apex code in developer console or visual studio code, deploy apex classes, and set up the Salesforce CLI and extensions for auto deploy.

Create your first lightning web component in VS Code, authorize and deploy it to your Salesforce org, and place it in a lightning app page.

Delete a custom lightning web component from your Salesforce org by using the Developer Console: query the Lightning Component Bundle with Tooling API and delete the component row.

Master data binding in Lightning Web Components by binding properties to values in JavaScript and displaying them in HTML with curly braces.

Learn to implement a getter property in a Lightning Web Component to compute rank from age using the get keyword and conditional logic, then render it in the HTML template.

Learn how to implement conditional rendering in Lightning Web Components with if true and if false template directives, using a checkbox to toggle messages inside a Lightning card.

Master the for each loop in Lightning Web Components by using the for each and item template directives to render a list of records in HTML.

Learn to implement an iterator loop in Lightning web components using the template directive iterator to render a list as a table, using first and last to control output.

Explore decorators in lightning web components, including @api, @track, and @wire, and learn how they make properties public or private, reactive, and enable data access via the wire service.

Learn to use the @api decorator in LWC (lightning web components) to expose public properties and make them reactive across parent and child components, with kebab-case naming.

Make a private property reactive in Lightning web components using the @track decorator, ensuring changes reflect in the component. Learn with a hands-on counter example that updates on button clicks.

Learn how the @wire decorator enables reactive reading of Salesforce data in lightning web components, using getRecord with adapter configuration to fetch account name and phone on a record page.

Learn to call apex methods from lightning web components with the @wire decorator and adapter ID. Configure adapter parameters, import apex methods, and display accounts reactively by passing record IDs.

Learn how to decorate a function with the wire decorator in Salesforce lwc, wiring get record with adapter id to fetch account name and phone and render reactive results.

Learn to use querySelector in a lightning web component to fetch input values from the template, and apply tag, class, or tag-and-class css selectors for data binding.

Learn to use querySelectorAll in a lightning web component to fetch all matching elements with CSS selectors, then loop with forEach to map values to first name and last name.

Create a Lightning app page in Salesforce with the Lightning App Builder, configure layout, save and activate, add to apps and navbar, and populate it with components.

Explore data communication in LWC components, including parent-to-child, child-to-parent, and unrelated component messaging. Learn approaches like public properties with decorators, custom events, and lightning message service.

Learn how to pass messages from a parent component to a child component in lightning web components by using public properties, the api decorator, and kebab-case naming.

Explore how to pass data from child to parent in lightning web components using custom events, event dispatch, and detail properties in a hands-on live project.

Pass multiple values from child to parent in LWC by adding two text fields for first name and last name and dispatching an event with a detail containing both values.

Learn how to enable data communication between unrelated lwc components using the lightning message service, publishers, subscribers, and a dedicated message channel for passing a name value.

Learn to use the lightning message service to pass values between LWC publisher and subscriber components. Update the message channel to carry first name and last name, then test.