Zero to Hero in Lightning Web Components
Complete Guide to learn Salesforce Lightning Web Components from Basics to Advance with real-time problems and projects
Lo que serás capaz de hacer
Lightning Web Component framework is a new programming model to develop Salesforce Lightning Components. The easiest way to learn modern web design, HTML5 and CSS3 step-by-step from scratch. Design AND code a huge project. In this course, we will learn about the following topics: Fundamentals of HTML and CSS Tools for Lightning Web Component Development JavaScript is Required to master the LWC Setup of Vscode, Salesforce DX, Dev HUB, Scratch Org What are Lightning Web Components? Benefits of Lightning Web Components Data Binding and Properties Getter and setter Components Communication Lifecycle hooks PubSub module Lightning Messaging Service Rendering components conditionally Template looping Lightning Data Services and Base components to get Salesforce data in Lightning web Components Navigation Service Apex connection Wire service Reusability of Components Styling technique in LWC PDF Generation in LWC Charts in LWC Maps in LWC CSV generation in LWC Memory Game in LWC Many Real-time features and Projects All latest features added. Spring 22 changes Summer 22 changes - lightningAlert, lightningPrompt, lightningConfirm The course will mainly focus on Lightning Web Component development. We will take real-time problem statements and examples to learn about each and every topic. If you are new to any web development framework, please do not worry as the course will start from very basic (ground 0) to help you understand how can you start coding web components. If you are already an expert in Web Development frameworks, then this course will definitely be a major plus to your skills as it primarily focuses on learning modern web standards, building ECMAScript modules and developing UI components.
- HTML and CSS required for LWC
- JavaScript required for LWC
- What are Lightning Web Components?
- Benefits of Lightning Web Components over Aura
- Fundamentals of LWC with real time examples
- How to Build reusable Lightning Web Components
Temario
UNIDAD 1 - Introduction · 4 leccionesUNIDAD 1 - Introduction
UNIDAD 1 - Introduction
- Introduction
- Course Outline
- Fundamentals of Web Technology
- Tools for Web Development
UNIDAD 2 - HTML & CSS · 2 leccionesUNIDAD 2 - HTML & CSS
UNIDAD 2 - HTML & CSS
- Basics of HTML
- Basics of CSS
UNIDAD 3 - JavaScript for LWC · 17 leccionesUNIDAD 3 - JavaScript for LWC
UNIDAD 3 - JavaScript for LWC
- JavaScript Learning Path
- Variables
- Fixing Typo in Variables
- Data Types
- null vs undefined
- Spread Operator
- Destructuring
- String interpolation
- String Methods
- Object/JSON Operations
- Array Methods
- Promise
- Modules import and export
- QuerySelector
- Events
- Arrow Function
- setTimeout vs setInterval
UNIDAD 4 - Lightning Web Component and Setup · 6 leccionesUNIDAD 4 - Lightning Web Component and Setup
UNIDAD 4 - Lightning Web Component and Setup
- Intro to Lightning Web Components
- Setting Up Developer org
- Setting Up Salesforce DX Environment
- Setting Up My Domain and Dev Hub
- List of Common SFDX Commands
- Setting up Project and Scratch Org
UNIDAD 5 - Fundamentals of LWC · 12 leccionesUNIDAD 5 - Fundamentals of LWC
UNIDAD 5 - Fundamentals of LWC
- Create Your First Component in LWC
- Component Folder Structure
- Different Naming Conventions Available in LWC
- App Creation and Component Deployment
- Local Properties and Data Binding
- Methods And Two way Data Binding
- @track properties
- Getters in LWC
- Conditional Rendering
- Improved Conditional Rendering
- Template Looping
- Iterator Loop fix
UNIDAD 6 - First Project - Quiz App · 1 leccionesUNIDAD 6 - First Project - Quiz App
UNIDAD 6 - First Project - Quiz App
- QUIZ APP
UNIDAD 7 - Composition and Query Selectors · 3 leccionesUNIDAD 7 - Composition and Query Selectors
UNIDAD 7 - Composition and Query Selectors
- Component Composition
- Shadow DOM
- Accessing Elements in the Component
UNIDAD 8 - Styling in LWC · 6 leccionesUNIDAD 8 - Styling in LWC
UNIDAD 8 - Styling in LWC
- Inline and External CSS
- Lightning Design System
- SLDS design token
- Shared CSS
- Dynamic CSS
- Styling across shadow DOM
UNIDAD 9 - Component Lifecycle Hooks · 5 leccionesUNIDAD 9 - Component Lifecycle Hooks
UNIDAD 9 - Component Lifecycle Hooks
- Introduction to lifecycle Hooks
- Lifecycle Hooks in Mounting Phase
- Lifecycle Hooks in Unmounting Phase
- Lifecycle Hooks in Error Phase
- Render Method
UNIDAD 10 - Components Communication · 11 leccionesUNIDAD 10 - Components Communication
UNIDAD 10 - Components Communication
- Intro to Components Communication
- Parent to Child Communication Approaches
- Parent To Child Communication using primitive Data type
- Parent To Child Communication using non-primitive Data type
- Parent To Child Communication on action at parent component
- Calling Child Method from Parent component
- Child to Parent Communication Approaches
- Child to Parent Communication Using Simple Event
- Child to Parent Communication Using Event with Data
- Child to Parent Communication Using Event Bubbling
- Pubsub Module
UNIDAD 11 - Setter, Slots and CSS behaviour in parent child component · 3 leccionesUNIDAD 11 - Setter, Slots and CSS behaviour in parent child component
UNIDAD 11 - Setter, Slots and CSS behaviour in parent child component
- Setter Method
- Passing Markup Using Slots
- CSS behaviour in parent child component
UNIDAD 12 - Building Reusable Component · 1 leccionesUNIDAD 12 - Building Reusable Component
UNIDAD 12 - Building Reusable Component
- Building Reusable Component
UNIDAD 13 - Aura Coexistence · 1 leccionesUNIDAD 13 - Aura Coexistence
UNIDAD 13 - Aura Coexistence
- Aura Coexistence
UNIDAD 14 - Communication between Visualforce pages, Aura components, and LWC · 4 leccionesUNIDAD 14 - Communication between Visualforce pages, Aura components, and LWC
UNIDAD 14 - Communication between Visualforce pages, Aura components, and LWC
- Lightning Messaging Service
- LWC to LWC Communication using LMS
- LWC TO AURA Communication using LMS
- LWC, AURA and VisualForce Page Communication using LMS
UNIDAD 15 - Salesforce Resources, Component Context and Notification · 12 leccionesUNIDAD 15 - Salesforce Resources, Component Context and Notification
UNIDAD 15 - Salesforce Resources, Component Context and Notification
- Introduction
- Images from Static Resources
- Third Party JavaScript Libraries in LWC
- Using Third Party CSS Library
- Content Asset Files
- Internationalization
- Access Labels
- Check Permissions
- Access Client Form Factor
- Get Information About the Current User
- Fetch Record Id and Object Name
- Toast Notification
UNIDAD 16 - Memory Game Project · 1 leccionesUNIDAD 16 - Memory Game Project
UNIDAD 16 - Memory Game Project
- Memory Game
UNIDAD 17 - Navigation Service · 15 leccionesUNIDAD 17 - Navigation Service
UNIDAD 17 - Navigation Service
- Intro to Navigation Service
- Navigate To Home
- Navigate To Chatter
- Navigate To New Record
- Navigate To New Record With Default Values
- Navigate To List View
- Navigate To Files
- Navigate To Record Page in View and Edit Mode
- Navigate To Tab
- Navigate To Record Relationship Page
- Navigate To External Web Page
- Navigate To LWC Page
- Navigate To AURA Component
- Navigate To Visualforce page
- Fetch Current Page Reference
UNIDAD 18 - Base lightning components · 10 leccionesUNIDAD 18 - Base lightning components
UNIDAD 18 - Base lightning components
- Introduction to Work With Data In LWC
- Lightning Data Service
- Base Lightning Components
- lightning-record-form
- lightning-record-view-form
- lightning-record-edit-form
- Reset the lightning-record-edit-form
- Edit the lightning-record-edit-form
- Adding Custom Label to the Fields in Lightning-record-edit-form
- Custom Validation in lightning-record-edit-form
UNIDAD 19 - Lightning Data Service Wire Adapters and Functions · 15 leccionesUNIDAD 19 - Lightning Data Service Wire Adapters and Functions
UNIDAD 19 - Lightning Data Service Wire Adapters and Functions
- Introduction
- @wire service and fetch user details
- How @wire is reactive
- getObjectInfo adapter
- getObjectInfos adapter
- getPicklistValues adapter
- getPicklistValuesByRecordType adapter
- getRecord adapter
- getFieldValue & getFieldDisplayValue functions
- getListUi adapter
- getNavItems adapter
- getRecordUi adapter
- createRecord function
- updateRecord Function
- deleteRecord Function
UNIDAD 20 - Apex in LWC · 8 leccionesUNIDAD 20 - Apex in LWC
UNIDAD 20 - Apex in LWC
- Introduction
- Expose Apex Methods to LWC
- Import Apex Methods
- Wire Apex Method
- Wire Apex Method with Parameters
- Call Apex Methods Imperatively
- Apex Imperative Method with Parameters
- refreshApex Youtube video
UNIDAD 21 - Books Listing App With Rest API Callout · 2 leccionesUNIDAD 21 - Books Listing App With Rest API Callout
UNIDAD 21 - Books Listing App With Rest API Callout
- Books Listing App
- Fixing Issues
UNIDAD 22 - Component Configuration in LWC · 3 leccionesUNIDAD 22 - Component Configuration in LWC
UNIDAD 22 - Component Configuration in LWC
- Meta Configuration in LWC
- LWC in Utility Bar
- LWC in Lightning Tab
UNIDAD 23 - Real Time Features · 10 leccionesUNIDAD 23 - Real Time Features
UNIDAD 23 - Real Time Features
- PDF Generation in LWC
- Maps in LWC
- Filtering in LWC
- Sorting in LWC
- Charts in LWC
- Reusable Modal Component in LWC
- Date Validation
- CSV Generation in LWC
- CSV fix for LWS enabled org
- Custom Carousel Using LWC
UNIDAD 24 - Car Hub Project · 20 leccionesUNIDAD 24 - Car Hub Project
UNIDAD 24 - Car Hub Project
- Introduction
- Project Setup
- Car Hub App Creation
- Car Object Creation
- Adding Custom Fields to Car Object
- Adding Static resources and Creating Car records
- Custom Page Template Design
- Component Creation and Placement
- Filter Section Designing
- Designing Car Card Component
- Fetching Cars from Apex to carListItem
- Creating Car Tiles
- getCars Method with filter logic
- LMS implementation And Filtering
- Passing recordId from carTile to carCard
- Placeholder Component
- Navigate to record Page from car Card Component
- Similar Cars Component
- Summary
- What's More Coming to the Course in future
UNIDAD 25 - Latest Videos · 6 leccionesUNIDAD 25 - Latest Videos
UNIDAD 25 - Latest Videos
- Quick Actions with Lightning Web Component
- LWC Builder - Configure your component settings with clicks
- lightning input with icons
- Lightning Tree Grid
- SOQL Builder - a faster way to write SOQL queries
- Salesforce Icons - Get your LWC or Aura Icons code with a single click
UNIDAD 26 - New Releases · 15 leccionesUNIDAD 26 - New Releases
UNIDAD 26 - New Releases
- Salesforce Code Builder
- View the dependencies of your Lightning Web Component
- getRelatedListsInfo - lightning/uiRelatedListApi
- getRelatedListCount - lightning/uiRelatedListApi
- getRelatedListRecords - lightning/uiRelatedListApi
- getRelatedListInfo - lightning/uiRelatedListApi
- LightningAlert
- LightningConfirm
- LightningPrompt
- lwc:if, lwc:elseif, and lwc:else Improved Conditional Directives
- lwc:ref - Query Any DOM element
- Refresh View API - Update Standard View From Custom Component
- RefreshView API - Update Custom Component view from Standard View without Pa
- Einstein for Developers (Beta) | Salesforce AI for VSCode
- lwc:spread - Spread Properties on Child Components
UNIDAD 27 - Workspace API · 12 leccionesUNIDAD 27 - Workspace API
UNIDAD 27 - Workspace API
- Introduction
- Determine if Component is in Lightning Console App with LWC
- Opens a new workspace tab in a Lightning Console App
- Opens a subtab in a Lightning console app
- Close a tab in a Lightning console app
- Close a subtab in a Lightning console app
- Refresh Tabs in a Lightning console app
- Set Tab Label in a Lightning console app
- Focus Tab in a Lightning console app
- Set Tab Icon in a Lightning console app
- Highlights tab with different Background color in Lightning console app
- Disable workspace tab in Lightning console app
UNIDAD 28 - Salesforce Jest Testing Videos · 1 leccionesUNIDAD 28 - Salesforce Jest Testing Videos
UNIDAD 28 - Salesforce Jest Testing Videos
- All Jest Video Links
UNIDAD 29 - Salesforce JavaScript 1 Certification Preparation · 1 leccionesUNIDAD 29 - Salesforce JavaScript 1 Certification Preparation
UNIDAD 29 - Salesforce JavaScript 1 Certification Preparation
- Salesforce JavaScript 1 Certification Videos list
Tu certificado lo emite la SEP, no solo una plataforma
Al demostrar la competencia recibes un certificado emitido por la Secretaría de Educación Pública a través del Gobierno del Estado de México: un documento oficial que puedes presentar con confianza ante cualquier empleador o institución.
Tu certificado con INEC
- Lo emite la Secretaría de Educación Pública (SEP), a través del Gobierno del Estado de México
- Documento oficial con folio verificable en línea
- Lo otorga la Universidad Tecnológica Fidel Velázquez
Otras plataformas en línea
- Constancia privada emitida por la misma plataforma
- Solo acredita horas cursadas o asistencia
- Sin respaldo de una autoridad educativa
Tu itinerario, de la inscripción al certificado
- 1
Inscripción con pago único
Pagas $2,800 MXN una sola vez y entras de inmediato al curso.
- 2
Estudias a tu ritmo
29 unidades con videos, lecturas y actividades, disponibles 24/7 durante 12 meses.
- 3
Cuestionarios por unidad
Cuestionarios para comprobar lo aprendido.
- 4
Certificado
Emitido por la SEP a través del Gobierno del Estado de México, con folio verificable.
Un certificado oficial de la SEP
Muestra · verificable por folio y QR
- Emitido por la Secretaría de Educación Pública (SEP), a través del Gobierno del Estado de México. No es una constancia privada: es un documento oficial, y ese respaldo marca la diferencia frente a otras plataformas en línea.
- Contenido impartido por Salesforce troop.
- Folio y QR verificables para compartirlo con quien te contrate.
Empieza hoy, a tu ritmo
Un solo pago y acceso inmediato al curso completo durante 12 meses.
- 29 unidades · 207 lecciones · 60 h
- 12 meses de acceso
- Certificado emitido por la SEP (Gob. del Estado de México) con folio verificable
Sobre tu inscripción
¿Cómo es el pago?
Un solo pago de $2,800 MXN. No hay mensualidades ni cargos recurrentes.
¿Cuánto tiempo tengo acceso?
12 meses desde tu inscripción, 24/7, para avanzar a tu ritmo.
¿Quién imparte el contenido?
El curso es impartido por Salesforce troop; INEC gestiona tu inscripción, evaluación y certificado.
¿Qué pasa cuando vence mi acceso?
Puedes renovar tu cuenta tú mismo desde la plataforma, sin trámites ni esperas.
