Introduction to Visualforce Webinar


Published on

Out of the box, the Platform can automatically generate user interfaces, but in some cases you might want to build a more custom UI. Join us to learn about Visualforce, the component-based UI framework that lets you build attractive, dynamic, reusable user interfaces.

This webinar is tailored for beginner developers as well as Salesforce administrators.

Watch this webinar to learn about:

:: Common use cases
:: Leveraging Apex code on the server side
:: Debugging techniques
:: Best practices for efficient and responsive pages

Published in: Technology

Introduction to Visualforce Webinar

  1. 1. Introduction to VisualforceThe Beginner’s Guide to a Custom UI Samantha Ready, Developer Evangelist @samantha_ready Eric Wilson, Product Management Director
  2. 2. Safe harbor 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, 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 intellectual property and other litigation, risks associated with 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 products, and utilization and selling to larger enterprise customers. Further information on potential factors that could affect the financial results of, inc. is included in our annual report on Form 10-Q for the most recent fiscal quarter ended July 31, 2012. This 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., inc. assumes no obligation and does not intend to update these forward- looking statements.Join the conversation: #forcewebinar
  3. 3. Follow Developer Force for the latest news @forcedotcom / #forcewebinar Developer Force – Community +Developer Force – Community Developer Force Developer Force groupJoin the conversation: #forcewebinar
  4. 4. What can you do with Visualforce? §  Framework to build custom user interfaces §  Hosted natively on §  Build streamlined UX §  Create internal and public facing pages §  Customize for different devices §  Leverage other web technologiesJoin the conversation: #forcewebinar
  5. 5. Join the conversation: #forcewebinar
  6. 6. Model View Controller (MVC) Pattern Model Controller ViewJoin the conversation: #forcewebinar
  7. 7. Model View Controller (MVC) Pattern Your Data Your Logic Your InterfaceJoin the conversation: #forcewebinar
  8. 8. Model View Controller (MVC) Pattern Standard and Standard Custom Objects Controllers and Apex VisualforceJoin the conversation: #forcewebinar
  9. 9. MVC ExampleJoin the conversation: #forcewebinar
  10. 10. Visualforce Markup §  Visualforce tags •  80+ standard components •  Custom components §  Works with all standard web technologies including: •  CSS •  JavaScript •  HTML •  Flash •  Any other Web-Enabled CodeJoin the conversation: #forcewebinar
  11. 11. What do standard components look like? Merge field to define attribute (can also be a apex: or string literal in some chatter: cases) Attributes to define prefix component <apex:outputField value = “{!Restaurant__c.Address__c}” > Component name(examples: Reference field tables, repeats, (using dot notation) forms, etc) Data binding to objects and class variablesJoin the conversation: #forcewebinar
  12. 12. Visualforce Controllers §  Provides access to data §  Logic for handling UI interaction §  Standard Controllers •  Same functionality as standard pages –  Save, delete, field access etc. §  Custom Controllers •  Written in Apex •  Override standard behavior •  Controller ExtensionsJoin the conversation: #forcewebinar
  13. 13. What does that look like in code? Defined at the page level Standard or custom objects <apex:page standardController = “Restaurant__c” extensions =“yelpExtension, con2” > Custom controller logic to extend Inherit standard CRUD standard functionality. controllers If only using custom controllers, use controller= controllerNameJoin the conversation: #forcewebinar
  14. 14. How can I customize Visualforce?Join the conversation: #forcewebinar
  15. 15. The Developer ConsoleJoin the conversation: #forcewebinar
  16. 16. What can you do with Visualforce?Custom Pages Dashboard Custom Tabs Charts Components Email Embedded Sections Implement Templates in Detail Pages Custom LogicJoin the conversation: #forcewebinar
  17. 17. What else can you do with Visualforce?Join the conversation: #forcewebinar
  18. 18. Rich User InterfacesJoin the conversation: #forcewebinar
  19. 19. Complete Web AppsJoin the conversation: #forcewebinar
  20. 20. MashupsJoin the conversation: #forcewebinar
  21. 21. Mobile VisualforceJoin the conversation: #forcewebinar
  22. 22. BUT… •  Visualforce is NOT your first line of defense •  Working knowledge of HTML, CSS, and JavaScript is essential •  Visualforce has limitsJoin the conversation: #forcewebinar
  23. 23. First Line of DefenseJoin the conversation: #forcewebinar
  24. 24. Proficiency in Web Technologies <table> <tr> <td class="header" colspan="2">...</td> </tr> <tr> <td class="sidebar">...</td> <td class="content">...</td> </tr> <tr> <td class="footer" colspan="2">...</td> </tr> </table> Join the conversation: #forcewebinar
  25. 25. Proficiency in Web Technologies .button { background: #F8F8F8; background: linear-gradient(#F8F8F8, #D4DADC); background: -webkit-linear-gradient(#F8F8F8, #D4DADC); background: -moz-linear-gradient(#F8F8F8, #D4DADC); background: -o-linear-gradient(#F8F8F8, #D4DADC); background: -ms-linear-gradient(#F8F8F8, #D4DADC); filter: progid:DXImageTransform.Microsoft.gradient(...); } Join the conversation: #forcewebinar
  26. 26. Limits Page Size: 15MB Viewstate Size: 135KBJoin the conversation: #forcewebinar
  27. 27. If nothing else, remember this… §  Visualforce is powerful – use it judiciously §  If you don’t know basic HTML, CSS, and JavaScript concepts, no amount of Visualforce magic will help you §  Pay attention to performance at all times §  If you don’t know … ASK | Boards | VisualforceJoin the conversation: #forcewebinar
  28. 28. Next Steps § § § §  Advanced Visualforce Webinar DF Recorded Sessions §  “7 Habits of Highly Efficient Visualforce Pages” §  “Building the New AppExchange Using Responsive Design”Join the conversation: #forcewebinar
  29. 29. Upcoming Events December 5, 2012 Advanced Visualforce Webinar December 11, 2012 AppExchange for Developers Webinar Check out the Developer Force calendar for upcoming local events such as meetups, workshops, and user group meetings: the conversation: #forcewebinar
  30. 30. Survey Your feedback is crucial to the success of our webinar programs. Thank you! the conversation: #forcewebinar
  31. 31. Q&A Samantha Ready Eric Wilson Developer Evangelist, Product Management Director @samantha_readyJoin the conversation: #forcewebinar
  32. 32. Survey Your feedback is crucial to the success of our webinar programs. Thank you! the conversation: #forcewebinar