Posts

Bind HTML elements in LWC (BASIC LWC)

Image
            Bind HTML elements in LWC  Welcome to our blog! Today, we’re diving into a fundamental aspect of Lightning Web Components (LWC) - binding HTML elements. If you're a Salesforce developer or just getting started with LWC, understanding how to bind data between your JavaScript and HTML is crucial for creating dynamic and interactive applications. What is Data Binding in LWC? Data binding in LWC refers to the process of synchronizing data between the component's JavaScript class and its HTML template. This synchronization ensures that any changes in the data are automatically reflected in the user interface, and vice versa. Types of Data Binding One-way Data Binding In one-way data binding, the data flows in a single direction: from the JavaScript class to the HTML template. This is useful for displaying static data or data that doesn't need to change dynamically. Implementing One-way Data Binding Let’s start with a simple example of one-way da...

Building a Real-Time Train Status Tracker with Salesforce LWC and Apex

Image
  Building a Real-Time Train Status Tracker with Salesforce LWC and Apex In this tutorial, we'll walk through the process of creating a real-time train running status tracker using Salesforce Lightning Web Components (LWC) and Apex. This tracker will fetch live train data from an external API and display it in Salesforce. Follow along to enhance your Salesforce skills and build a practical application. Step 1: Setting Up Remote Site Settings To begin, we need to set up remote site settings in Salesforce to allow external API calls. Navigate to Setup in Salesforce. Search for Remote Site Settings in the Quick Find box. Click New Remote Site . Enter the following details: Remote Site Name : TrainStatusAPI Remote Site URL : https://rappid.in Click Save . Step 2: Creating the Apex Class Next, we'll create an Apex class to make an API call and fetch train details. < template >               < lightning-card   t...

Integrating Salesforce with Google Drive for File Uploads

Image
   Integrating Salesforce with Google Drive for File Uploads In this blog, we will walk through the steps required to integrate Salesforce with Google Drive for uploading files. We'll cover the necessary setup on Google Cloud, obtaining the required credentials, and the Salesforce Apex code to facilitate the integration. Step 1: Create a Project in Google Cloud Go to the Google Cloud Console. Create a new project by clicking on the project dropdown and selecting "New Project". Name your project and click "Create". Step 2: Enable Google Drive API In your new project, go to the "APIs & Services" dashboard. Click "Enable APIs and Services". Search for "Google Drive API" and click on it. Click "Enable" to enable the API for your project. Step 3: Create OAuth Credentials In the "APIs & Services" dashboard, click on "Credentials". Click "Create Credentials" and select "OAuth 2.0 Client ...

Standard events are built-in browser events like click or change, while custom events are events that you define and dispatch yourself.

Image
            Types of Events in LWC LWC provides two main types of events: standard events and custom events. Standard events are pre-built by the LWC framework and can be used to handle common user interactions like clicks, inputs, and changes. Custom events, on the other hand, are defined by developers and can be used to trigger actions or communicate between components in a more specific and tailored way. Understanding the differences between these event types is crucial for building effective LWC components. In this section, we’ll explore both standard and custom events in LWC in more detail and provide examples of how to use them. 1. Standard Events in LWC Some examples of standard events in LWC include “click”, “input”, and “change”. The “click” event is triggered when the user clicks on an element in the component, while the “input” event is triggered when the user types something into an input field. The “change” event is similar to “input”, but is o...