Skip to main content

Posts

Starting with LWC

To know How to Setup VS Code for Salesforce Please visit : VS Code Setup Lightning Web Component is having three main bundle Elements, nameSpace.hlml              = to show the UI View nameSpace.js                  = for logic implementations  nameSpace.js-meta.xml  = for metadata Access The power of Lightning Web Components is the templating system, which uses the virtual DOM to render components smartly and efficiently. It’s a best practice to let LWC manipulate the DOM instead of writing JavaScript to do it. Create a web Component from VS Code: 1. First Create Project  Press ctrl+shift+p Select SFDX: Create Project Select Standard Project Template Give a Name to your project Select Project Location Where you want to save locally Open you new Folder 2. Create First LWC Component: Press ctrl+shift+p Select SFDX: Create Lightning Web Component Give a name to your lwc Component location will be default if you donot want to change the location of newly created lwc compon

Debug Lightning Web Components

You can enable debug mode for specific users. Debug mode gives you a few things, and particularly a few things that were not available previously for Aura components: Unminified JavaScript Custom formatting Developer mode console warnings Eneble Custom Formatter   from console then click on three dot ==> go to setting ==> in Console you will find enable Custom Formatter.

Send Events to an Enclosing Aura Component

To communicate from child to parent, dispatch an event. Lightning web components fire DOM events. An enclosing Aura component can listen for these events, just like an enclosing Lightning web component can. In Aura, you add components into facets. In Lightning web components, you add components into slots. Facet:          <aura:component implements="flexipage:availableForAllPageTypes">           <c:lwcCompo1 />             <c:lwccompo2 />          </aura:component> Slots:          <template>               <c-lwcComp></c-lwcComp>               .....         </template> Example/Syntax: const filterChangeEvent = new CustomEvent('filterchange', { detail: { filters }, }); // Fire the custom event this.dispatchEvent(filterChangeEvent); In Aura: Component: <lightning:layout> <lightning:layoutItem size="4">

Share JavaScript Code Between LWC and Aura

To share JavaScript code between Lightning web components and Aura components, put the code in an ES6 module. To share an ES6 module: Create an ES6 module using the Lightning Web Components programming model. To use the code in a Lightning web component, import and reference it in the component’s JavaScript file. To use the code in an Aura component, use the same syntax that you use to import an Aura component and call its methods. Create a .js file, example: extendableJS const calculateMonthlyPayment = (principal, years, rate) => { if (principal && years && rate && rate > 0) { const monthlyRate = rate / 100 / 12; const monthlyPayment = (principal * monthlyRate) / (1 - Math.pow(1 / (1 + monthlyRate), years * 12)); return monthlyPayment; } return 0; }; export { calculateMonthlyPayment }; • Create a lwc which can use your . js funct

Generic Class to get Dependency of Dependent Pick-list In Apex

Dependent Picklist values Dependency Dependent Picklist values do not have any dependency when retrieved via Apex Code. This Following Class will returned a map which has Key as Controlling Values and Values are the list of dependent values(In LowerCase). Map Key =  Controlling Values, Map Values = list of dependent values. Class:- /***********************-- START --****************************** **/ /** * @File Name          : DependencyForPicklistApex.cls * @Description        : CR-DR * @Author             : Devraj Tomar * @Group              : DR Groups * @Last Modified By   : Devraj Tomar * @Modification Log   :  **/ public class DependencyForPicklistApex {          public static Map<String, Set<String>> getFieldDependencies(String objectName, String controllingField, String dependentField){         Map<String, Set<String>> controllingInfo = new Map<String, Set<String>>();         Schema.SObjectType objType = Schema.getGlobalD

Salesforce Winter ’20 Release Notes(Critical Updates and Security Alerts) - Summary

Summary - Salesforce Winter ’20 Release Critical Updates and Security Alerts Enable ICU(  International Components for Unicode ) Locale Formats (Critical Update) Restrict Access to @AuraEnabled Apex Methods for Guest and Portal Users Based on User Profile Restrict Access to @AuraEnabled Apex Methods for Authenticated Users Based on User Profile Use with sharing for @AuraEnabled Apex Controllers with Implicit Sharing Enforce Access Modifiers on Apex Properties in Lightning Component Markup Enable Partial Save for Invocable Actions Restrict Access to @AuraEnabled Apex Methods for Guest and Portal Users Based on User Profile  A guest, portal, or community user can access an  @AuraEnabled  Apex method only when the user’s profile allows access to the Apex class. This critical update enforces user profile restrictions for Apex classes used by Aura and Lightning web components. Restrict Access to @AuraEnabled Apex Methods for Authenticated Users Based on User Prof

LWC View On Local Server

1. Open a new terminal window and run the following command to install the local development server. sfdx plugins:install @salesforce/lwc-dev-server 2. Check for updates to the local development server. sfdx plugins:update 3. Navigate to your SFDX project, or clone one that has Lightning web components. In this example, we are using lwc-recipes (you can download and deploy to your org). git clone git@github.com:trailheadapps/lwc-recipes.git 4. if you have Existing LWC Components then goto that directory. In this example If you're not in the lwc-recipes root directory already, cd into it. cd lwc-recipes 5. Use the following command to host Local Server : sfdx force:lightning:lwc:start 6. View the server at http://localhost:3333/.

Translate