Este documento presenta una introducción a Visualforce y Apex, incluyendo: - Una descripción general de Apex y sus similitudes y diferencias con Java. - Una explicación del framework Visualforce y cómo usa el patrón MVC. - Una agenda con los diferentes módulos a cubrir sobre Visualforce, controladores estándar, extendidos y personalizados.

1. Visualforce and Apex
Workshop
Bilbao – Universidad de Deusto

2.  Daniel Expósito López
• Developer Corporate R&D
• FinancialForce.com (Spain)
• Mail: dexposito@financialforce.com
• Twiter: @daniexpo71
Speaker

3. 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.

4. Go Social!
@salesforcedevs
Salesforce Developers
+Salesforce Developers
Salesforce Developers
Salesforce Developers

5.  Introducción a Visualforce y Apex
 Visualforce
 Controlador Estándar (Standard Controller)
 Controlador Extendido (Controller Extension)
 Controlador Apex Personalizado (Custom Controller)
 Creación y ejecución de Unit Tests
 Enlaces de interés
 Preguntas y dudas
Agenda

6. El código que se va a escribir en el workshop lo podéis encontrar en:
https://github.com/northspainsalesforcedevelopergroup/elevator
20150226

7. Modulo 1:
Introducción a Visualforce y Apex

8. Introducción a Visualforce y Apex
Introducción
 Force.com incluye diferentes herramientas que nos permiten crear aplicaciones bastante completas desde cero sin tener que escribir ni una
sola línea de código (asistentes de creación de aplicaciones, objetos, tabs, layouts, …)
 Pero también proporciona servicios de alto nivel como web services, ejecución de código planificada, procesos por lotes, triggers, lógica de
backend para pantallas, etc. Todo esto requiere programación en Apex y Visualforce.
Apex
 Lenguaje de programación orientado a objetos, fuertemente tipificado que permite escribir código que se ejecute en la plataforma Force.com
 Apex permite a los desarrolladores añadir lógica a la mayoría de eventos del sistema incluyendo botones, actualización de registros y lógica
para las pantallas
 Usa sintaxis muy similar a Java.
 Apex es interpretado, ejecutado y controlado completamente por la plataforma Force.com.
 Clases e interfaces.

9. Apex y Java
Igual
 Tipos de datos primitivos
 Control de flujo (if, for, while, …)
 Manejo de excepciones
 Colecciones: Lists, Sets, …
Diferente
 Insensible a mayúsculas
 Strings con comillas simples: 'Joe'
 Tipo de dato Id
 Built-in support para acceso a BD.

10. Introducción a Visualforce y Apex
Visualforce
 Framework basado en componentes para la creación de interfaces de usuario en la plataforma Force.com.
 Permite construir pantallas sofisticadas mediante un lenguaje basado en tags similares a HTML (con prefijo apex) y una librería de
componentes reusables que puede ser extendida.
 Similar a JSP y ASP. Controlador basado en APEX
 VisualForce se construyen combinando componentes de la plataforma, HTML, hojas de estilo o cualquier tecnología web o framework de
javascript que permita crear interfaces de usuario mas dinámicas y animadas.
 Cuando un usuario accede a una pagina visualforce el servidor realiza cualquier procesamiento requerido por la página, convierte la página a
HTML y devuelve el resultado al navegador para mostrarlo.

11. Introducción a Visualforce y Apex
MVC Model-View-Controller
 Salesforce usa el patrón de diseño Modelo-Vista-Controlador (MVC) que ayuda a la separación de conceptos y como beneficios proporciona
un código mas reusable y minimiza el impacto de los cambios.
 La vista (visualforce) interactúa con un controlador (clase apex) que implementa alguna funcionalidad para la página. Por ejemplo, la lógica a
ejecutar cuando se pulsa un botón.
 El controlador interactúa con el modelo (custom objects) obteniendo datos que se quieran mostrar.
 Salesforce proporciona “Controladores Estándar” para los objetos que pueden ser usados para interactuar con los datos, por lo tanto en
algunos casos no necesitaremos escribir el código para el controlador.
 Aunque también puedes extender los controladores o crear tu propios controladores personalizados.

12. Model-View-Controller en Salesforce
View
• Standard Pages
• Visualforce Pages
• External apps
Controller
• Standard Controllers
• Controller Extensions
• Custom Controllers
Model
• Objects
• Triggers (Apex)
• Classes (Apex)

13. Modulo 2:
Visualforce

14. Visualforce: Creación de visualforce
 Vamos a crear una primera visualforce “holamundo” bastante simple que nos servirá para familiarizarnos con el editor de visualforce y la
creación de páginas.
Development Mode
 Development Mode nos permite acceder a un editor de páginas visualforce que a través del navegador para poder ver el código y
previsualizar el aspecto de la página al mismo tiempo. Development mode también contiene un editor de Apex para trabajar con controladores
y extensiones.
 Para habilitar el Development mode ir a:
• Configuración > Gestionar usuarios > Usuarios
• Editar vuestro usuario
• Seleccionar “Modo de desarrollo”
• Guardar
• Configuración > Mi información personal > Información personal
• Modificar
• Seleccionar “Modo de desarrollo”
• Guardar

15. Visualforce: Creación de visualforce
 En el navegador añadimos /apex/holamundo a la instancia de Salesforce.
Por ejemplo si tu instancia es https://eu5.salesforce.com, la nueva URL será https://eu5.salesforce.com/apex/holamundo.
 A continuación deberíais ver el siguiente error:
 Pulsa en el enlace Create Page holamundo y se abrirá el editor de visualforce con algún código por defecto.

16. Visualforce: Creación de visualforce
 Se abrirá el editor de visualforce con algo de código por defecto:

17. Visualforce: Creación de visualforce
Menú del editor de Visualforce
 Las opciones del editor son las siguientes:
– Guardar y previsualizar
– Buscar
– Ir a línea
– Hacer/Deshacer
– Aumentar/Decrementar tamaño de fuente
 Otras opciones:
– Enlace a la ayuda de componentes visualforce
– Información sobre donde es usada la visualforce
– Minimizar/Maximizar editor de visualforce
– Cerrar development mode

18. Visualforce: Creación de visualforce
Component Reference
 Listado de componentes que se pueden incluir en una visualforce.
 Para cada componente encontramos una descripción.

19. Visualforce: Creación de visualforce
Modificar la Visualforce
 Volvemos a editar nuestra primera visualforce hello con el editor de visualforce
 Reemplazamos el contenido por lo siguiente:
 Botón Save
 El contenido de la pagina se refresca automáticamente.
 Una visualforce siempre tiene que empezar y terminar con el tag apex:page (componente visualforce)
 Los tags de visualforce siguen el formato XML por lo tanto también hay algunos tags que se auto-cierran. Por ejemplo: <apex:detail />
 Generalmente se puede modificar el comportamiento y/o apariencia de un componente añadiéndole atributos. Los atributos son pares
nombre/valor que se añaden al componente. Por ejemplo: sidebar="false".

20. Visualforce: Creación de visualforce
Añadir atributos usando auto-ayuda
 Añadimos el atributo sidebar=“false” a nuestro tag de <apex:page>
 Guardamos y vemos que efectivamente la parte de la izquierda de nuestra ventana ha desaparecido.
 Posiciona el cursor después de las segundas comillas y pulsa espacio. Aparece una lista de atributos válidos para el componente apex:page.
 Elige el atributo showHeader y ponlo a false. Guarda y verás que esta vez tu página tiene un aspecto diferente. Con este atributo hemos
eliminado la cabecera de la página.
 Vuelve a ponerlo a true y vuelve a guardar.

21. Visualforce: Creación de visualforce
Componentes Adicionales
 Añade el siguiente código a la visualforce y guardar:
 PageBlock: Un área de una página que usa un estilo similar a la apariencia de Salesforce pero sin ningún contenido por defecto.
 PageBlockSection: Una sección de datos que se incluye en el componente < apex:pageBlock > component. Es similar a una sección en la
definición de layout de un objeto estándar de salesforce.

22. Visualforce: Creación de visualforce
La pantalla tiene el siguiente aspecto con los estilos de Salesforce:

23. Visualforce: Creación de visualforce
Variables globales y formulas
 Force.com guarda información sobre el usuario conectado en una variable global llamada User. Se puede acceder a esta variable global y
cualquier otra mediante una expresión de lenguaje con la siguiente sintaxis:
{! $<global variable>.<field name>}
 {! …} indica a la visualforce que cualquier contenido dentro es dinámico y su valor debe ser calculado y sustituido en tiempo de ejecución.
 Otras variables globales: Page, Label, Profile, …
 Aparte de las variables globales, visualforce también soporta fórmulas que permiten manipular valores.

24. Visualforce: Otras formas de trabajar con VF
Configuración
 Hay otras formas alternativas de crear y editar visualforce sin usar el development mode.
 Desde Configuración
• Configuración > Desarrollo > Páginas
• Nuevo

25. Visualforce: Otras formas de trabajar con VF
Developer Console
 Desde Developer Console (Consola de Desarrollador)
• File > New > Visualforce Page

26. Visualforce: Otras formas de trabajar con VF
Otros
 Force.com IDE (Eclipse Plugin)
 MavensMate (Sublime Plugin)

27. Email
Templates
Embedded in Page
Layouts
Generate PDFs
Custom Tabs
Mobile
Interfaces
Page Overrides
Dónde puedo usar una Visualforce?

28. Tipos de Controladores
 En el paradigma MVC la vista interactúa con un controlador que contendrá alguna funcionalidad necesaria para la página. Por ejemplo, la
lógica a ejecutar cuando un botón es pulsado.
 Lo objetos de la plataforma tienen standard controllers por defecto que pueden ser usados para interactuar con los datos asociados a ese
objeto y en muchos casos no necesitaremos escribir el código del controlador. Por lo tanto al trabajar con visualforce tenemos las siguientes
opciones:
– Usar el controlador estándar de salesforce para el objeto.
– Extender el controlador estándar añadiendo nueva funcionalidad.
– Crear un controlador personalizado desde cero.

29. Modulo 3:
Controlador Estándar
Standard Controller

30. Ejemplo: Crear nueva VF “producto”

31. Controlador Estándar (Standard Controller)

32. Controlador Estándar (Standard Controller)
Conseguir el ID de un registro y añadirlo a la URL
 Cuando la página visualforce interactúa con otras paginas en tu aplicación, puedes pasarle el identificador de un registro y la visualforce
puede mostrar la información de dicho registro.
 Por ejemplo:
– Ir a la aplicación Almacén
– Ir al tab del objeto Productos
– Pulsa en alguno de los registros y la pantalla mostrara los detalles de ese registro
– La URL cambia a algo parecido a esto: https://<your salesforceinstance>.salesforce.com/0018000000MDfn1
(el ID es la serie de dígitos del final: 0018000000MDfn1)

33. Controlador Estándar (Standard Controller)
Añadir Id a la URL
 Añadimos el Id del registro a la URL de la visualforce como parámetro

34. Controlador Estándar (Standard Controller)
Introducir datos usando formularios
 Vamos a crear una nueva visualforce llamada producto2
 Usando los componentes <apex:form> , <apex:inputfield> y <apex:commandButton> podemos crear una página visualforce para crear/editar
datos.
 <apex:form> es un componente que empaqueta todo lo que incluye para enviarlo al servidor como parte de una acción.
 <apex:inputField> crea un campo de formulario para un campo del objeto.
 <apex:commandButton> añade un botón a la interfaz de usuario de la página.. Este botón lanza una acción cuando es pulsado. En este
caso la acción es el save() del standard controller.
 <apex:pageMessages> para mostrar cualquier error o mensaje del formulario.
 Igual que en los ejemplos anteriores podemos añadir un Id válido en la URL:
 Si añadimos un Id estaremos editando y modificando un registro existente.
 En otro caso crearemos registros nuevos.

35. Ejemplo: Crear nueva VF “producto2”

36. Controlador Estándar (Standard Controller)
La pantalla resultante tiene el siguiente aspecto:

37. Modulo 4:
Controlador Extendido
Controller Extension

38. Controlador Extendido (Controller Extension)
Controlador Extendido
 Un controlador extendido es una clase personalizada escrita en APEX
 Trabaja sobre el mismo objeto que el controlador estándar.
 Puede sobreescribir el comportamiento del controlador estándar y añadir nuevo funcionamiento.

39. Modulo 5:
Controlador Personalizado
Custom Controller

40. Controlador Personalizado (Custom Controller)
 Con el controlador estándar la plataforma nos proporciona la funcionalidad básica para la pantalla.
 Un controlador personalizado te permite ir mas allá de ese comportamiento básico.
 El controlador contiene la lógica y la manipulación de datos necesaria para la página visualforce. Cuando necesitas sobre escribir la
funcionalidad existente, personalizar la navegación a través de la aplicación o un control mas exhaustivo sobre el acceso a la información,
visualforce nos permite escribir un controlador personalizado usando APEX y controlar la lógica de la aplicación de principio a fin.
Crear un Custom Controller
 Un controlador es simplemente una clase APEX. El único requerimiento para que una clase APEX se use como controlador es que exista.
 El controlador ni hereda de otra clase, ni implementa ninguna interfaz.
 Desde Configuración
• Configuración > Dsarrollo > Clases de Apex
• Nuevo
• Añadir la clase publica ProductoController
• Guardar

41. Controlador Personalizado (Custom Controller)
Crear un Visualforce
 Vamos a crear una nueva visualforce llamada productocustom que utilice nuestro controlador personalizado:
Añadir funcionalidad al controlador y la visualforce
 Método getProductos: Un método que recupera la información de los registros en la org mediante una consulta SOQL y los devuelve en una
lista.
 Clase interna VistaProductos: Podríamos pasar directamente los custom objects de la base de datos a la vista, pero eso no sería del todo
correcto. Por eso crearemos una clase interna para usar correctamente el patrón de diseño MVC.
 Modificar la visualforce: Modificar la visualforce productocustom para que obtenga la lista de productos llamando al método getProductos y los
muestre en pantalla.

42. Ejemplo: “ProductoController”

43. Ejemplo: “productocustom”

44. Controlador Personalizado (Custom Controller)

45. Modulo 6:
Unit Tests

46. Unit Tests
Definición de Unit Test
 En programación una prueba unitaria es una forma de comprobar el correcto funcionamiento de un módulo de código.
 Esto sirve para asegurar que cada uno de los módulos funcione correctamente por separado. Luego, con las pruebas de integración se podrá
asegurar el correcto funcionamiento del sistema o subsistema en cuestión.
Ventajas de Unit Test
 Fomentan el cambio
 Simplifican la integración
 Documenta el código
 Separación de la interfaz y la implementación
 Errores mas acotados y fáciles de localizar
Unit Test en Salesforce
 Salesforce requiere una cobertura del 75% para garantizar la calidad del código si:
– tu código va a ser empaquetado y subido a la AppExchange
– va a despleagarse en una org de producción
 Cobertura: Número de líneas de código cubiertas por los tests / Número total de líneas de código

47. Ejemplo: “ProductoControllerTest”

48. Unit Tests
Ejecutar Unit Tests y comprobar resultado:
 Configuración > Desarrollo > Ejecución de pruebas de Apex

49. Modulo 7:
Enlaces de Interés y preguntas

50. Enlaces de Interés
Enlaces generales:
 Power Point del workshop
• http://slideshare.net/northspainsalesforcedevelopergroup
 Código del workshop
• https://github.com/northspainsalesforcedevelopergroup/elevator20150226
 Meetup de Bilbao
• http://www.meetup.com/Spain-Salesforce-Developer-User-Group/
• http://www.meetup.com/Spain-Salesforce-Developer-User-Group/events/220539551/
 Salesforce Essentials Madrid
• https://www.salesforce.com/es/events/details/sfe15-madrid/
Información sobre visualfoce:
 Workbook de Visualforce
• http://www.salesforce.com/us/developer/docs/workbook_vf/index.htm
 Visualforce Technical library
• https://developer.salesforce.com/page/User_Interface
 Trailhead
• https://developer.salesforce.com/trailhead

51. Preguntas y dudas

52. Daniel Expósito López
Developer Corporate R&D FinancialForce.com (Spain)
• Mail: dexposito@financialforce.com
• Twiter: @daniexpo71
Feedback Elevate Bilbao: http://bit.ly/elevate-bilbao