Files
mmorales.photo/docs/front/frontend-documentation.md
2025-08-04 15:06:25 +02:00

2.2 KiB

Documentación del Frontend

Tecnología Base

  • Framework: Angular 20
  • Lenguaje: TypeScript
  • Estilos: SCSS
  • Gestión de Estado: RxJS (si aplica)
  • Rutas: Angular Router

Estructura del Proyecto

El proyecto estará organizado en módulos y componentes para maximizar la reutilización y la escalabilidad. La estructura inicial será:

src/
  app/
    core/                # Servicios y lógica compartida
    shared/              # Componentes y directivas reutilizables
    features/            # Módulos específicos de características
      home/              # Página principal
      gallery/           # Página de galería
      profile/           # Página de perfil
    app-routing.module.ts
    app.module.ts
  assets/                # Recursos estáticos como imágenes
  environments/          # Configuraciones de entorno

Componentes Principales

Menú de Navegación (MenuComponent)

  • Descripción: Componente para la navegación entre las diferentes secciones de la aplicación.
  • Propiedades:
    • links: Array<{ label: string, route: string }>: Lista de enlaces.
  • Eventos:
    • onLinkClick: Evento emitido al hacer clic en un enlace.

Galería (GalleryComponent)

  • Descripción: Componente para mostrar una colección de imágenes.
  • Propiedades:
    • images: Array<{ src: string, alt: string }>: Lista de imágenes.
  • Eventos:
    • onImageClick: Evento emitido al seleccionar una imagen.

Imagen (ImageComponent)

  • Descripción: Componente para mostrar una imagen individual.
  • Propiedades:
    • src: string: URL de la imagen.
    • alt: string: Texto alternativo.
  • Eventos:
    • onClick: Evento emitido al hacer clic en la imagen.

Pie de Página (FooterComponent)

  • Descripción: Componente para mostrar información adicional en la parte inferior de la página.
  • Propiedades:
    • links: Array<{ label: string, url: string }>: Enlaces a recursos externos.

Página Principal (HomePageComponent)

  • Descripción: Página que combina el menú, la galería y el pie de página.
  • Componentes Hijos:
    • MenuComponent
    • GalleryComponent
    • FooterComponent