FOTW episodio 6: DhiWise, FlutterFlow, Locofy y ShedLock

Refes, experimentación y cosas nuevas van y vienen entre fluxers como parte de nuestra rutina diaria. Fluxers on the watch es la forma en que compartimos esas refes con vos. Conocé la sexta recopilación de nuestra comunidad de watchers!

Flux IT
Flux IT Thoughts
Published in
5 min readJul 31, 2024

--

DhiWise como herramienta para traducir diseño a código

DhiWise es una herramienta no-code que, a partir de múltiples fuentes de diseño como Figma, Sketch, Adobe XD, etc. y definiciones de REST APIs (establecidas en aplicaciones como Postman), genera el código de aplicaciones front-end usando distintas opciones de tecnologías. Se diferencia de muchas otras como Bubble.io en que genera código legible que Software Devs tradicionales pueden ajustar.

Se llegó a esta herramienta en una investigación sobre formas de generar código a partir de diseños de Figma para permitir a software Devs generar código ejecutable mucho más rápido, requiriendo solo ajustar el código generado para completar las especificaciones del producto.

Después de algunas pruebas, entendimos que la mejor forma de aprovechar este tipo de herramientas de generación de código es comenzar un proyecto con un diseño lo más completo posible, para mitigar el cold start de un proyecto, y sin código o lineamientos asignados. No es tan útil en un esquema incremental donde se usa la herramienta para generar cada nuevo componente que se diseña.

Excepto por este último caso, se puede obtener una app en funcionamiento, que requerirá de algo de trabajo para ajustar detalles mucho más pequeños, y un producto final operativo en mucho menos tiempo.

Colaborador: Iván Dackiewicz

Low-code con FlutterFlow

FlutterFlow es un entorno de desarrollo visual low-code, basado en el popular lenguaje de programación Flutter, que facilita la construcción de aplicaciones multiplataforma (orientada en especial a aplicaciones mobile), su despliegue en producción, conexión con bases de datos y servicios en la nube. Además, permite el desarrollo de custom functions (en Flutter, por supuesto) que amplían los límites de lo que habitualmente se considera una falencia a la hora de utilizar estas herramientas.

Ante la necesidad de un cliente de seguros de salir al mercado lo antes posible con una aplicación funcional y de impacto, nos pareció una excelente oportunidad para poner a prueba esta herramienta. Y realmente no defraudó, el desarrollo fue veloz y salimos a producción con la aplicación en tiempo récord!

Pros y contras:

Aunque FlutterFlow nos dio excelentes resultados para el rápido desarrollo de aplicaciones simples, con el equipo adecuado creemos que también sería útil para aplicaciones más complejas.

Una de sus grandes ventajas es que es una herramienta multipropósito y adaptable, en su gran mayoría, a cualquier contexto de desarrollo. Aunque, a mayor complejidad, se hace más necesario un conocimiento más profundo de Flutter.

Si bien el apartado de despliegues automáticos en las stores, tanto de Apple como de Android, no es tan automático, sí que ayuda a la hora de desplegar de manera consistente en ambas plataformas.

Colaborador: Gabriel García, Technical Leader

Locofy

Hace poco estuve investigando formas de traducir un diseño hecho en Figma a componentes React.

Locofy es una herramienta en estado beta que permite, entre otras cosas, importar un diseño de Figma, analizarlo con IA (lo cual hoy en día no es sorpresa), y generar un proyecto React.js, usando Create-React-App como base, con los componentes ya escritos.

De las herramientas que he visto, Locofy es una de las que permite más variantes al momento de configurar previo a generar el código:

  • Usa JavaScript pelado o TypeScript
  • Maneja estilos con CSS simple, CSS Modules, Tailwind CSS, Emotion o styled-components
  • Emplea px o rem como unidades de medida.
  • Presenta los nombres de archivos en pascal case o kebab case.
  • Utiliza librería UI como Material UI, Ant Design, Bootstrap, Chakra (este punto es opcional).

¿Qué tal es el resultado? ¿Se puede usar? Y la respuesta es… sí, con condiciones.

Cada proyecto React es un mundo ya que carece de un estándar que garantice que lo generado sea exactamente como se desea. En muchos casos, esto no se puede solucionar fácilmente. Es probable que el proyecto generado no encaje con el estilo propio, y buena parte del resultado depende de qué tan prolijo esté el diseño que se usa como base.

Otro tema es la cantidad de componentes diseñados. Cuantos más componentes se generen, mayor será el ahorro de tiempo. A su vez, cuanta menor complejidad y cantidad de variantes tenga un componente, menor será la cantidad de ajustes requeridos, lo que también impacta en el tiempo requerido.

Mi opinión personal es que el código generado sirve para crear los componentes visuales base en masa, para después acomodarlos a gusto. Siempre guardaría un poco de tiempo para revisarlos y ajustarlos, pero esto puede ahorrar tiempo y esfuerzo, en especial sí son muchos los componentes importados.

Todavía queda por ver cómo seguirá evolucionando esta herramienta.

¿Alguien ha probado herramientas similares? ¿Cuál fue su experiencia?

Colaborador: Iván Dackiewicz

ShedLock con Spring

Para los equipos de desarrollo que buscan mejorar la eficiencia y la confiabilidad de sus aplicaciones Java, la integración de ShedLock con Spring ofrece una solución integral y efectiva.

ShedLock es una biblioteca Java que proporciona un mecanismo de bloqueo distribuido para tareas programadas en aplicaciones que se ejecutan en un entorno de múltiples instancias. Con ShedLock, quienes desarrollan pueden asegurarse de que las tareas programadas se ejecuten en un solo nodo del clúster en un momento dado, evitando así la ejecución duplicada y garantizando la consistencia de los datos y la integridad de la aplicación.

¿Qué beneficios tiene?

  1. Evita ejecuciones concurrentes en entornos distribuidos y con múltiples instancias, al bloquear las tareas programadas de manera efectiva.
  2. Contribuye a mantener la consistencia de los datos y la integridad de la aplicación, ya que garantiza que solo una instancia ejecute una tarea en un momento dado
  3. Permite escalar aplicaciones de manera eficiente para manejar cargas de trabajo crecientes sin comprometer el rendimiento.
  4. Es de fácil Integración: La integración de ShedLock con Spring es sencilla y se puede implementar rápidamente en aplicaciones existentes, lo que minimiza el tiempo de desarrollo y acelera el despliegue.
  5. Mejora la confiabilidad y la estabilidad de las aplicaciones Java de manera significativa, ya que evita conflictos de ejecución y garantiza la consistencia de los datos.

En un mundo donde la eficiencia y la confiabilidad son imperativas en el desarrollo de software, la combinación de ShedLock con el marco de trabajo Spring emerge como una solución poderosa y de ágil implementación.

Conocé más sobre Flux IT: Website · Instagram · LinkedIn · Twitter · Dribbble · Breezy

--

--

Flux IT
Flux IT Thoughts

Desarrollamos soluciones de alto voltaje que transforman la realidad tecnológica de grandes empresas.