Skip to content

Proyecto de información de películas para practicar React y DotNet Core

Notifications You must be signed in to change notification settings

ralvarez83/movi-info

Repository files navigation

Aplicación de aprendizaje Movi-info

En esta aplicación se van incorporando poco a poco todo el aprendizaje que voy adquiriendo sobre:

  • Front
  • Arquitecturas
  • Patrones de diseño
  • Back
  • Pruebas automáticas: Unitarias, Infraestructura y Aceptación

Info:

Front

Las tecnologías utilizadas para la capa de Front son:

  • JavaScript
  • TypeScript
  • React
  • Vite
  • Docker (docker-compose, network, build)
  • NGINX
  • Jest (pruebas de componente)

Back

Las tecnologías utilizadas para la capa de Back son:

  • DotNet Core 8
  • LinQ
  • Docker (docker-compose, network, build)
  • API Rest
  • xUnit con AutoFixture para pruebas Unitarias y de Infraestructura
  • xUnit.Gherkin.Quick para pruebas de Aceptación
  • CRQS con MediatR

La arquitectura que se está implementando es la Hexagonal, una arquitectura limpia que permite reducir el esfuerzo en caso de actualización del framework, entre otras ventajas.

Además se están aplicando los siguientes patrones de diseño:

  • Patrón DDD: siempre acompañando a la arquitectura hexagonal donde primamos el dominio frente a la infraestructura. Organizando el esquema de carpetas desde los términos del dominio y siendo éstos siempre protagonistas.
  • Patrón Repository: para facilitar el cambio de fuente de datos, se inicia con el acceso a la fuente de datos de una API de manera directa, a futuro se hará un Back y habrá que llamar a éste.
  • Patrón Criteria: para mejorar la flexibilidad y minimizar el número de métodos a implementar para filtros y paginados de listados.

Trabajos realizados

Aquí expondré qué cosas he incorporado en el código:

  • HTML Sintáctico
  • CSS3
    • Herencia
    • Modo día/noche
    • Efectos cuando te colocas encima de un elmento del listado
  • Acceso a una API con autenticación (con fetch)
  • Listado de elementos Movile-First (Responsive)
  • Scroll infinito cargando datos desde la API (componente reutilizable)
  • Filtrado de contenidos del listado (componente reutilizable)
  • Footer fijo con la última página cargada y el número total de páginas.
  • Poner bonito el mensaje de "Cargando..."
  • Dar estilos y poblar de información la página de 1 película.
  • Construir un Back de acceso a la información de TheMovieDB
  • Crear el repositorio en el Front y conectarlo con el Back (poner a prueba DDD y la arquitectura hexagonal) :bowtie:
  • Dockerizar Front y Back
  • Conectarlos de manera que pudieran pasar por diferentes entornos sin volver a construir la imagen :bowtie:
  • Publicar la aplicación
  • Pruebas de componente en Front
  • Pruebas unitarias en Back
  • Pruebas de infraestructura en Back
  • Pruebas de aceptación en Back
  • Llamada al repositorio por Inyección de Dependencias
  • Llamada a los casos de uso desde los controladores por Querys con el patrón CQRS
  • Crear una gestión de usuarios
  • El usuario pueda marcar películas favoritas
  • En detalles se va un icono de película favorita
  • En el listado general aparezca un icono cuando es una película favorita
  • Listado / Filtro de películas favoritas
  • Poder sacar una película de favorita

About

Proyecto de información de películas para practicar React y DotNet Core

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published