Posts

Display Maps in LWC

-
Image
  In this blog, we will look at how to display Google Maps in your Lightning Web Components. Salesforce provides a lightning-map component to display a map of one or more locations, using geocoding data and mapping imagery from Google Maps.  Now, let's look at how to use this component in your Lightning Web component. HTML : Pass the location(s) that you want to display in the map-marker property. A marker contains: Location Information:   A coordinate pair of latitude and longitude, or an address composed of address elements to be geocoded. Descriptive Information:  Optional title, description, and an icon. These items are relevant to the marker but not specifically related to location. Map markers have a few more properties that can be used to customize the map display, please refer to this documentation on Maps. Display a Single Marker Let's understand how we can pass single location info in the map-marker and display it on the map. In this example, we will creat...
Post a Comment
Read more

Calling Apex method from LWC

-
Image
  In this blog post, we will take a look at the steps to call an Apex method from our Lightning Web Component with source code and demonstration videos. There are the following ways to call an Apex method into LWC: 1. Calling an Apex method using  wire services . 2. Calling an Apex method imperatively . 3. Calling and Apex method with async and await . Now let's take a look at the steps involved in the above-mentioned ways. Calling Apex method using Wire services The wire service in LWC helps in the retrieval of data or performing any action without the need for Apex code. You can use the wire service, to wire a property or a function that will receive data when the source is updated. 1. Expose the Apex method which you want to call from LWC The Apex method should be: a. Global or Public . b. decorated with @AuraEnabled , if the method has ( cacheable=true ) after this annotation, the results are cached at the client site to improve performance. 2. Import the Apex method whic...
Post a Comment
Read more

Navigation Service in LWC (Lightning Web Components)

-
Image
Introduction Navigation Service in LWC simplifies navigating between the pages within the applications. Utilizing the navigation service in LWC you can create a smooth and seamless navigation experience for users within your Salesforce application. In this blog post, we will deep dive into the steps on how to use the Navigation Service. What is a Navigation Service? Navigation Service is a built-in module in LWC that enables developers to navigate different pages and components within the Salesforce ecosystem. This service provides you with a set of methods that helps you navigate different web pages, record pages, or other Lightning Components.  Using the Navigation Service 1. Import the Navigation Service from the lightning/navigation module. 2. Apply the NavigationMixin function to the base class. 3. Create a JS PageReference object that defines the page. 4. Call the navigation service's [NavigationMixin.Navigate](pageReference) to dispatch the navigation request. 5. In ...
Post a Comment
Read more

Weather Search Website in LWC - Your Ultimate Weather Companion built using Lightning Web Components (LWC) with Real-time Temperature Conversion in Celsius and Fahrenheit

-
Image
  Introduction In a world where weather information is a crucial part of our daily lives, the integration of cutting-edge technologies becomes paramount. My latest blog delves into the realm of web development, unveiling a state-of-the-art weather website meticulously crafted using Lightning Web Components (LWC). This responsive website not only provides real-time weather updates using Open Weather API but also revolutionizes the way you interact with temperature data by offering seamless conversion between Fahrenheit and Celsius.  But that's not all. this website also offers a comprehensive dashboard that includes essential weather metrics. From atmospheric pressure and wind speed to the 'feels like' temperature, this website ensures you are equipped with all the information you need. Dive into the details with minimum and maximum temperatures, gaining insights into the day's temperature fluctuations. Let's dive into the insights gained during the implementation o...
Post a Comment
Read more

Currency Converter App in LWC

-
Image
  The Currency Converter Project  is a robust application built using cutting-edge technologies such as Lightning Web Components (LWC), Service Components, Styling Hooks, API integration with exchange rate APIs, and the seamless utilization of static resources. This project not only showcases the power of LWC for dynamic and modular user interfaces but also highlights the importance of service components, styling hooks for enhanced presentation, and API integration for real-time exchange rate data. With the added sophistication of static resources, this Currency Converter project delivers a comprehensive and responsive solution.  This blog post unveils the synergy of these technologies, offering a glimpse into the seamless convergence of design, functionality, and real-time data.  1. Service Component:  A service component in LWC is basically a lightning component without an HTML template. Service Components or Service Libraries can be used for reusable function...
Post a Comment
Read more