Ten setup zniszczy Twój monolit – NX + Micro Frontendy w 2025 🤯

Czyli mamy Settings i mamy Dashboard. Poszło bezproblemowo. No problemo. Dokładnie tak. Tutaj zapewne jakbyśmy weszli sobie teraz w nasz dashboard i Project JSON i sobie poszukamy porta. O, proszę bardzo, jest i port 4201. Czyli NX ogarnął sobie tym jednym servem od razu też nasze dependencje. Czyli jak widać, NX-owy CLI rządzi w jednych dwóch komendach w zasadzie. Po pierwsze postawiliśmy repozytorium, a potem mieliśmy już działający setup dla Micro Frontendowej architektury. A teraz chcielibyśmy zerknąć na to, czym jest NX Graph. No dobra, to odpalamy sobie nasz nowy, nową zakładkę w terminalu i odpalmy Grapha.

I co tu się wydarzy? Nie wiem, choć się domyślam. Dostajemy taką apkę, która jest oczywiście zaserwowana na local hostie. Czyli NX Graph pozwala nam sprawdzić, jak wyglądają zależności w naszym repozytorium. Czyli widzimy tutaj nasze trzy aplikacje Shell, które jest zależne od dashboardów i settingsów. I tu warto wspomnieć, że dashboard nie wie nic o swoim Shellu. Czyli moglibyśmy mieć tych Shellów kilka. Tak to na przykład wygląda u nas, prawda? Dokładnie tak. Niesamowita sprawa. No dobra, ale to tak jakoś wygląda bardzo prosto, to może byśmy coś dodali do naszego setupu. I teraz wygenerujmy sobie jakąś bibliotekę.

K***a, oczywiście, że tak. No dobra, no to idziemy dalej w takim razie. Shell Config w sumie jest fajnym komponentem, więc dodajmy go jeszcze do dashboardu, bo czemu by nie, skoro to jest Config. No i wszystko się share'uje, prawda? No właśnie, to Config jest w końcu. To config możemy używać w kilku różnych miejscach. No i... Proszę bardzo. Proszę bardzo. I wszystko jest. Więc NX Graph jest super fajnym narzędziem, tylko czy naprawdę shell config powinien być zależnością dla dashboarda? No dobra, no to może w takim razie spróbujmy zgłębić temat Module Boundaries. Module Boundaries to jest taki w zasadzie eslintowy plugin od NX-a.

Stąd Taka dependencja powinna być usunięta. No dobra, no to usuwamy. Poszło. I robimy jeszcze raz lint. Ciach. Udało się. Naprawiliśmy nasze repo. Oczywiście ten komponent musi być stworzony w inny sposób, albo musi być zduplowany, albo musi być... I pamiętajcie, Zdublowanie kodu nie jest zawsze tragiczne, prawda? Szczególnie jak mamy takie przypadki, gdzie chcemy mieć niezależność i separację, odpowiedzialność. No dobra, no to w takim razie mamy NX Workspace, mamy Micro Frontendy, mamy Hosty, mamy Remoty, NX Graph, S-Lint.