2.2 KiB
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