introduction to lightning components
TRANSCRIPT
![Page 1: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/1.jpg)
Introduction To Lightning Components#SalesforceSaturday
Mohith Shrivastava
Salesforce MVP
CodeScience INC
Blog - cloudyworlds.blogspot.com
![Page 2: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/2.jpg)
Prerequisites1.You Have Some Familiarity With Javascript
2.You Understand DOM Model
3.Familiarity With CSS
4.Worked On Salesforce Development With Apex and Visualforce
![Page 3: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/3.jpg)
Single Page Application
![Page 4: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/4.jpg)
Web Components
![Page 5: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/5.jpg)
Difference between Visualforce and Lightning ComponentsVisualforce
1.Monolithic unless developers use Visualforce components and templates
2.Building SPA applications without using frameworks like angular ,react etc is tedious
Lightning Components
1.Framework enforces developers to break application into components
2.Building SPA is lot easier.Event driven approach .(Publish and Subscribe model)
![Page 6: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/6.jpg)
Why Lightning Components?1. Reusability(App Builder,Community Builder,SF1 ,Visualforce,With
Lightning out take components outside SFDC)
2. Responsive (fits any device)
3. Event Driven approach
![Page 7: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/7.jpg)
MVC In Lightning
![Page 8: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/8.jpg)
Lightning Component Bundle
![Page 9: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/9.jpg)
Tooling Support1.Sublime Plugin
2.MavesMate V7 BETA
3.Force.com IDE - BETA
4.Developer Console
5.Welkins Suite
6.Visual Studio Code Plugin
![Page 10: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/10.jpg)
Example of a Component
![Page 11: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/11.jpg)
Attributes - They are Objects or Variables
![Page 12: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/12.jpg)
Expressions
![Page 13: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/13.jpg)
Styling Lightning Components
![Page 14: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/14.jpg)
Events
![Page 15: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/15.jpg)
Apex For Lightning
![Page 16: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/16.jpg)
SalesLeaderBoard App DemoKey Take Aways
1.Publish Subscribe Model
2.Events publisher and handling
3.Interfaces for App Builders ,Community Builders
4.Use design attributes for admins
![Page 17: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/17.jpg)
Building a Simple Youtube search component for community builders1. Implement
ForceCommunity:availableForAllPageTypes
2. Design Tokens and Design Variables for community builder
3. Callouts via Apex
![Page 18: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/18.jpg)
Building Components for Record Home pages and Home page1. Implement Flexipage:availableForRecordHome
2. Design components for Home page
![Page 19: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/19.jpg)
Lightning Out 1. Mashup Visualforce and Lightning components
2. Heroku App Demo
![Page 20: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/20.jpg)
ReferencesMastering Lightning Components -1
Mastering Lightning Components -2
Trailhead
Lightning Component Developer guide
![Page 21: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/21.jpg)
Questions1.Bring it on Stackexchange - Be precise and make sure you add code reference
2.Developer Forums
3.#askforce
![Page 22: Introduction to lightning components](https://reader036.vdocument.in/reader036/viewer/2022062412/58ea2e4a1a28ab61358b4801/html5/thumbnails/22.jpg)
Thank youOrganiser - Salesforce Bangalore User Group (Madan and Kishore)
Twitter - @msrivastav13