SalesforceCodex
  • Home
  • Architecture
  • Salesforce
  • .NET
  • Angular
  • Questions
    • Salesforce
    • .NET
    • Angular
  • Tech News
  • Social
  • Projects
    • Architecture

      Cohesion And Coupling – Approach for Design –…

      May 2, 2018

      Architecture

      Cohesion And Coupling – Approach for Design

      May 2, 2018

      Architecture

      Choosing Between Traditional Web Pages and Single Page…

      May 2, 2018

      Architecture

      Understanding Liskov Substitution Principle

      May 2, 2018

      Architecture

      Understanding Open Closed Principle

      May 2, 2018

SalesforceCodex

  • Home
  • Architecture
  • Salesforce
  • .NET
  • Angular
  • Questions
    • Salesforce
    • .NET
    • Angular
  • Tech News
  • Social
  • Projects
    • Architecture

      Cohesion And Coupling – Approach for Design –…

      May 2, 2018

      Architecture

      Cohesion And Coupling – Approach for Design

      May 2, 2018

      Architecture

      Choosing Between Traditional Web Pages and Single Page…

      May 2, 2018

      Architecture

      Understanding Liskov Substitution Principle

      May 2, 2018

      Architecture

      Understanding Open Closed Principle

      May 2, 2018

Salesforce

Lightning Web Component : Introduction

written by Dhanik Lal Sahni December 18, 2018
Lightning Web Component :  Introduction

Salesforce announced Lightning Web Components on 13-Dec-2018. This is New programming model for building Lightning components. It’s not built on top of Aura framework. It’s a different framework which will co-exist with Lightning Components. Think Lightning Web Component model as an abstraction over the Web Components.

Web components are a set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps. Custom components and widgets build on the Web Component standards, will work across modern browsers, and can be used with any JavaScript library or framework that works with HTML

.

Lightning Web Component Bundle

Once you start with the Quick Start: Lightning Web Components trailhead, you will notice that bundle structure of Lightning Web Components is different compared to Lightning Components.

Once you have updated the CLI to the LWC plugin in VS Code, you are good to create a new Project. Once you create a new project, you will notice the Project gets created with /lwc folder with two JSON files for lint support and the jsconfig file to identify the /lwc as a JS project. This folder is created parallel to aura folder which is used for lightning component.


Now, when you create a new Lightning Web Component, you will see the files created as below following the HTML Template Element Specification and ES Modules Specification of Web Components

Welcome to the good old HTML files with external js files. Comparing this with the Lightning Component bundle, the .html file replaces the .cmp file and that the controller and helpers are now merged in the .js file. I feel this structure is better than existing lightning component structure.

The meta.xml has metadata for the bundle and you can specify the availability of the component across the application, example app page, record page, etc.

What happens to Lightning Components?

Lightning Components will continue to exist in parallel to Lightning Web Components. It’s something similar when Lightning Components were available and we started thinking that if it’s going to replace Visualforce pages.
As VF pages and Lightning Components co-existed, now they are being joined with Lightning Web Components. It will be more of a choice of the framework that you will want to choose when building UI components. With the standard Web development model, it looks like Lightning Web Components definitely will be the choice in future.

Summary
With the growing need of (Web) Standards, definitely Lightning Web Components will be the choice of model to customize UIs in Salesforce in future. Developer has to learn ECMAScript 6 also for better understanding of lightning web component.

Lightning web componentlwc
0 comment
0
Facebook Twitter Google + Pinterest
Dhanik Lal Sahni

previous post
Change Data Capture
next post
Lightning Web Component Building Blocks

You may also like

Capture Screen using Lightning Component

September 5, 2019

Call Lightning Component using Formula Link

May 28, 2019

Enforce Field-Level Security Permissions for SOQL Queries –...

April 28, 2019

Salesforce Development in Visual Studio Code

October 13, 2018

Understanding Open Closed Principle

May 2, 2018

Add Text-to-Speech Capability in Lightning Component

August 1, 2019

Angular CLI Commands For Angular Application

May 2, 2018

ASP.NET MVC Interview Question

May 2, 2018

Salesforce Winter 20 Release – Feature Enhancements For...

August 28, 2019

Salesforce Winter 20 Release – Code Enhancement in...

August 29, 2019

Leave a Comment Cancel Reply

Recent Posts

  • Field Access Explorer In lightning Web Component
  • Dependent PickList In Lightning Web Component
  • Create Dynamic Patch REST API in Salesforce Apex
  • Show Image in Lightning Web Component Data Table
  • Integrate Salesforce Stackexchange using Lightning Web Component and Apex
vagminecloud.com

SalesforceCodex

Salesforce Codex

Recent Comments

  • Dhanik Lal Sahni on Runing Salesforce App using Voice command – Speech-To-Text API
  • Dhanik Lal Sahni on Integrate Salesforce with WhatsApp using Twilio API
  • SUCHARITA MONDAL on Runing Salesforce App using Voice command – Speech-To-Text API
  • sakshi on Integrate Salesforce with WhatsApp using Twilio API
  • Dhanik Lal Sahni on Runing Salesforce App using Voice command – Speech-To-Text API

Archives

  • December 2019
  • November 2019
  • October 2019
  • September 2019
  • August 2019
  • July 2019
  • May 2019
  • April 2019
  • December 2018
  • November 2018
  • October 2018
  • September 2018
  • August 2018
  • July 2018
  • May 2018

Categories

Recent Posts

  • Field Access Explorer In lightning Web Component

    December 6, 2019
  • Dependent PickList In Lightning Web Component

    November 19, 2019
  • Create Dynamic Patch REST API in Salesforce Apex

    October 31, 2019
  • Show Image in Lightning Web Component Data Table

    October 10, 2019
  • Integrate Salesforce Stackexchange using Lightning Web Component and Apex

    October 2, 2019

Newsletter

Subscribe my Newsletter for new blog posts, tips & new photos. Let's stay updated!

Recent Posts

  • Field Access Explorer In lightning Web Component

    December 6, 2019
  • Dependent PickList In Lightning Web Component

    November 19, 2019
  • Create Dynamic Patch REST API in Salesforce Apex

    October 31, 2019
  • Show Image in Lightning Web Component Data Table

    October 10, 2019
  • Integrate Salesforce Stackexchange using Lightning Web Component and Apex

    October 2, 2019

Tags

.net (1) .net core (1) .net news (1) .net question (1) Android developers (1) angular (1) angular2+ (2) angular cli (1) apex (13) Apex code IDE (1) Apex logging (1) architecture (9) Asynchronous apex (1) batch processing (1) Code versioning for Salesforce Project (1) community user (2) design principle (9) Error logging in Apex (1) Exception logging in apex (1) future method (1) health tips (1) healthy (1) IDE for Salesforce Development (1) lightning (15) Lightning web component (10) lwc (4) model dialog (1) news (1) Play Store (1) portal user (1) Queueable (1) salesforce (18) Salesforce IDE (1) Salesforce Interview Question (1) salesforce news (2) salesforce question (2) Scheduled Apex (1) Signature Pad (1) software engineers (1) solid (6) tfs (1) Visual Studio Code (2) web api (2) Winter 20 (8) workflow vs process builder (1)

My Recommended Books

Twitter Timeline

Tweets by SalesforceCodex

SUBSCRIBE NEWSLETTER

Subscribe my Newsletter for new blog posts, tips & new photos. Let's stay updated!

  • Facebook
  • Twitter
  • Linkedin
  • Youtube
  • Github
  • Stack-Overflow

@2016 - SalesforceCodex. All Right Reserved. Designed and Developed by Vagmine Cloud Solution