Po długich 3 miesiącach debat i badań dotyczących wyboru między React (z Redux) a Angular 2, zespół front-end w mojej firmie zdecydował się na Angular 2 (biorąc pod uwagę, że jest on bardziej odpowiedni dla naszego problemu).
Zajmujemy się biznesem aplikacji korporacyjnych, który obecnie składa się z wielu różnych technologii front-end (mając cały RESTful całego zaplecza), i chcieliśmy to wszystko wymienić i mieć jedną technologię, aby ułatwić przyszłe szkolenia i kontrolę jakości.
Biorąc pod uwagę naturę naszego produktu, jest on rozległy i są w nim moduły, które same w sobie są inną domeną i mogą być tworzone jako samodzielna aplikacja, ale sam produkt żyje pod jednym adresem URL.
Przykład;
Nazwijmy mój produkt jako SuperApp.
Jako interfejs użytkownika SuperApp ma standardowy system logowania i nawigację do podrzędnych modułów / podproduktów, dzięki czemu przepływ pracy wygląda następująco.
SuperApp
- Uwierzytelnij użytkownika
- Zapomnij kreatora hasła
- Strona publiczna dostępna bez autoryzacji
Uwierzytelniony użytkownik
System nawigacyjny
- Dom
- Podprodukt 1
- Podprodukt 2
- Podprodukt 3
Profil
...
...
Grupy
...
...
- Dom
Zauważ, że w powyższej reprezentacji Sub-product1i Sub-product2są to dwa zupełnie różne obszary, mające zupełnie różne domeny biznesowe.
Mogę teraz myśleć o tym, że mogę utworzyć SuperApp jako pojedynczy projekt Angular 2, zawierający tylko komponenty i widoki, które są istotne dla siebie, a SuperApp jest również odpowiedzialny za ładowanie wielu aplikacji potomnych; Sub-product1, Sub-product2(ponownie, różne projekty Angular 2, posiadające własne package.json, webpackconfig itp.) za pomocą głupich komponentów i działają jak powłoka zapewniająca routing najwyższego poziomu i symbol zastępczy do przechowywania tych aplikacji potomnych.
Po Sub-product1załadowaniu do powłoki dołącza własne trasy do bieżącej trasy, na którą wylądowała SuperApp.
Powodem, dla którego chcę rozdzielić, jest to, że te różne aplikacje (które są obecnie budowane przy użyciu ExtJS) mają dedykowane zespoły pracujące nad nim (jesteśmy firmą posiadającą ponad 500 programistów), więc jeśli mają własne projekty Angular, mogą zarządzać narzędziami i zależności do ich upodobań bez polegania na aplikacji dziadka.
Ale nie jestem w stanie znaleźć nigdzie w oficjalnych dokumentach Angular ani w Internecie, czy zagnieżdżanie aplikacji Angular jest w ogóle możliwe (w taki sposób, że kod frameworku jest współdzielony, a zależności aplikacji potomnych są całkowicie izolowane i ładowane tylko wtedy, gdy aplikacja potrzebuje tego) lub czy istnieje alternatywne podejście do rozwiązania takiego problemu.
Wszelkie wskazówki, a nawet linki do odpowiednich artykułów będą mile widziane.
Odpowiedzi:
Co opisujesz, wiem przez moduł therm. Odnoszę się więc do tego.
Nie zamierzam zajmować się pytaniem, czy moduły wsparcia kątowego z powodu braku wiedzy o frameworku. Ponadto moim zdaniem tak naprawdę tego nie chcesz. W moim rozumieniu i oczekuję, że twój backend odzwierciedla, chcesz pokroić wszystko na najmniejsze możliwe bity ( mikrousług ).
W takim przypadku każda kropka na diagramie powinna być własną niezależną aplikacją. Z pewnością muszą się one ze sobą komunikować, zgodnie z obowiązkami każdego z nich, aby przedstawić opisany pogląd. Widziałeś, jak Google ma oddzielny adres URL / narzędzie / system do autoryzacji? Gmail nie przejmuje się tym, ponieważ to nie jest jego odpowiedzialność. Nawet szkicowanie wszystkich narzędzi ma kluczowe znaczenie, zamiast być zlokalizowanym w każdym narzędziu (widać to na materiałowym projekcie). Aktywa działają poza każdym projektem / systemem.
W ten sposób uzyskujesz wyższą dźwignię wielokrotnego użytku i elastyczność swoich systemów. Chociaż w małych zespołach nie jest to możliwe ze względu na złożoność i czas. Teraz Twoim zadaniem jest dowiedzieć się, gdzie leży twoja sprawa. Wszystko w mikrousługach i separacji, wszystko w jednym opakowaniu lub gdzieś pośrodku. A moduły, jeśli są dostępne, są czymś, czego można użyć w każdej kropce.
źródło
Jedna opcja: możesz „na stałe połączyć” (zamiast używać linków SPA) do podaplikacji i sprawić, by każda podaplikacja dzieliła zależność od opakowania witryny.
źródło