Salesforce Apex Hours :- Introduction to lightning components
Customizing Salesforce User Interfaces with Lightning Components
-
Upload
salesforce-developers -
Category
Technology
-
view
802 -
download
0
Transcript of Customizing Salesforce User Interfaces with Lightning Components
Customizing Salesforce UIs with
Lightning Components
Skip Sauls
Director of Product Management
@SkipSauls
Doug Chasman
Distinguished Engineer, Force.com Architect
@dougchasman
Safe harbor statement under the Private Securities Litigation Reform Act of 1995:
This presentation may contain forward-looking statements that involve risks, uncertainties, and assumptions. If any such uncertainties materialize
or if any of the assumptions proves incorrect, the results of salesforce.com, inc. could differ materially from the results expressed or implied by the
forward-looking statements we make. All statements other than statements of historical fact could be deemed forward-looking, including any
projections of product or service availability, subscriber growth, earnings, revenues, or other financial items and any statements regarding
strategies or plans of management for future operations, statements of belief, any statements concerning new, planned, or upgraded services or
technology developments and customer contracts or use of our services.
The risks and uncertainties referred to above include – but are not limited to – risks associated with developing and delivering new functionality for
our service, new products and services, our new business model, our past operating losses, possible fluctuations in our operating results and rate
of growth, interruptions or delays in our Web hosting, breach of our security measures, the outcome of any litigation, risks associated with
completed and any possible mergers and acquisitions, the immature market in which we operate, our relatively limited operating history, our ability
to expand, retain, and motivate our employees and manage our growth, new releases of our service and successful customer deployment, our
limited history reselling non-salesforce.com products, and utilization and selling to larger enterprise customers. Further information on potential
factors that could affect the financial results of salesforce.com, inc. is included in our annual report on Form 10-K for the most recent fiscal year
and in our quarterly report on Form 10-Q for the most recent fiscal quarter. These documents and others containing important disclosures are
available on the SEC Filings section of the Investor Information section of our Web site.
Any unreleased services or features referenced in this or other presentations, press releases or public statements are not currently available and
may not be delivered on time or at all. Customers who purchase our services should make the purchase decisions based upon features that are
currently available. Salesforce.com, inc. assumes no obligation and does not intend to update these forward-looking statements.
Safe Harbor
Overview
Containers & Environments
Details
Demo
Q&A
Agenda
Lightning Customizations
Lightning
Experience
Salesforce1
Mobile
Salesforce
ClassicCommunities
Mobile SDK
Hybrid Apps
Standalone
Lightning AppsExternal Sites
Lightning
Components
Lightning Apps
Lightning
Component
Tabs
Lightning Pages
Lighting
Components for
Visualforce
Lightning Out*
Lightning
Extensions*
Containers & Environments
Lightning Customizations
* Pre-GA in Winter ‘16
Modular, reusable, and extensible, forming the basis of modern Salesforce user interfaces.
Architecture
• Component Bundles – Server-side resources, including XML, CSS, JavaScript, and SVG
• Component Instances – Client-side instances comprised of HTML, CSS, and JavaScript
• Events – Application- or component-scoped events with optional payload parameters
• Interfaces – Indicates that a component adheres to the specified contract, with or without attributes
• Attributes – Define the shape of the component, with strong-typing and default values
• Scope – Indicates whether the component or attribute is available only to package or to entire application
Lightning Components
Lightning Customizations
Top level containers for Lightning Components.
• URL-addressable, e.g, https://gs0.lightning.force.com/myns/demo.app
• May utilize a template for controlling style, splash screen, persistence, etc.
• Does not define a particular style, navigation scheme, etc.
• Examples include Lightning Experience, Salesforce1 Mobile, App Builder, Process Builder
Lightning Apps
Lightning Customizations
Containers for using Lightning Components as tabs/pages.
• Programmatic creation of pages
• Implements the force:appHostable interface
• Defined by the administrator as tabs
• Used in the Salesforce1 Mobile App as tabs in the left-nav
• Used in Lightning Experience in Application Groups (tabsets)
• May be used in standalone apps, interface is simply a marker
Lightning Component Tabs
Lightning Customizations
Containers for using Lightning Components as tabs/pages.
• Declarative creation of pages
• Implements the flexipage:availableForAllPageTypes interface
• Created by administrator using Lightning App Builder
• Used in the Salesforce1 Mobile App as tabs in the left-nav
• Used in Lightning Experience in Application Groups (tabsets)
• Future releases will provide
• Further customization of Lightning Experience
• Custom templates
Lightning Pages
Lightning Customizations
Lightning App Builder
Lightning Customizations
Drag & DropBuild with standard and custom
Lighting Components
Any DeviceDesign for every screen from
one canvas
Templates provide customers with
near-turnkey community solutions
that can be easily customized and
deployed with Community Builder
Templates consist of:- Pages: canvas for building UI, has
distinct URL, layout
- Components: renders content, input
data
- Branding: general properties
including color palettes and fonts
BRANDING
Color palette,
logo, fonts
PAGE
Main canvas
COMPONENT
Renders content
Communities – Templates
Lightning Customizations
3a. select from
standard components
3b. Build your own custom
Lightning components or reuse
Partner built components
3. Add Lightning
Components to build your
page
2. Intuitively drag & drop
components onto page
regions
1. Create New Page
Community Builder – Design new Pages with Drag & Drop Components
Lightning Customizations
Lightning Components may be used in Visualforce/Salesforce Classic
Powered by Lightning Out
Lightning Components for Visualforce
Lightning Customizations
Lightning Components for Visualforce
Lightning Customizations
Lightning Components can now be used in nearly any remote web container
Requirements
• Valid Salesforce session ID (SID), for example from OAuth
• Ability to modify the generated markup for the remote site
Supports
• Secure browser (HTTPS)
• Cross-Origin Resource Sharing (CORS)
Lightning Components for Visualforce is powered by Lightning Out
Availability
• Lightning Components for Visualforce is GA in Winter ‘16
• Lightning Out is in pre-release in Winter ‘16, with plans to be GA in Spring ‘16
Lightning Out
Lightning Customizations
Lightning Out – Platforms
Lightning Customizations
Lightning Out – Frameworks, Toolkits, and Libraries
Lightning Customizations
? XXX
Dynamic, runtime substitution of standard components with Lightning Components
Designed for use with the Salesforce1 Mobile App, and future UIs
Target users are admins who will install and configure the components as extensions
Complements and completes the Lightning Components framework
Extensions (Future)
Lightning Customizations
Extensions (Future)
Lightning Customizations
Object: Account
Field: Rating
Lightning Component: customRatingView
Mode: View
Custom Field Extension
Demos
Q&A
Thank you