MyAlbum is a modern web application for sharing photo albums and individual photos, enriched with location context via Google Maps and AI-powered assistance.
Users can:- Create and share albums
- Upload and browse photos
- View photo locations on Google Maps
- Use an AI assistant to:
- Auto-generate image titles and descriptions
- Suggest friendly comments based on user-provided hints
The system is built using a microservices architecture, designed to be scalable, extensible, and production-ready.
- Core album and photo features are functional
- AI service is live and evolving
- Architecture is stable, but APIs and UI may continue to change
✅ Next focus
- Improving AI-assisted features
- Strengthening CI/CD and deployment reliability
- Enhancing user experience and performance
┌─────────────────────────────┐
│ Web Browser │
│ (React UI) │
└──────────────┬──────────────┘
│ HTTPS
▼
┌─────────────────────────────┐
│ WebSPA.React.Identity │
│ - Serves frontend UI │
│ - Authentication │
│ - Issues JWT tokens │
└──────────────┬──────────────┘
│ JWT
▼
┌───────────────────────────────────────────────────────────────────────────────────────┐
│ Microservices │
│ │
│ ┌────────────────┐ ┌────────────────┐ ┌──────────────────┐ ┌────────────────────────┐ │
│ │ Albums Service │ │ Photos Service │ │ Comments Service | | AI Service | |
| |(C#, .NET Core) | |(C#, .NET Core) | | (C#, .NET Core) | | (Python, FastAPI + LLM)| |
│ └────────────────┘ └────────────────┘ └──────────────────┘ └────────────────────────┘ |
└───────────────────────────────────────────────────────────────────────────────────────┘
WebSPA.React.Identity acts as both:
- The frontend entry point
- The authentication authority
Responsibilities:
- Serves React frontend requests
- Handles user authentication
- Issues JWT tokens
- Acts as a gateway for downstream API calls
All downstream services validate JWT tokens issued by WebSPA.React.Identity.
Each backend service is:
- Independently deployable
- Stateless
- Protected by JWT
- Documented with Swagger / OpenAPI
| Service | Responsibility |
|---|---|
| Albums | Album management |
| Photos | Photo upload, metadata, and location |
| Comments | User comments on photos |
| AI Service | Image description & comment suggestion |
┌──────────────────────────┐
│ React Frontend │
│ (Generate / Suggest UI) │
└────────────┬─────────────┘
│ HTTPS + JWT
▼
┌──────────────────────────┐
│ AI Service API │
│ (FastAPI) │
│ │
│ /image/describe │
│ /comment/suggest │
│ │
└────────────┬─────────────┘
│
▼
┌──────────────────────────┐
│ LLM Provider Layer │
│ (Pluggable Design) │
│ │
│ - OpenAI (current) │
│ - Future providers │
└──────────────────────────┘
Key design goals
- Provider-agnostic LLM layer
- Easy model switching
- Clean separation between API, prompts, and providers
The AI service enhances user experience by automating repetitive and creative tasks:
- Image description
- Auto-generate title and description from image content
- Comment suggestion
- Generate friendly comments based on user hints (positive or negative)
- Extensible architecture
- Designed to support multiple LLM providers in the future
- URL:
- https://my-album.azurewebsites.net/ (Angular 8.0)
- https://my-album-react.azurewebsites.net/ (React 16.12) (Inactive)
- Email: guest@gmail.com (for add/edit photo, album, comment and reply)
- Password: 2u)TAa
- Albums API: https://my-album-album-api.azurewebsites.net/swagger/index.html
- Photos API: https://my-album-photo-api.azurewebsites.net/swagger/index.html
- Comments API: https://my-album-comment-api.azurewebsites.net/swagger/index.html
- AI Service API: https://my-album-ai.azurewebsites.net/docs (Inactive)
- React
- TypeScript
- .NET Core + SignalR + Entity Framework (Albums, Photos, Comments)
- FastAPI (AI Service)
- OpenAI (current provider)
- Pluggable provider design
- Azure App Service
- GitHub Actions (CI/CD)
MyAlbum now supports a Scheduled Photo Ingestion feature that automatically retrieves photos from external photo providers (like Pexels) based on configured categories and criteria. A scheduler enqueues ingestion tasks daily, a message queue buffers tasks, and a background worker retrieves and stores photos into the MyAlbum database without duplication. This enables automated enrichment of MyAlbum content and decouples scraping logic from the core API.
+------------------+ +----------------------+ +------------------+
| Dagster | | Azure Service Bus | | C# Worker |
| (Scheduler/ | --> | (Task Queue / DLQ) | --> | (.NET, Queue |
| Orchestrator) | | | | Processing) |
+------------------+ +----------------------+ +------------------+
│ │
▼ │
┌───────────────────────┐ │
│ WebSPA.React.Identity | │
│ (Generate JWT Token) | │
└───────────────────────┘ │
│ JWT
▼
┌──────────────────────┐
│ Microservices │
│ │
│ ┌──────────────────┐ │
│ │ Photos Service | |
| | (C#, .NET Core) | |
│ └──────────────────┘ |
└──────────────────────┘
| Component | Technology |
|---|---|
| Scheduling & Orchestration | Python, Dagster |
| Task Queue | Azure Service Bus |
| Worker / Processing | C# (.NET 10) Worker |
| Photo Provider APIs | Pexels (extendable to Flickr, etc.) |
| Photo API | MyAlbum Photo API (ASP.NET Core) |
| Storage | MyAlbum Database |
| Deployment (Dev) | Docker / Docker Compose |
| Deployment (Cloud) | Azure Container Apps / Azure Services |
- Explore photos and albums (Click on the thumbnail to view the video)
- AI features
- Auto-generate image title (after Login and select Edit Photo pencil icon)
- Suggest friendly comments (after Login and add hint to New Comment textbox)
- Auto-generate image title (after Login and select Edit Photo pencil icon)
Thanks to everyone who has supported this project through ideas, feedback, and testing ❤️