Współdzielenie stanu i narzędzi między aplikacjami zdalnymi
Poznaj zaawansowane wzorce bezpiecznego współdzielenia między federowanymi aplikacjami zdalnymi nie tylko bibliotek, lecz także magazynów stanu, tokenów projektowych i modułów narzędziowych.
Współdzielenie stanu i narzędzi między aplikacjami zdalnymi to bezpłatna lekcja Micro Frontends Architecture with Module Federation na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Micro Frontends Architecture with Module Federation, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Micro Frontends Architecture with Module Federation zawiera 4 lekcji w sumie.
Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.
Beyond Libraries
Module Federation can share more than third-party libraries. You can expose your own stateful stores, utilities, and design tokens so all remotes use one consistent source.
Sharing a Utility Module
Expose a shared utilities package from one app and consume it everywhere, eliminating copy-pasted helper code.
exposes: { "./format": "./src/utils/format" }
// elsewhere
import { formatPrice } from "shared/format";Sharing Design Tokens
Expose colors, spacing, and typography as a shared module so every micro frontend stays visually consistent without bundling its own copy of the theme.
exposes: { "./tokens": "./src/theme/tokens" }Sharing a State Store
A shared store (e.g. a Redux or Zustand instance) lets remotes read and update common data. The key is sharing a single instance, not separate copies.
Why Singleton Matters for State
If two remotes each load their own store, their state diverges. Marking the store package singleton: true guarantees they share the same live instance.
shared: {
"@app/store": { singleton: true }
}Exposing the Store Instance
Expose the already-created store, not a factory, so consumers attach to the same object.
import { createStore } from "./store";
export const store = createStore();
// exposes: { "./store": "./src/store-instance" }Consuming Shared State
Remotes import the shared store and subscribe to it like any local store, but updates from any remote are visible to all.
import { store } from "shell/store";
store.subscribe(() => render(store.getState()));The Coupling Trade-off
Shared mutable state increases coupling. Overuse recreates the tight dependencies micro frontends try to avoid. Share state only for truly cross-cutting concerns like auth or cart.
Prefer Events for Loose Coupling
Where possible, prefer a shared event channel over a shared mutable store. Events keep remotes decoupled while still letting them react to each other.
Versioning Shared State Contracts
Treat the shape of shared state and utilities as a public contract. Changing it is a breaking change, so version it and communicate updates to consuming teams.
A Layered Sharing Strategy
A healthy strategy layers sharing:
- Libraries: share freely (React, etc.)
- Utilities and tokens: share for consistency
- Mutable state: share sparingly and deliberately
Quick Check
Test your advanced sharing knowledge.
Recap
You learned advanced sharing:
- Share utilities and design tokens for consistency
- Share a singleton store for cross-cutting state
- Expose the instance, not a factory
- Prefer events to limit coupling
- Version shared contracts carefully
Thoughtful sharing balances consistency with independence.
Często zadawane pytania
Czy lekcja „Współdzielenie stanu i narzędzi między aplikacjami zdalnymi” jest bezpłatna?
Tak — pełny tekst „Współdzielenie stanu i narzędzi między aplikacjami zdalnymi” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Micro Frontends Architecture with Module Federation, przejdź na CoddyKit PRO. Kurs Micro Frontends Architecture with Module Federation zawiera 4 lekcji w sumie.
Co nauczysz się w „Współdzielenie stanu i narzędzi między aplikacjami zdalnymi”?
Poznaj zaawansowane wzorce bezpiecznego współdzielenia między federowanymi aplikacjami zdalnymi nie tylko bibliotek, lecz także magazynów stanu, tokenów projektowych i modułów narzędziowych. Ćwiczysz Micro Frontends Architecture with Module Federation z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Micro Frontends Architecture with Module Federation?
Nie wymagamy żadnego doświadczenia. Micro Frontends Architecture with Module Federation w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.
Ile czasu zajmuje lekcja „Współdzielenie stanu i narzędzi między aplikacjami zdalnymi”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Micro Frontends Architecture with Module Federation?
Tak. Każda lekcja Micro Frontends Architecture with Module Federation zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Korzystanie ze współdzielonych zależności
- Moduły Singleton i wersjonowanie
- Dynamiczne ładowanie modułów
- Współdzielenie stanu i narzędzi między aplikacjami zdalnymi