Migasfree Play 5

Presentación realizada para la migascon 2022, en la que se muestra el rediseño de la aplicación migasfree play en su versión 5.

Transcript

1. MIGASFREE PLAY
   #migascon2022
   Jose Antonio Chavarría
   2022-05-19
   Presentación realizada para la migascon 2022, en la
   que se muestra el rediseño de la aplicación migasfree
   play en su versión 5.
   

   View Slide

2. migasfree launcher migasfree play
   Migasfree Play nace en 2018 como heredero de migasfree-
   launcher. Este primer proyecto era la interfaz gráfica del
   cliente y el que se encargaba de lanzar la sincronización con
   el servidor cada vez que se iniciaba sesión gráfica o cada vez
   que pasaba un cierto intervalo de tiempo (por defecto, 24
   horas). El problema que tenía esta aplicación es que sólo
   estaba preparada para ejecutarse en entornos con Gtk (como
   Gnome).
   Migasfree Play, en cambio, está pensado para ejecutarse en
   cualquier escritorio gráfico (Gnome, KDE, incluso Windows),
   pues está basado en Node Webkit, que es básicamente un
   entorno en el que puedes programar una aplicación web
   (HTML, CSS, JavaScript) para que se ejecute en el escritorio
   del sistema operativo dentro de un navegador web (basado
   en Chrome). La variación del nombre del proyecto (de
   launcher a Play) viene dada por la novedad de mostrar un
   catálogo de aplicaciones seleccionadas por la organización
   para que los usuarios puedan instalarlas en los equipos (al
   estilo de otras tiendas de aplicaciones).
   

   View Slide

3. migasfree backend 5.0
   migasfree client 5.0
   Quasar
   9999
   Express
   3000
   Electron
   migasfree play 5.0
   La versión que hay publicada actualmente, está basada en
   JavaScript plano (vanilla JavaScript) y la organización del
   código era muy mejorable. Además, durante este tiempo, han
   aparecido alternativas a Node Webkit, como electron, por lo
   que tocaba modernizar el proyecto para agregar nuevas
   características y mantener las que ya existen más
   cómodamente.
   El código de la próxima versión, que se liberará dentro de la
   suite 5 de migasfree, está desarrollado en Vue 3. A su vez,
   está escrito en el framework de desarrollo para Vue llamado
   Quasar. Esto nos permite establecer una estructura muy
   clara en los ficheros de código y aprovechar muchos
   componentes que trae Quasar de serie. Desde Quasar, a
   través de axios, podemos lanzar peticiones a la API Rest del
   servidor (migasfree-backend). Para interactuar con el cliente
   (migasfree-client), hacemos uso de un servidor express. Todo
   ello "encapsulado" dentro de electron, que es el componente
   que nos permite ser independientes del escritorio.
   

   View Slide

4. Lo primero que vamos a ver cuando arranquemos la
   aplicación es la carga de datos que tiene que hacer.
   Datos sobre el ordenador, sobre las aplicaciones y
   dispositivos disponibles en el servidor para el equipo,
   información sobre las etiquetas y las preferencias
   propias de la aplicación.
   Este precarga sirve para que el funcionamiento de la
   aplicación sea más fluido que antes.
   

   View Slide

5. El aspecto de la aplicación es más coherente que en la
   versión anterior (v1). Cada página tiene su título y el
   usuario sabe en todo momento en qué parte está.
   La búsqueda por texto es inmediata: en cuanto
   empecemos a escribir algo, al momento se filtrarán los
   elementos que concuerden con dicho texto, tanto en el
   nombre como en la descripción.
   Si una aplicación no tiene un icono definido, se
   mostrará uno por defecto (el de migasfree play).
   

   View Slide

6. En la página de dispositivos se puede buscar por texto
   para encontrar un determinado modelo o fabricante.
   También se puede filtrar entre dispositivos disponibles
   y los asignados para ese equipo.
   

   View Slide

7. Esta sección es nueva respecto a la versión anterior de
   migasfree play.
   Aquí se pueden asignar las etiquetas al ordenador y
   hay 2 acciones disponibles:
   ●
   Comunicar las etiquetas al servidor
   ●
   Establecer las etiquetas en el servidor
   Recordemos que las etiquetas están relacionadas con
   los campos de los despliegues: paquetes pre-incluidos,
   incluidos y excluidos por defecto.
   En el caso de comunicar las etiquetas, no se producirá
   ningún cambio de software en el equipo.
   

   View Slide

8. En la página de Detalles se pueden repasar los
   resultados de las últimas operaciones contra el
   servidor de migasfree.
   

   View Slide

9. En la página de Información se muestran los datos del
   ordenador (hardware e información del equipo en el
   servidor migasfree), datos sobre la última
   sincronización (usuario y fecha), datos de red y una
   etiqueta informativa que se puede imprimir para
   pegarla en el equipo y tenerlo así mejor identificado.
   

   View Slide

10. En las preferencias se puede escoger el idioma de la
    aplicación (por el momento sólo español e inglés) y si
    se desea mostrar la página de detalles durante la
    sincronización con el servidor.
    

    View Slide

11. A diferencia de la anterior versión, la ayuda no se abre
    en una pestaña del navegador web del sistema, sino
    que viene integrada dentro del entorno electron de la
    aplicación.
    

    View Slide

12. #migascon2022
    Muchas gracias por vuestra atención
    @migasfree
    Con todos estos cambios en la arquitectura, hemos
    puesto al día el proyecto y seremos capaces de añadir
    nuevas características más rápidamente.
    Sobre todo, se ha mejorado la organización del código
    para hacerlo más extensible sin perder legibilidad. Si
    tenéis más interés, podéis consultar el proyecto en
    GitHub: https://github.com/jact/migasfree-play
    Cuando esté en producción esta nueva versión, el
    proyecto se pasará a github.com/migasfree.
    Gracias por vuestra atención.
    

    View Slide