Empezando con Play y reactive mongo (Segundo meetup Scala Perú Dec 2015)
- 1. @mordonez_me Marco Ordoñez Scala Perú Primeros pasos en el framework Play con reactive mongo
- 2. @mordonez_me Marco Ordoñez Apasionado de las nuevas tecnologías. Usuario de las tecnologías de Scala desde hace ~3 años. Fundador de la empresa Evolbit (www.teamevolbit.com). Promotor del uso de los principios reactivos en el desarrollo de Software.
- 3. Perú users group Play Creación y estructura del proyecto
- 4. Perú users group Play, creación y estructura del proyecto Para crear una nueva aplicación Play ejecutamos el comando “activator new”, para este ejemplo seleccionaremos la opción 6 (play-scala) para crear un proyecto Play basado en Scala.
- 5. Perú users group Play, creación y estructura del proyecto Una vez creado el proyecto podemos ver la estructura básica del mismo. app: Todos el código fuente relacionado al proyecto app/controllers: Todos los controladores de la aplicación app/views: Vistas (html) conf: Archivos de configuración del proyecto project: Archivos de configuración, por ejemplo versión de play, sbt, plugins. public: Todos los archivos estáticos test: Archivos de tests
- 6. Perú users group Play Conociendo los controladores
- 7. Perú users group Play, conociendo los controladores En la forma mas básica un controlador es definido como se ve a continuación. Ya que Play es un framework asíncrono por defecto, el bloque de código dentro Action es una función anónima que se llamará internamente y se envolverá en un Future.
- 8. Perú users group Play, conociendo los controladores Todos los controladores se definen como clases y deben heredar del trait Controller Cada metodo del controller que devuelva un Action está preparado para recibir un request y puede ser declarado en nuestro archivo de rutas (conf/routes) Con el valor Ok podemos crear un result con código http 200. views.html.index es una plantilla en el paquete views. Todas las plantillas son convertidas a funciones, por esa razón se les puede llamar como una función pasando parámetros.
- 9. Perú users group Play Conociendo las vistas
- 10. Perú users group Play, conociendo las vistas Las vistas son plantillas html que son convertidas a funciones. Se pueden agregar parámetros a las plantillas para enviar datos desde el controlador.
- 11. Perú users group Play, conociendo las vistas Las vistas pueden incluir otras vistas solo incluyéndolas en su contenido. Se utiliza @ para escribir código en las plantillas. main es otra plantilla que se encuentra en el mismo paquete (views) y que recibe dos valores, el primero es el titulo como String y el segundo es el contenido como Html. La imagen que vimos en la lamina anterior es la plantilla main.
- 12. Perú users group Play Integrando Reactive Mongo
- 13. Perú users group Play, integrando reactive mongo Reactive mongo es un driver para MongoDB, para integrarlo en Play utilizaríamos la librería creada para Play. Para eso agregamos en nuestro archivo build.sbt la dependencia y agregamos el módulo a nuestro archivo de configuración. libraryDependencies ++= Seq( "org.reactivemongo" %% "play2-reactivemongo" % "0.11.2.play24") Recargar la aplicación (reload) para descargar la dependencia. Instalando la librería
- 14. Perú users group Play, integrando reactive mongo Antes de usar la librería debemos configurar los datos de conexión, para eso agregaremos en el archivo application.conf los datos necesarios para la conexión. mongodb.uri = “mongodb://localhost:27017/play-reactive-mongo“ Configurando la librería
- 15. Perú user group Creando una página de traducción de texto
- 16. Perú users group Creando una página de traducción de texto Crearemos una clase que serializará a BSON automáticamente, solo necesitamos tener un serializador implícito de nuestra clase a JSON. Creando el modelo para guardar las búsquedas
- 17. Perú users group Creando una página de traducción de texto Primero importaremos todas las clases necesarias para ReactiveMongo, WS, nuestro modelo y la librería de JSON de Play. Creando el controlador de servicio de traducción
- 18. Perú users group Creando una página de traducción de texto Luego inyectaremos las respectivas dependencias a nuestro controladores y lo extenderemos con los traits necesarios. Creando el controlador de servicio de traducción Tambien incluiremos una función que nos devuelva la colección de mongo que queremos usar.
- 19. Perú users group Creando una página de traducción de texto Ahora crearemos el método para el servicio de traducción, la analizaremos por partes. Creando el controlador de servicio de traducción url: /translate El metodo recibirá datos en formato json, por esa razón se debe agregar el parser (parse.json). Al recibir el request queremos saber si es un json válido, para eso usamos validate y fold para obtener el resultado
- 20. Perú users group Creando una página de traducción de texto Si el json es válido obtendremos el path “text” y nuevamente con validate nos aseguramos que el dato sea correcto. Creando el controlador de servicio de traducción
- 21. Perú users group Creando una página de traducción de texto Si el path existe y es String procederemos a realizar el request al servicio de traducción. Creando el controlador de servicio de traducción Cuando el servicio retorne los datos accederemos en el json al key del valor traducido, como es un array nos devuelve un ListBuffer que transformaremos a List y obtendremos opcionalmente el head (headOption). Si el servicio falla devolveremos un None que luego podremos identificar más adelante.
- 22. Perú users group Creando una página de traducción de texto Si el path existe y es String procederemos a realizar el request al servicio de traducción. Creando el controlador de servicio de traducción Validamos si el texto devuelto del servicio no es vacío (match) y si es correcto guardamos los datos en MongoDB, caso contrario retornados un json con un key error para decirle a la vista que hubo un error al traducir el texto. Al guardar los datos en MongoDB también sabremos si ocurre un error con “ok”, si así fuera retornamos el error a la vista también.
- 23. Perú users group Creando una página de traducción de texto Ahora crearemos el endpoint para la vista de nuestra aplicación. Creando el controlador de servicio de traducción url: / En esta vista recuperaremos de la base de datos la lista de búsquedas que se han almacenado para mostrarlas en la lista como búsquedas recientes.
- 24. Perú users group Creando una página de traducción de texto Agregando los controladores a las rutas Ahora que ya tenemos 2 métodos en nuestro controlador debemos exponerlos agregándolos a nuestro archivo de rutas (conf/routes).
- 25. Perú users group Creando una página de traducción de texto Agregando WebJars Con webjars podemos tener dependencias de javascript como si fueran librerías de Scala. Para utilizar webjars con play de forma fácil debemos de agregar a nuestras dependencias la librería de webjars. Las librerías a incluir se pueden ver en http://webjars.org, en nuestro caso solo incluiremos jQuery (linea 17).
- 26. Perú users group Creando una página de traducción de texto Agregando los webjars a las rutas Agregamos el helper de Webjars para estáticos a nuestro archivos de rutas para luego poder usarlo en nuestras vistas.
- 27. Perú users group Creando una página de traducción de texto Agregando WebJars a la vista Ahora que ya tenemos webjars en nuestras rutas podemos usarlo para encontrar nuestros archivos estáticos.
- 28. Perú users group Creando una página de traducción de texto Creando la vista Ya que tenemos todo listo del lado del servidor ahora debemos crear la conexión desde el cliente. Para eso play ofrece un helper que permite acceder a las rutas del servidor desde Javascript de una forma natural.
- 29. Perú users group Creando una página de traducción de texto Creando la vista Ya tenemos todo listo y lo único que nos falta hacer es realizar la llamada al servicio de traducción con ajax, para eso utilizamos $.ajax de jquery.
- 30. Perú users group Creando una página de traducción de texto El resultado! Una vez que ejecutemos el proyecto podremos realizar traducciones desde nuestra vista.
- 31. Perú users group Creando una página de traducción de texto Links de interés https://github.com/evolbit/play-reactivemongo-translator (El proyecto de la presentación) https://www.playframework.com/documentation/2.4.x/ScalaWS http://www.webjars.org/documentation https://cloud.google.com/translate http://reactivemongo.org/ https://www.typesafe.com/community/core-tools/activator-and-sbt