Act as IT Architect, DevOps and Developer.


Zadanie: Stwórz szkielet aplikacji na podstawie poniżej architektury usług mikroserwisowych.


Nazwa aplikacji: Time Tracker

Wymagania Docker:
Do uruchomienia lokalnie wykorzystaj docker-compose.
Nie twórz docker-compose dla produkcji.
Zadbaj o konfigurację lokalnych wolumenów.
Pliki Dockerfile mają być przygotowane zarówno do lokalnego developmentu, jak i produkcyjnego deploymentu (użyj Multi Stage Builds).
Zastosuj kompatybilność obrazów Docker --platform=linux/amd64 dla Proxy, Backend i Frontend.
Nie umieszczaj serwera proxy (Nginx ani Apache) w żadnej usłudze poza PROXY.
Ma istnieć tylko jeden serwer.
Ustal stałe nazwy kontenerów.

Wymagania aplikacji:
Wykorzystaj znane skrypty do generowania szkieletów aplikacji.
Nie twórz żadnych funkcjonalności - otrzymasz je w następnym kroku.

Rules:
Zacznij od szkieletu aplikacji, następnie utwórz konfigurację Dockera.
Najpierw opracuj plan - napisz, co, jak i dlaczego chcesz zrobić.
Utrzymuj jak najprostszą strukturę katalogów, nie twórz katalogu pośredniego.
Stwórz dokumentację w pliku readme.md
-

Proxy:
Serwer: Nginx
Nie zmieniaj adresów URL do backendu.

Backend:
Język: TypeScript
Framework: NestJS
Port: 3010
Przygotuj możliwość połączenia się z usługą Bazy danych.


Frontend:
Język: TypeScript
Framework: React, React Router, Redux
Port: 3000
UI: Material UI (v7)
Serwer Proxy: NIE
W środowisku deweloperskim uwzględnij konfigurację dla hot-reloading aplikacji React.

Baza danych:
Silnik: MongoDB
Port: 27017

Act as Developer.

Zadanie: 
Na podstawie stworzonej architektury, dokumentacji @README.md i obecnego kodu bazowego opracuj funkcjonalności opisane poniżej.

Rules:
Odczytaj dokumentację aplikacji: @README.md 
Najpierw przygotuj zmiany w API Backend, a następnie w aplikacji Frontend.
Konfigurację ENV utrzymuj bezpośrednio w docker-compose.yml
Przed instalacją pakietów sprawdzaj, czy nie są już zainstalowane.
Po wprowadzeniu zmian zaktualizuj dokumentację w pliku readme.md.
W dokumentacji w szczególności uwzględnij schematy adresów URL (Frontend i Backend).
Wydziel interfejsy do osobnych plików w specjalnym katalogu z interfejsami. Odczytaj potrzebne interfejsy.
We frontendzie zastosuj podział komponentów na odpowiednie podkatalogi w /src/components/ zgodnie z ich funkcją / przeznaczeniem.
Pamiętaj, że korzystamy z mongodb więc pole identyfikatora to zazwyczaj: “_id”, a nie “id”.
Używaj “class-validator” oraz “class-transformer” w kontrolerach i zawsze zmieniaj w zwracanych danych pole klucza jako “id” (NIE “_id”) w postaci stringu.
Pamiętaj, ze frontend robimy zgodnie z Material UI (v7).
Aby sprawdzić aktualną wersję API Backendu odwiedź stronę: http://localhost/api/docs-json
Korzystaj z RTK Query + custom hook + route param. 
Twórz własne hooki do odpytywania danych.
Pamiętaj o aktualizacji dokumentacji API dla Swagger’a.
Twórz w backendzie moduły dla osobnych funkcjonalności.
Twórz funkcje pobierające dane w service’ach i używaj ich między modułami, zamiast pobierać dane bezpośrednio z modeli.
Pamiętaj o validacji danych po stronie API, nie tylko na froncie.

* Logowanie użytkowników
Model: User
Użytkownicy mają być podzieleni na 2 role: “user” (Zwykły użytkownik) oraz “admin” (Administrator).
Użytkownicy nie mogą się sami rejestrować. 
Loginem użytkownika jest jego adres e-mail.
Administrator może dodawać i edytować użytkowników.
Administrator może zmienić status użytkownika z “active” na “inactive”.
Zwykły użytkownik może przeglądać profile innych użytkowników. 
Wykorzystaj mechanizm cookies to zapisywania tokenu autoryzacyjnego.
Przygotuj skrypt tworzący pierwotnego administratora podczas inicjalizacji aplikacji.

* Profil użytkownika
Każdy użytkownik może po zalogowaniu wejść w swój profil i edytować imię, nazwisko oraz stanowisko.

Act as Designer and Frontend Developer.

Zadanie: Dokonaj zmian wizualnych, UI, UX w interfejsie aplikacji zgodnie z poniższym opisem.

Rules:
* Stosuj Material UI (v7)
* Jeśli potrzebna jest edycja API backendu to zatrzymaj działanie i napisz, jaki endpoint jest potrzebny.
* Jeśli masz problem z API backendu sprawdź najpierw dokumentację pod adresem: http://localhost/api/docs-json
* Wygląd interfejsu powinien być minimalistyczny
* Korzystaj z RTK Query + custom hook + route param.