Opis
Dzisiejszy lab kontynuuje serię związaną z przygotowaniem JavaScriptowego edytora obrazków SVG.
Zadanie
Dzisiejsze zadanie polega na napisaniu programu w TypeScript, który będzie komunikował się z serwerem i ściągał obrazki.
Zadanie jest sztuczne, gdyż prawdopodobnie nie ma sensu ściągać obrazków z opóźnieniem z serwera, ale ma na celu pokazanie jak można zaimplementować takie rozwiązanie.
Po stronie serwerowej należy napisać (najlepiej w fastAPI) prosty serwer, który będzie zwracał obrazki (najlepiej jako JSONy).
Uwagi:
- Raz na jakiś czas (losowo) serwer powinien zwracać błąd np. 500
- Raz na jakiś czas (losowo) serwer powinien zwracać obrazek, który jest zbyt duży (np. 10MB)
- Raz na jakiś czas (losowo) serwer powinien zwracać obrazek, który jest długo generowany (np. 10s), i to nie powinno blokować działania serwera (użyj
async)
Po stronie klienta, należy napisać program, który będzie ściągał obrazki z serwera i wyświetlał je na stronie.
- Program powinien wyświetlać listę “pustych miejsc” na obrazki, które będą się ładowały.
- Początkowo w pustym miejscu powinna się wyświetlać animacja ładowania (np. obracający się spinner)
- Po załadowaniu obrazka, animacja powinna zniknąć, a obrazek powinien się wyświetlić
- Jeśli obrazek nie może zostać załadowany (np. zwrócono błąd 500), to w miejscu obrazka powinien pojawić się komunikat o błędzie i przycisk “Spróbuj ponownie”