Skip to content

mpdevelopment39/flutter-clean-architecture

Repository files navigation

Flutter Clean Architecture Demo

Este proyecto es un ejemplo de aplicación Maestro/Detalle implementando la api de TheMovieDB. El proyecto está desarrollado con las versiones 3.19.2 de Flutter y 3.3.0 del sdk de Dart.

A nivel arquitectura he decidido implementar Clean Architecture de una manera sencilla con su correspondiente abstracción de capas.

  • UI/Presentation. Donde definimos todo lo que tenga que ver con la interfaz de la aplicación, páginas, componentes/widgets, gestión de estados con riverpod...
  • Domain. Donde definimos nuestras entidades de dominio que utilizaremos a lo largo de la aplicación así como los repositorios y los managers(casos de uso). He decidido crear la capa de managers para una gestión más cómoda. Si consideramos que el proyecto se hace muy grande podríamos evitar esta agrupación y gestionar directamente los usecases agrupados en carpetas por funcionalidad.
  • Data. Donde definimos la implementación de nuestros repositorios (Obtención de datos de backend/apis,bbdd,preferencias locales...), las entidades o modelos de data como las respuestas de dichas fuentes de datos y los mappers para convertir las entidades de data en entidades de dominio que utilizaremos en nuestra app.
  • App/Config. Donde definimos archivos de configuración globales de toda la aplicación como constantes, gestión de rutas, inyección de dependencias, helpers...

NOTA: He decidido no crear una entidad más de abstracción como los datasources con sus implementaciones para mantener el proyecto lo más sencillo posible, pero si nos vieramos en una situación en la cual para obtener datos podemos tener diversas fuentes u origenes como por ejemplo un backend o una bbdd local con información cacheada podríamos tener esta capa y definir en cada momento que datasource o fuente de datos queremos implementar en nuestros repositorios.

Para la escrítura de los comentarios del código suelo utilizar la extensión Better Comments de VS Code ya que resulta muy visual y cómoda a la hora de leer dichos comentarios, ya que nos permite tener diversos formatos.

Librerías utilizadas para el diseño

  • sizer
    • Para realizar diseño responsive en función de la resolución de cada dispositivo.
  • lottie
    • Para mostrar animaciones en formato json.
  • liquid_swipe
    • Para realizar el diseño del carrousel inicial.
  • flutter_svg
    • Para poder utilizar recursos vectoriales en formato svg.
  • animate_do
    • Para utilizar animaciones en el diseño.
  • flutter_staggered_grid_view
    • Para realizar componente de películas favoritas.
  • card_swiper
    • Para realizar componente de slider de películas.
  • device_preview
    • Para realizar pruebas de interfaz en cualquier dispositivo.

Librerías utilizadas para implementación de funcionalidad

  • flutter_dotenv
    • Para la gestión de variables de entorno.
  • dio
    • Para la implementación de peticiones Rest.
  • flutter_riverpod
    • Como manejador de estados de la aplicación.
  • get_it
    • Para la inyección de dependencias.
  • go_router
    • Para la navegación y gestión de rutas del proyecto.
  • isar
    • Como BBDD local en la que almacenar información.
  • pretty_dio_logger
    • Para hacer un seguimiento cómodo en consola de los logs de todas las requests realizadas con Dio


A continuación se muestran diferentes gifs con el resultado del proyecto:

Pasos para ejecutar el proyecto

  1. Duplicar el archivo .env.template y renombrarlo como .env
  2. Rellenar variables de entorno con sus valores correspondientes

About

DEMO clean architecture en Flutter

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages