O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

Hands-on Workshop: Intermediate Development with Heroku and Force.com

Carregando em…3

Confira estes a seguir

1 de 72 Anúncio

Mais Conteúdo rRelacionado

Diapositivos para si (18)

Semelhante a Hands-on Workshop: Intermediate Development with Heroku and Force.com (20)


Mais de Salesforce Developers (20)

Mais recentes (20)


Hands-on Workshop: Intermediate Development with Heroku and Force.com

  1. 1. Show Flow Dreamforce 2104 Breakout Session Show Flow Template Notes Introduction to Development on Force.com for Developers 2hr 30min Presentation Device: Customer Speaker: Demo Device Deck Owner/Filename: 0:00 Doors open 0:00 Start 4 min 0:04 Welcome and Intros 6 min 0:10 Agenda/Workbook/Conference App Call out “We might not have time to get to Extra Credit” but we’ll try! If we don’t you can optionally do it as homework  5 min 0:13 Hands-On: Sign up for DE & Install PKG Please encourage all attendees to sign up for a new DE so they don’t run into any issues with disabled features or API naming issues 22 min 0:35 Using JS in VF Pages 15 min 0:50 Hands-On: JS in VF Here we only have slides, but feel free to show your own use case or demo if you have one 15 min 1:05 Using the Salesforce1 Platform APIs 15 min 1:20 Hands-On: Salesforce1 Platform APIs 10 min 1:30 Using Static Resources 5 min 1:35 Hands-On: Static Resources 10min 1:45 Using Canvas Applications 25 min 2:10 Hands-On: Force.com Canvas 20 min 2:30 Q&A Use this as necessary. If you finish way early, you can do the extra credit exercises (there are slides for unit testing and batch) or if you take the whole time, feel free to let the students out.
  2. 2. Intermediate Development on Heroku and Force.com For Developers Samantha Ready, salesforce.com Senior Developer Evangelist @samantha_ready
  3. 3. Samantha Ready Senior Developer Evangelist @samantha_ready
  4. 4. 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 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 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 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-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. Salesforce.com, inc. assumes no obligation and does not intend to update these forward-looking statements.
  5. 5. Go Social! @salesforcedevs Salesforce Developers Salesforce Developers Salesforce Developers +Salesforce Developers
  6. 6. Agenda • Using JavaScript in VF Pages • Using the Salesforce1 Platform APIs • Using Static Resources • Using Canvas Applications Extra Credit: • Unit Testing • Batching and Scheduling
  7. 7. bit.ly/df14-intermediate-dev-workshop
  8. 8. Salesforce Platform is the Fastest Path from Idea to App Idea buy & setup hardware Idea Build App install complex software define user access build & test security make it mobile & social setup reporting & analytics build app Traditional Platforms 6-12 Months? App App
  9. 9. Marketing Cloud AppExchange Salesforce1 App Salesforce1 Platform APIs Salesforce1 Platform Services Salesforce1 Platform Sales Cloud Service Cloud Custom Apps Partner Apps Force.com Heroku Exact Target
  10. 10. The Conference App What we’ll build… • First install schema for a Force.com event management app for sessions and speakers • Build a Google Maps integration (JS) to show conference hotels • Create a companion app (JS + REST) for conference attendees • Deploy companion app in Visualforce with Static Resources • Create and deploy a Node.js app on Heroku and integrate with Force.com Canvas
  11. 11. Free Developer Environment http://developer.salesforce.com/signup
  12. 12. Lab 1 & 2: Setup Your Developer Org & Install PKG http://developer.salesforce.com/signup
  13. 13. Using JavaScript in Visualforce Pages
  14. 14. Why Use JavaScript? • Build Engaging User Experiences • Leverage JavaScript Libraries • Build Custom Applications
  15. 15. JavaScript in Visualforce Pages Visualforce Page JavaScript Remoting Remote Objects (REST)
  16. 16. Demo Examples
  17. 17. JavaScript Remoting • Asynchronous page responses • Most responsive and fastest way to grab data and perform DML • All static data • Decouples the page from the controller • Lets you perform tasks on the page without reloading the entire page • Can help alleviate View State issues • Code still executes in the context of the user viewing the page 3 Parts: 1. In Apex Class: static @RemoteAction in Apex 2. On Visualforce Page: calls Remote Action in JavaScript 3. On Visualforce Page: response handler for result in JavaScript
  18. 18. JavaScript Remoting - Server-Side global with sharing class HotelRemoter { @RemoteAction global static List<Hotel__c> findAll() { return [SELECT Id, Name, Location__Latitude__s, Location__Longitude__s FROM Hotel__c]; } }
  19. 19. "global with sharing"? • global – Available from outside of the application • with sharing – Run code with current user permissions. (Apex code runs in system context by default -- with access to all objects and fields)
  20. 20. JavaScript Remoting - Visualforce Page <script> Visualforce.remoting.Manager.invokeAction( '{!$RemoteAction.HotelRemoter.findAll}', function (result, event) { if (event.status) { for (var i = 0; i < result.length; i++) { var lat = result[i].Location__Latitude__s; var lng = result[i].Location__Longitude__s; addMarker(lat, lng); } } else { alert(event.message); } } ); </script>
  21. 21. Using JavaScript and CSS Libraries • Hosted elsewhere <script src="https://maps.googleapis.com/maps/api/js"></script> • Hosted in Salesforce – Upload individual file or Zip file as Static Resource – Reference asset using special tags – Covered in Static Resources Exercise later
  22. 22. Lab 3: Using JavaScript in Visualforce Pages • Write the HotelMap Visualforce Page
  23. 23. Using the REST APIs
  24. 24. When? Get access to Salesforce data from outside Salesforce: • Integrate Salesforce in existing apps • Build consumer apps • Device integration (Internet of Things)
  25. 25. Mobile SDK Example OAuth REST APIs
  26. 26. Browser Cross-Origin Restrictions OAuth REST APIs app.js index.html HTTP Server Cross Origin Policy
  27. 27. Using a Proxy OAuth REST APIs app.js index.html Proxy HTTP Server
  28. 28. http://bit.ly/trysoql
  29. 29. https://contact-force.herokuapp.com
  30. 30. Connected App
  31. 31. Salesforce REST Toolkit https://github.com/developerforce/Force.com-JavaScript-REST-Toolkit
  32. 32. Lab 10: Using the REST APIs • Create a consumer app hosted outside Salesforce
  33. 33. Windows Users After installing Node.js: 1. Add c:Program FilesNodejs to your path or Run "C:Program FilesNodejsnpm" install 2. Create an "npm" directory in C:Users[yourname]AppdataRoaming
  34. 34. Using Static Resources
  35. 35. What are Static Resources? • Files uploaded to Salesforce instance for use in Visualforce pages – .js – .css – .jpg, .png, .gif, etc. • Can be uploaded individually or as archive (.zip or .jar)
  36. 36. Static Resources
  37. 37. Visualforce and HTML Page Generation • By default, Visualforce generates HTML page elements: – <html> – <head> – <body> • <apex:> tags ensure corresponding HTML elements are inserted at the right place – <apex:stylesheet> – <apex:includeScript>
  38. 38. Referencing Static Resources // Single file <apex:stylesheet value="{!$Resource.bootstrap}"/> <apex:includeScript value="{!$Resource.jquery}"/> <apex:image url="{!$Resource.logo}"/> // ZIP file <apex:stylesheet value="{!URLFOR($Resource.assets, 'css/main.css')}"/> <apex:image url="{!URLFOR($Resource.assets, 'img/logo.png')}"/> <apex:includeScript value="{!URLFOR($Resource.assets, 'js/app.js')}"/>
  39. 39. Controlling HTML Page Generation • You can also take full control over HTML elements generation and position: <apex:page docType="html-5.0” applyHtmlTag="false” applyBodyTag="false"> • Add arbitrary components to Visualforce components that will be “passed through” to rendered HTML • prefix the attribute with "html-” • used to improve usability with HTML5 features such as placeholder “ghost” text, pattern client-side validation, and title help text attributes. • … and use standard HTML tags • <link rel="stylesheet" href="…"> • <script src="…">
  40. 40. Referencing Static Resources // Single file <link href="{!$Resource.bootstrap}" rel="stylesheet"/> <img src="{!$Resource.logo}"/> <script src="{!$Resource.jquery}"></script> // ZIP file <link href="{!URLFOR($Resource.assets, 'css/main.css')}" rel="stylesheet"/> <img src="{!URLFOR($Resource.assets, 'img/logo.png')}"/> <script src="{!URLFOR($Resource.assets, 'js/app.js')}"></script>
  41. 41. Lab 11: Static Resources • Host single page application in Visualforce page
  42. 42. Using Canvas Applications
  43. 43. What is a Canvas App? • A web app integrated in your Salesforce environment • Can be written in any language – Java, .NET, PHP, Ruby on Rails, Node.js, etc. • Transparently authenticated • Context aware (logged in user, current object, etc.)
  44. 44. Use Cases • Internal App • Third-Party / Partner App • External systems with web facade
  45. 45. Where Can It Be Integrated? • Publisher • Page Layouts • Visualforce Pages • Tabs • Mobile Cards
  46. 46. Defining a Canvas App
  47. 47. Transparent Authentication • When loading Canvas app, Salesforce instance posts Base64 encoded data to app endpoint including: – Authenticated token – Context (logged in user, current object, etc) • App decodes data using client secret • Can use authenticated token to make REST API calls
  48. 48. Node.js example var decode = require('salesforce-signed-request'); var secret = process.env.CONSUMER_SECRET; app.post('/signedrequest', function(req, res) { var signedRequest = req.body.signed_request; var decodedRequest = decode(signedRequest, secret); var oauthToken = decodedRequest.client.oauthToken; var instanceUrl = decodedRequest.client.instanceUrl; var context = decodedRequest.context; });
  49. 49. Lab 12: Canvas • Deploy Node.js web app to Heroku • Integrate app in Contact page layout
  50. 50. Writing Unit Tests
  51. 51. Unit Testing • Code to test code • Increases quality and predictability • Unit test coverage is required to move code to production – Must have at least 75% of code covered – Coverage = lines of code exercised by tests / total line of code
  52. 52. Anatomy of a Test Class @isTest private class myClass { static testMethod void myTest() { // 1. Prepare temporary data // 2. Start Test // 3. Execute some code // 4. Stop Test // 5. Assert } }
  53. 53. Create Temporary Data Datetime now = System.now(); // Create speaker Speaker__c sp = new Speaker__c(First_Name__c='Al', Last_Name__c='Smith'); insert sp; // Create two sessions starting at the same time Session__c s1 = new Session__c(Name='Session1', Session_Date__c=now); insert s1; Session__c s2 = new Session__c(Name='Session2', Session_Date__c=now); insert s2; // Book speaker for session1 Session_Speaker__c booking1 = new Session_Speaker__c(Session__c=s1.Id, Speaker__c=sp.Id); insert booking1;
  54. 54. Test and Assert Test.startTest(); // Try to book speaker for session2 Session_Speaker__c booking2= new Session_Speaker__c(Session__c=s2.Id, Speaker__c=sp.Id); Database.SaveResult result = Database.insert(booking2, false); Test.stopTest(); // Insert should fail: can't book same speaker for 2 sessions happening // at same time System.assert(!result.isSuccess());
  55. 55. Running Tests
  56. 56. Lab 13: Unit Testing • Write the TestDoubleBooking class • Run the test
  57. 57. Batch and Schedule
  58. 58. What's a Batch? • Long-running process that runs without manual intervention • Started programmatically
  59. 59. Defining a Batch Job global class SendReminderEmail implements Database.Batchable { global SendReminderEmail(String query, String subject, String body) { // Constructor: accept parameters } global Database.QueryLocator start(Database.BatchableContext bc) { // Select scope (records to process) } global void execute(Database.BatchableContext bc, List<Speaker__c> scope) { // Process data } global void finish(Database.BatchableContext bc) { // Post processing operations } }
  60. 60. Running the Batch Job String q = 'SELECT First_Name__c, Last_Name__c, Email__c ' + 'FROM Speaker__c WHERE Email__c != null'; SendReminderEmail batch = new SendReminderEmail(q, 'Final Reminder', 'The conference starts next Monday'); Database.executeBatch(batch);
  61. 61. What's Scheduled Job? • Unattended background program execution • Occurs at a specified time • Optionally repeated at a specified interval
  62. 62. Defining a Scheduled Job global class ScheduledEmail implements Schedulable { global void execute(SchedulableContext sc) { String q = 'SELECT First_Name__c, Last_Name__c, Email__c ' +'FROM Speaker__c WHERE Email__c != null'; SendReminderEmail batch = new SendReminderEmail(q, 'Final Reminder', 'The conference starts next Monday'); Database.executeBatch(batch); } }
  63. 63. Scheduling the Job (using Code) ScheduledEmail job = new ScheduledEmail(); // Run at 8AM on February 10th // (Seconds Minutes Hours Day_of_month Month Day_of_week Years) // Can use wildcards String schedule = '0 0 8 10 2 ?'; String jobId = System.schedule('Final reminder', schedule, job);
  64. 64. Scheduling the Job (using Clicks)
  65. 65. Monitoring Scheduled Jobs
  66. 66. Lab 14: Batching and Scheduling • Write the SendReminderEmail class • Run the batch
  67. 67. Samantha Ready Senior Developer Evangelist @samantha_ready Survey bit.ly/df-how-intermediate
  68. 68. Certification Logos for “Speaker Intro Slides” For salesforce.com use only Guides for logo placement
  69. 69. Example of a Table Table subtitle Column title Column title Column title Column title 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00
  70. 70. Example of a Table Table style and coloring Column title Column title Column title Column title 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00 0.00
  71. 71. Device Family Without Screens

Notas do Editor

  • Our platform is not merely a cloud hosting service, it is a series of tools and features that enable developers to be successful.

    On our platform, as you building your data model – you are getting a lot more than just a relational database. You get a mobile app, right out of the gate.

  • While Salesforce is often thought of as a CRM company, it is actually so much more than that. The platform encompasses our 3 core platform services: Force.com, for building web apps natively on top of Salesforce with a direct line of access into your data. Heroku for building public, consumer applications in any language. And Exact Target with a suite of advanced marketing and automation tools. On top of that we have all of our core platform APIs to extend and integrate your applications however you requirements demand, and the Salesforce1 mobile app that gives you an instant mobile solution for your internal organization.
  • We’re going to go through adding in programmatic functionality to an installed schema for a conference management app. This demo app manages a conference in a similar way to how we run Dreamforce—objects for sessions, speakers, and automation for session management.

    In this advanced track we’ll create a Visualforce page to map conference hotels, create an app outside of Salesforce and access conference data for integrations, explore different deployment options using static resources, and deploy a Node.js app to Heroku and integrate it into the standard contact page layout.
  • They should create a brand new DE org if they have not done so recently. They should not use a Trial, Sandbox or Production org.

    Emphasize our DE orgs are free and do not expire (they are not product trials)
  • Design interactive sites
    Interacts with HTML source code, the DOM, asynchronous
    Friendlier UX
    Language for the web, computers, laptops, tablets, smart phones, and more
  • Salesforce loads a VF page
    The VF page loads the HTML and resources
    Uses JS remoting (if using Apex otherwise you could use VF Remote objects or REST) to talk to the server and grab data >> VF Remote objects are kind of like a Standard Controller for JS
    The result set of records is returned from the remote action and a result handler then parses that result set. In this case, it would create pins pased off of those records and locations
  • Google Maps
  • RemoteAction annotated method
    Its global for Salesforce1
    Queries all hotels
  • Needs to be global in S1 because a VF page is ultimately a child of the parent window (S1 app container).
  • Green highlights where the JS invokes the remote action method in Apex
    The function is the handler for the result set, which in this case will plot markers on a map if the result returns a success (otherwise it will display an error message)
  • How
  • Visualforce elements when rendered at a run time are a composition of HTML elements
    Use VF if you want validation on metadata and contents to be checked by Salesforce
    Use raw HTML if you want full control to put tags/resources wherever you want. Stylesheets/scripts will be placed in the header regardless of placement within a VF page if you use standard VF tags.
  • Both show appropriate VF components per use case
    Above shows how to reference a single file static resource
    Bottom shows how to traverse a zipfile to get to an individual file within it