SlideShare a Scribd company logo
1 of 15
Welcome to Boston, MA Developer Group!
Introducing Lightning Web Components
Enhanced productivity
Use the modern language of the web: ES6+, Custom
Elements, and Shadow DOM
Built for performance
More code executed by the browser instead of JavaScript
abstractions for a blazing fast experience
Compatible and easy to use
Runs side-by-side with existing Lightning components and
can be composed with clicks or code
Introducing Lightning Web Components
Generally
Available
Spring ‘19
(Feb)
New programming model built on modern web standards
2014 Web Stack
Fragmentation
● Proliferation of frameworks
● Components are not interoperable
● Skills are not transferable
● Resources are hard to find
● Framework abstractions are slow
W3C and ECMAScript Standardization
● ECMAScript 6,7,8,9
● Classes
● Modules
● Promises
● Decorators
● Web components
● Custom elements
● Shadow DOM
● Templates and slots
2019 Web Stack
Lightning Web Components
Benefits
● More standards, less proprietary
● Common component model
● Transferable skills
● Easier-to-find / easier-to-ramp-up developers
● Better performance
• “Browser is the OS”
Meet the Experts
http://youtu.be/Rd8h-5e4KZs
Coexistence and Interoperability
Summary
1. Game changing web standards
2. Performance
3. Coexist and interoperate with Aura
Demo Time!
Lightning Web Components in Action
Lightning Web Components Pop Quiz!
Get Hands On with a Trailmix!
sforce.co/lwc

More Related Content

What's hot

Combining HTML5 with MVC framework to simplify realtime collaboration for we...
Combining HTML5 with MVC framework to simplify  realtime collaboration for we...Combining HTML5 with MVC framework to simplify  realtime collaboration for we...
Combining HTML5 with MVC framework to simplify realtime collaboration for we...
Gopikrishnan Sasikumar
 
Web Application Solutions
Web Application SolutionsWeb Application Solutions
Web Application Solutions
marvin256
 

What's hot (20)

APIs for mobile
APIs for mobileAPIs for mobile
APIs for mobile
 
Mvc webforms
Mvc webformsMvc webforms
Mvc webforms
 
Building a scalable infrastructure for social mobile web apps
Building a scalable infrastructure for social mobile web appsBuilding a scalable infrastructure for social mobile web apps
Building a scalable infrastructure for social mobile web apps
 
Lightning Web Component in Salesforce
Lightning Web Component in SalesforceLightning Web Component in Salesforce
Lightning Web Component in Salesforce
 
Dreamweaver Application
Dreamweaver ApplicationDreamweaver Application
Dreamweaver Application
 
WordPress development checklist
WordPress development checklistWordPress development checklist
WordPress development checklist
 
TDD with ASP.NET MVC 1.0
TDD with ASP.NET MVC 1.0TDD with ASP.NET MVC 1.0
TDD with ASP.NET MVC 1.0
 
Scaling Wordpress
Scaling WordpressScaling Wordpress
Scaling Wordpress
 
Lightswitch
LightswitchLightswitch
Lightswitch
 
Silverlight 4 @ MSDN Live
Silverlight 4 @ MSDN LiveSilverlight 4 @ MSDN Live
Silverlight 4 @ MSDN Live
 
Lightning web components
Lightning web componentsLightning web components
Lightning web components
 
Rise and Fall of the Frontend Developer
Rise and Fall of the Frontend DeveloperRise and Fall of the Frontend Developer
Rise and Fall of the Frontend Developer
 
Combining HTML5 with MVC framework to simplify realtime collaboration for we...
Combining HTML5 with MVC framework to simplify  realtime collaboration for we...Combining HTML5 with MVC framework to simplify  realtime collaboration for we...
Combining HTML5 with MVC framework to simplify realtime collaboration for we...
 
Introduction to ASP.NET MVC 1.0
Introduction to ASP.NET MVC 1.0Introduction to ASP.NET MVC 1.0
Introduction to ASP.NET MVC 1.0
 
Web Application Solutions
Web Application SolutionsWeb Application Solutions
Web Application Solutions
 
Lightning web components - Introduction, component Lifecycle, Events, decorat...
Lightning web components - Introduction, component Lifecycle, Events, decorat...Lightning web components - Introduction, component Lifecycle, Events, decorat...
Lightning web components - Introduction, component Lifecycle, Events, decorat...
 
Single page application and Framework
Single page application and FrameworkSingle page application and Framework
Single page application and Framework
 
Web Development Presentation
Web Development PresentationWeb Development Presentation
Web Development Presentation
 
Lightning web components
Lightning web componentsLightning web components
Lightning web components
 
Integrate any Angular Project into WebSphere Portal
Integrate any Angular Project into WebSphere PortalIntegrate any Angular Project into WebSphere Portal
Integrate any Angular Project into WebSphere Portal
 

Similar to Boston, MA Developer Group 2/7/2019 - Introduction to lightning web components

Asp.net Web Development.pdf
Asp.net Web Development.pdfAsp.net Web Development.pdf
Asp.net Web Development.pdf
Abanti Aazmin
 

Similar to Boston, MA Developer Group 2/7/2019 - Introduction to lightning web components (20)

Introducing Lightning Web Components
Introducing Lightning Web ComponentsIntroducing Lightning Web Components
Introducing Lightning Web Components
 
RVA intro to LWC- Salesforce Dev Week
RVA intro to LWC-  Salesforce Dev WeekRVA intro to LWC-  Salesforce Dev Week
RVA intro to LWC- Salesforce Dev Week
 
Intro to Salesforce Lightning Web Components (LWC)
Intro to Salesforce Lightning Web Components (LWC)Intro to Salesforce Lightning Web Components (LWC)
Intro to Salesforce Lightning Web Components (LWC)
 
Lightning Web Component - LWC
Lightning Web Component - LWCLightning Web Component - LWC
Lightning Web Component - LWC
 
Introduction to Lightning Web Components
Introduction to Lightning Web ComponentsIntroduction to Lightning Web Components
Introduction to Lightning Web Components
 
Top 8 Reasons ASP.NET Core is the Best Framework for Web Application Developm...
Top 8 Reasons ASP.NET Core is the Best Framework for Web Application Developm...Top 8 Reasons ASP.NET Core is the Best Framework for Web Application Developm...
Top 8 Reasons ASP.NET Core is the Best Framework for Web Application Developm...
 
Lightning Web Components- Ep 0 - Introduction
Lightning Web Components- Ep 0 - IntroductionLightning Web Components- Ep 0 - Introduction
Lightning Web Components- Ep 0 - Introduction
 
9 Best JavaScript Frameworks To Choose
9 Best JavaScript Frameworks To Choose9 Best JavaScript Frameworks To Choose
9 Best JavaScript Frameworks To Choose
 
JEE Conf 2015: Less JS!
JEE Conf 2015: Less JS!JEE Conf 2015: Less JS!
JEE Conf 2015: Less JS!
 
Getting Started with ASP.NET vNext
Getting Started with ASP.NET vNextGetting Started with ASP.NET vNext
Getting Started with ASP.NET vNext
 
SPUnite17 Building Great Client Side Web Parts with SPFx
SPUnite17 Building Great Client Side Web Parts with SPFxSPUnite17 Building Great Client Side Web Parts with SPFx
SPUnite17 Building Great Client Side Web Parts with SPFx
 
5 Powerful Backend Frameworks for Web App Development in 2022
5 Powerful Backend Frameworks for Web App Development in 20225 Powerful Backend Frameworks for Web App Development in 2022
5 Powerful Backend Frameworks for Web App Development in 2022
 
Introduction to Web Frameworks
Introduction to Web FrameworksIntroduction to Web Frameworks
Introduction to Web Frameworks
 
Introduction to lightning Web Component
Introduction to lightning Web ComponentIntroduction to lightning Web Component
Introduction to lightning Web Component
 
Introduction to lightning web component
Introduction to lightning web component Introduction to lightning web component
Introduction to lightning web component
 
Streaming Linked Data to Web UI
Streaming Linked Data to Web UIStreaming Linked Data to Web UI
Streaming Linked Data to Web UI
 
Asp.net Web Development.pdf
Asp.net Web Development.pdfAsp.net Web Development.pdf
Asp.net Web Development.pdf
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
 
001. Introduction about React
001. Introduction about React001. Introduction about React
001. Introduction about React
 
What's new in Portal and WCM 8.5
What's new in Portal and WCM 8.5What's new in Portal and WCM 8.5
What's new in Portal and WCM 8.5
 

More from BingWang77 (6)

Beyond layouts
Beyond layouts Beyond layouts
Beyond layouts
 
Dreamforce 19 global gathering boston
Dreamforce 19 global gathering   bostonDreamforce 19 global gathering   boston
Dreamforce 19 global gathering boston
 
Northeast Dreamin 2019
Northeast Dreamin 2019Northeast Dreamin 2019
Northeast Dreamin 2019
 
Salesforce Winter 20 interesting developer features
Salesforce Winter 20 interesting developer featuresSalesforce Winter 20 interesting developer features
Salesforce Winter 20 interesting developer features
 
Apex Enterprise Patterns Galore - Boston, MA dev group meeting 062719
Apex Enterprise Patterns Galore - Boston, MA dev group meeting 062719Apex Enterprise Patterns Galore - Boston, MA dev group meeting 062719
Apex Enterprise Patterns Galore - Boston, MA dev group meeting 062719
 
Spring and Summer '19 Development Feature Highlights
Spring and Summer '19 Development Feature HighlightsSpring and Summer '19 Development Feature Highlights
Spring and Summer '19 Development Feature Highlights
 

Recently uploaded

Recently uploaded (20)

WSO2CON 2024 - Navigating API Complexity: REST, GraphQL, gRPC, Websocket, Web...
WSO2CON 2024 - Navigating API Complexity: REST, GraphQL, gRPC, Websocket, Web...WSO2CON 2024 - Navigating API Complexity: REST, GraphQL, gRPC, Websocket, Web...
WSO2CON 2024 - Navigating API Complexity: REST, GraphQL, gRPC, Websocket, Web...
 
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open SourceWSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
WSO2CON 2024 - Freedom First—Unleashing Developer Potential with Open Source
 
WSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
WSO2CON2024 - Why Should You Consider Ballerina for Your Next IntegrationWSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
WSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
 
WSO2Con2024 - Software Delivery in Hybrid Environments
WSO2Con2024 - Software Delivery in Hybrid EnvironmentsWSO2Con2024 - Software Delivery in Hybrid Environments
WSO2Con2024 - Software Delivery in Hybrid Environments
 
WSO2Con2024 - Unleashing the Financial Potential of 13 Million People
WSO2Con2024 - Unleashing the Financial Potential of 13 Million PeopleWSO2Con2024 - Unleashing the Financial Potential of 13 Million People
WSO2Con2024 - Unleashing the Financial Potential of 13 Million People
 
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & InnovationWSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
WSO2CON 2024 - OSU & WSO2: A Decade Journey in Integration & Innovation
 
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
WSO2Con2024 - Facilitating Broadband Switching Services for UK Telecoms Provi...
 
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
 
WSO2CON 2024 - WSO2's Digital Transformation Journey with Choreo: A Platforml...
WSO2CON 2024 - WSO2's Digital Transformation Journey with Choreo: A Platforml...WSO2CON 2024 - WSO2's Digital Transformation Journey with Choreo: A Platforml...
WSO2CON 2024 - WSO2's Digital Transformation Journey with Choreo: A Platforml...
 
WSO2CON 2024 - Software Engineering for Digital Businesses
WSO2CON 2024 - Software Engineering for Digital BusinessesWSO2CON 2024 - Software Engineering for Digital Businesses
WSO2CON 2024 - Software Engineering for Digital Businesses
 
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
 
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
Devoxx UK 2024 - Going serverless with Quarkus, GraalVM native images and AWS...
 
Announcing Codolex 2.0 from GDK Software
Announcing Codolex 2.0 from GDK SoftwareAnnouncing Codolex 2.0 from GDK Software
Announcing Codolex 2.0 from GDK Software
 
Architecture decision records - How not to get lost in the past
Architecture decision records - How not to get lost in the pastArchitecture decision records - How not to get lost in the past
Architecture decision records - How not to get lost in the past
 
WSO2Con2024 - Hello Choreo Presentation - Kanchana
WSO2Con2024 - Hello Choreo Presentation - KanchanaWSO2Con2024 - Hello Choreo Presentation - Kanchana
WSO2Con2024 - Hello Choreo Presentation - Kanchana
 
WSO2CON 2024 - Building a Digital Government in Uganda
WSO2CON 2024 - Building a Digital Government in UgandaWSO2CON 2024 - Building a Digital Government in Uganda
WSO2CON 2024 - Building a Digital Government in Uganda
 
Artyushina_Guest lecture_YorkU CS May 2024.pptx
Artyushina_Guest lecture_YorkU CS May 2024.pptxArtyushina_Guest lecture_YorkU CS May 2024.pptx
Artyushina_Guest lecture_YorkU CS May 2024.pptx
 
WSO2CON 2024 Slides - Open Source to SaaS
WSO2CON 2024 Slides - Open Source to SaaSWSO2CON 2024 Slides - Open Source to SaaS
WSO2CON 2024 Slides - Open Source to SaaS
 
AzureNativeQumulo_HPC_Cloud_Native_Benchmarks.pdf
AzureNativeQumulo_HPC_Cloud_Native_Benchmarks.pdfAzureNativeQumulo_HPC_Cloud_Native_Benchmarks.pdf
AzureNativeQumulo_HPC_Cloud_Native_Benchmarks.pdf
 
WSO2CON 2024 - Unlocking the Identity: Embracing CIAM 2.0 for a Competitive A...
WSO2CON 2024 - Unlocking the Identity: Embracing CIAM 2.0 for a Competitive A...WSO2CON 2024 - Unlocking the Identity: Embracing CIAM 2.0 for a Competitive A...
WSO2CON 2024 - Unlocking the Identity: Embracing CIAM 2.0 for a Competitive A...
 

Boston, MA Developer Group 2/7/2019 - Introduction to lightning web components

Editor's Notes

  1. Lightning Web Components is a new programming model for building Lightning components. It leverages the web standards breakthroughs of the last five years, which means you can use more of the modern language of the web, build components that have blazing fast performance, and what you build can coexist and interoperate with the original Aura programming model.
  2. To understand why we are launching Lightning Web Components, it is helpful to go back a few years and take a look at the web stack in 2014. Back then, web standards only offered a limited foundation for the full stack that developers need to build large scale web applications: a rendering engine, standard elements, events, and a core language (ECMAScript 5). In addition to being rudimentary, that foundation had other shortcomings traceable to its roots as a page rendering platform, not an application execution platform. For example: Rendering wasn't optimized for continuous UI transformation Standard UI elements were scarce and the standard didn't support the creation of custom elements The core language lacked modern constructs to write large and modular enterprise-class apps at the client-side (modules, classes, promises, decorators, etc.) As it is often the case, the community and software vendors jumped in to fill the gaps. For example: Different libraries provided different language extensions to support modular and large-scale development: modules (AMD and CommonJS), promises, classes, and other general utilities. Different frameworks introduced different component model and html templating approaches. New techniques were developed to optimize rendering (for example, the virtual DOM in React, Ember, and Vue). In 2014, when we launched the Lightning Component framework along with the Aura programming model, we were part of that effort to push the web forward and enable large scale client-side application development on the web.
  3. Although these community and software vendor efforts made it possible to develop large scale client-side apps on the web, they also came with a number of challenges: Frameworks became the language. React, Angular, and the Lightning Component Framework are all JavaScript frameworks, but they provide such a high level of abstraction that they feel like different languages. As a result, skills were not transferable, and developers were hard to find and ramp up. Apps and components written with different frameworks are not interoperable. This fragmentation underscored the need for standardization.
  4. That is when the standard organization woke up: the last five years have seen an unprecedented level of innovation and standardization, mostly driven by the W3C/WHATWG and the ECMAScript Technical Committee (TC39) of which Salesforce is a member. The list of standards developed during the last five years includes: ECMAScript 2015 (6), 2016 (7), 2017 (8), 2018 (9) and beyond (adding classes, modules, promises, decorators, etc.) Web components Custom elements Templates and slots Shadow DOM
  5. As a result, the web stack looks very different today than it did five years ago, with its weight now heavily tilting towards standards. The core stack finally got the update it needed to become an application development platform in its own right. Many features that required frameworks now come standard: you no longer need a proprietary component model, proprietary language extensions, proprietary modules, etc. The standardization of the core stack is incredibly exciting and opens the door to a new breed of frameworks: frameworks whose major task is no longer to fill in the gaps in the core stack, but to provide a thin layer of specialized services on top of a standard stack that is now suitable for large scale app development.
  6. Lightning Web Components is the Salesforce implementation of that new breed of lightweight frameworks built on web standards. It leverages custom elements, templates, shadow DOM, decorators, modules, and other new language constructs available in ECMAScript 7 and beyond. Lightning Web Components provides a layer of specialized Salesforce services on top of the core stack, including: The Base Lightning Components, a set of over 150 UI components all built as custom elements. The Lightning Data Service which provides declarative access to Salesforce data and metadata, data caching, and data synchronization. The User Interface API, the underlying service that makes Base Lightning Components and the Lightning Data Service metadata aware, leading to substantial productivity gains.
  7. The benefits are substantial: Common component model Common programming model Transferable skills and easier-to-find / easier-to-ramp-up developers Interoperable components Better performance because core features are implemented natively in web engines instead of in JavaScript in framework abstractions. In essence execution of component logic happens lower on the stack, closer to (or as part of) the compiled code layer
  8. With the addition of Lightning Web Components, there are now two ways to build Lightning components: Aura Components, leveraging its own component model, templates, and modular development programming model. Lightning Web Components, built on top of the web standards breakthroughs of the last five years: web components, custom elements, Shadow DOM, etc. Aura components and Lightning web components can coexist and interoperate, and they share the same high level services: Aura components and Lightning web components can coexist on the same page Aura components can include Lightning web components Aura components and Lightning web components share the same base Lightning components. Base Lightning components were already implemented as Lightning web components. Aura components and Lightning web components share the same underlying services (Lightning Data Service, User Interface API, etc.). If you are already developing Lightning components with Aura, you can continue to do so. Your Aura components will continue to work as before. You can build new components with Aura or Lightning Web Components. Your Aura and Lightning Web Components can coexist and interoperate. Over time, you can consider migrating your Aura Components to Lightning Web Components, starting with the components that would benefit the most from the performance benefits of Lightning Web Components. If you are new to developing on Lightning, or if you are starting a new project, we recommend using Lightning Web Components.
  9. Exciting time to be a Salesforce developer! Build with a state-of-the-art framework build on web standards breakthrough Deliver High-Performance Apps... … that coexist and interoperate with Aura
  10. Use either the Live Demo Script or the Video Guide to complete this portion
  11. This Trailmix is dedicated to all things Lightning Web Components. It’s full of useful resources and hands-on projects to take you deep into the new component programming model, the new tools available to build and deploy, and ways to connect with Salesforce Developers around the world!