Arquitectura de Aplicaciones

1

¡Renovaremos este curso! Te quedan unos días para concluirlo.

2

Pasos para aprender Flutter Avanzado

3

¿Qué es una Arquitectura de software?

4

Tipos de Arquitecturas para Flutter

5

Arquitectura BLoC en Flutter

6

BLoC + Clean Architecture en Flutter

7

Estructurando nuestro proyecto utilizando la Arquitectura BLoC

8

Haciendo BLoC Singleton en Flutter

9

Aplicando Providers al Proyecto

Firebase y Flutter

10

¡Renovaremos este curso! Te quedan unos días para concluirlo.

11

Integrando Firebase Authentication, Cloud Firestore y Firebase Storage al proyecto

12

Integrando Firebase a Flutter para iOS

13

Integrando Firebase a Flutter para Android

14

Creación de Pantalla de Login con Flutter

15

Creando botones reutilizables en Flutter

16

Autenticación de Firebase con Google

17

¡Renovaremos este curso! Te quedan unos días para concluirlo.

18

Implementando Firebase Authentication en BLoC Pattern

19

Streams en Flutter

20

Manejando una sesión con Firebase Authentication y Flutter

21

Implementando Google SignOut en BLoC

22

Implementando Google SignOut en View

23

Monitoreando y validando la conexión al Sign con Google

24

Mostrando los datos de usuario de Google en la interfaz en Flutter

Cloud Firestore de Firebase en Flutter

25

¡Renovaremos este curso! Te quedan unos días para concluirlo.

26

¿Qué es Cloud Firestore de Firebase?

27

Analizando un modelo de datos no relacional

28

Creando un Modelo de datos en Cloud Firestore

29

Enviando datos a Cloud Firestore

30

Creando un Widget gradiente personalizado

31

Manejo de Desbordamiendo de Texto de Widget Text

32

Botón de Back en un Appbar en Flutter

33

Navegación entre pantallas en Flutter

34

Widget Text Appbar personalizado en Flutter

35

¡Renovaremos este curso! Te quedan unos días para concluirlo.

36

Widget TextField personalizado en Flutter

37

Creando una Safe Area para una interfaz que tiene un AppBar

38

Widget TextField con iconos en Flutter

39

Retocando el CardView

40

Mostrando imágenes en un CardView

41

Creando un botón de Submit en Flutter

42

Envío de datos de un fórmulario en Flutter

43

Subiendo datos a Firestore de Firebase

44

Formularios en Flutter

Acceso al Hardware con Flutter

45

¡Renovaremos este curso! Te quedan unos días para concluirlo.

46

Acceso a la cámara en Flutter

47

Librerías de acceso a Hardware en Flutter

Firebase Storage en Flutter

48

¡Renovaremos este curso! Te quedan unos días para concluirlo.

49

Qué es y cómo funciona Firebase Storage en Flutter

50

Subiendo una imagen a Firebase Storage desde Flutter

Querys avanzados en Cloud Firestore de Firebase en Flutter

51

¡Renovaremos este curso! Te quedan unos días para concluirlo.

52

Manejo de imágenes en Cloud Firestore

53

Cloud Firestore insertando referencias y arrays en la base de datos

54

Descargar imágenes de Firebase Storage y mostrarlas en Flutter

55

Procesando datos con BLoC Pattern

56

Trayendo datos de Cloud Firestore

57

Persistiendo datos de un usuario logueado

58

Aplicando Filtros en Cloud Firestore

59

¡Renovaremos este curso! Te quedan unos días para concluirlo.

60

Construyendo los Places en la pantalla de Home

61

Mostrando los Places en la pantalla de Home

62

Actualizando datos en tiempo real

63

Manejando la lógica de likes, como botón toggle.

64

Insertando y obteniendo referencias en datos de Firestore.

65

Usando el caché para cargar imágenes más rápido

66

StreamController, sink, add y StreamBuilder

Conclusiones

67

¡Renovaremos este curso! Te quedan unos días para concluirlo.

68

Conclusiones

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso Avanzado de Flutter

Curso Avanzado de Flutter

Anahí Salgado Díaz de la Vega

Anahí Salgado Díaz de la Vega

BLoC + Clean Architecture en Flutter

6/68
Recursos

En la clase anterior vimos que es BLoC, BLoC Pattern y cómo aplicarlo. En esta clase te explicaremos como hacer que el proyecto hable por sí solo de cómo funciona usando BLoC + Clean Architecture.

Debemos recordar que nuestro proyecto debe ser legible para nuestros compañeros de trabajo y cualquier persona que lo lea; un plus a esto el proyecto debe ser entendible por sí solo.

Aportes 43

Preguntas 4

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Habría que evaluar que tan conveniente es exponer tus entidades como lo dice Clean , cuando tu proyecto tenga 30 relaciones por ejemplo. Tendrías 30 carpetas donde cada una representa la entidad que quieres exponer. Sin embargo si usaras solamente bloc , tendrías las mismas carpetas de siempre , lo que en ese caso tendrías muchos archivos correspondientes a las entidades. Creo que es cuestión de evaluar el proyecto , pero de manera general fue un gran video de parte de Ann

Hola a todos, hice un video sobre Flutter + Clean architecture usando GetX como gestor de estado, también tengo otro usando Provider 😃 https://www.youtube.com/watch?v=Qffojk-vjKY

Project onboarding is the process of enrolling resources to the project. The goal is to make sure that everyone involved in the project understands its business objectives and requirements, knows their role and the expected outcome of the project itself.
This way team members can contribute fully to the project, spending less time on trying to figure it out and more actually completing their tasks.
-Fuente

Yo tenia ese sentir en el curso anterior de Flutter que muchos archivos estábamos creando y por como se nos ha venido enseñando sentía un solo desorden pero con este curso mejora sustancialmente. ¡Gracias!

Clean Arquitecture
El enfoque principal de la arquitectura es la separación de las preocupaciones y la escalabilidad. Se compone de cuatro módulos principales: App, Domain, Data, y Device.
By: https://bit.ly/2yw2cui

¡Esta arquitectura es muy TOP! Gracias anncode.

Un concepto tan simple, pero que a largo plazo puede traer beneficios al proyecto y a los equipos. Excelente tener este tipo de conocimientos para aplicarlo en futuros proyectos.

Hay muchas maneras de aplicar una arquitectura limpia, esta es bastante interesante, es orientada a pruebas, lo que viene muy bien sabiendo que muchas empresas trabajan así.

Flutter TDD Clean Architecture - resocoder

Para los que trabajan en Visual Studio Code les recomiendo esta extensión que te permite crear carpetas con Clean Architecture pattern de una.
Flutter Feature Scaffolding
Super recomendado para trabajar ese patrón de forma rápida

Quisiera saber si funciona alguien podría decirme de que trata mi proyecto? 😉

Capas de Clean Architecture

Clean architecture es un conjunto de principios cuya finalidad principal es ocultar los detalles de implementación con respecto a la lógica de la aplicación.

En Clean Architecture, una aplicación se divide en responsabilidades representadas en forma de capas: App, Domain, Data, y Device.
.

Domain

Siendo el corazón de una aplicación, es la capa que es totalmente aislada de cualquier dependencia ajena a la lógica o los datos de negocio.

Esta capa, generalmente es escrita puramente en el leguaje de programación core.
.
En ella, podemos encontrar elementos como:

  • Entities. Reglas de negocio que, siendo particulares de la aplicación, pueden ser compartidas entre otras dependencias de negocio de la aplicación.
  • Usecases. Procesos de la aplicación e inherentes según sea el caso, orquestando el flujo de información a través de la aplicación, conocida como la lógica de la aplicación.
  • Repositories. Clases abstractas que definen funcionalidades y deberán ser implementadas según sea el contexto, permitiendo el concepto de inversión de dependencias.

.

Principio de inversión de dependencias. Son abstracciones de uso donde los adaptadores implementarán reglas de una capa quedando, esta última, aislada para que los adaptadores con el tiempo sean reemplazados.

.

App

Son todos aquellos Frameworks y/o librerías que se suelen utilizar en una aplicación para mostrar o almacenar información siendo, en conjunto, puentes de comunicación entre capas.
.
Emplean el concepto de polimorfismo, usando clases heredadas que implementan la representación de los repositorios, en la capa Domain.
.
Cada página, en la aplicación, define al menos 3 clases: View, Controller, Presenter.

  • View. Representada la UI de la página dependiente de un controlador que administra eventos.
  • Controller. Provee las necesidades inherentes a la vista, el cual implementa los eventos de los Widgets pero sin acceder a los mismos.
  • Presenter. Cada controlador tiene un presentador, el cual comunica los Usecases (mencionados en la capa Domain), el cual mandará información éxito / error.

De manera opcional se tiene:

  • Utilities
  • Constanst
  • Navigator

.

Data

Es la capa más lejana de interactividad cuya responsabilidad es la responsable de retornar información (proveniente de una API, DB local o ambas).

  • Repositories. Donde al igual que la capa Domain, posee abstracciones de casos de usos de transporte de la información DTO.
  • Mappers. Son mapeadores de la información o DAO.

De manera opcional se tiene:

  • Utilities
  • Constans

.

Device

Considerara como la capa más lejana y profunda, cuya comunicación está relacionada con la plataforma de uso y es la responsable de disparar funcionalidades nativas.

.

BLoC en Clean Architecture

Recordando que el objetivo de Clean Architecture es la dependencia donde todas se incorporan aun centro común, llamada Domain, BLoC fungirá como una interfaz mediadora entre una vista - modelo, decidieron lo que ocurrirá entre ambas.
.

Clean Architecture expone las entidades.

Explicas muy bien muchas gracias y se que el producto quedará con calidad.

No me gusto clean

Me gusta esta arquitectura, he usado arquitectura parecida antes!

Excxelente 😃

No se puede ver el episodio 6, se queda cargando o directamente dice que estan actualizando la web.

Excelente explicación, el curso va más allá al explicar sobre arquitectura

Simplemente me encantó como lo explcaste. Esta clase y la anterior.
Súper!

Arquitectura de flutter con BLoC + Clean Architecture

cada vez más claro, manos a la obra.

BLoC+CLEAN

Bloc and clean architecture, una forma de organizar el código para que sea posible compartirlo y entendible dentro del grupo de trabajo

Muy interesante! 😃

Interesante la manera de organizar el código

Que son los places?

Pero que buena forma de organizar el proyecto , esto te da un mejor contexto de lo que hace la aplicación ademas de que aun se sigue separando modular mente.

Genial se nota el cambio encuentra a la organizacion cuando se implementa una arquitetura

Empieza la explicación de BLoC + Clean

Arquitectura BloC
Maneja la estructura de archivos con las entidades dentro de cada carpeta “sin ser expuestas” ej.
`- ui
- user
- place

  • bloc
    -user
    -place
  • repository
    -user
    -place
  • model
    -user
    -place`

Mientras que la arquitectura BLoC + Clean expone las entidades así:
-Place -ui -bloc -repository -model -User -ui -bloc -repository -model

Excelente arquitectura!!

Excelente información, y doy fe de que todos estos patrones de diseño sí se aplican en la vida real en las empresas.

Básicamente y, sintetizando conceptos, lo que hacemos con Clean Arquitechture es darle claridad a nuestro proyecto exponiendo las entidades que lo componen. De esta manera, por ejemplo, un integrante nuevo del equipo de desarrollo puede entender la lógica del negocio que posee nuestra aplicación. 😃 ¡Genial!

Estas dos arquitecturas serian Bloc con superpoderes.

Definitivamente acabando este curso iré al curso de Arquitectura de Software

Hola a todos, alguien tiene conocimientos a cerca de hacer nuestra app responsive?

Si quieren aprender mas acerca de BLoC les recomiendo demasiado este vídeo de Diego Velasquez donde explica a detalle cada aspecto esencial para entender como todo un pro este patron y ademas explica Provider y State management https://youtu.be/QJngeHgHA50

Yo he tomado proyectos de una multinacional de out sourcing y utilizaban clean archiquecture para su proyecto (era un backend con node + express)

Ahora entiendo mucho mas la arquitectura de un proyecto BLoC + Clean Architecture lo mejor que he visto hasta ahora