Frontend development: what you can build with WU

Your code, your interfaces

With WU, you can develop a web application frontend as a set of capabilities that work together. You write components, forms, tables and screens using JavaScript or TypeScript and each app’s framework. WU connects those applications; WU CLI generates the project and prepares the development workflow.

The package includes adapters for React, Vue, Angular, Svelte, Preact, Solid, Lit, Vanilla, Alpine, Qwik, Stencil, HTMX and Stimulus. See their contracts in the adapter reference.

For another technology, register mount and unmount with wu.define, or build an adapter with createWuAdapter. The common contract lets you connect applications using the same framework or different frameworks.

For example, you can maintain a React panel and add an Angular section without rewriting the first one. You can also use React in every app. Useful boundaries follow product capabilities, such as reporting or administration, rather than assigning a different framework to each screen.

The following use cases describe how to organize a product. The links lead to guides and runnable examples you can adapt; the CLI generates a starting point, not a finished store or SaaS product.

Dashboards and SaaS panels

In a dashboard, one app can display reports while another manages a customer or date-range selection. The shell maintains navigation and space for each app. Keep a shared filter in the WU store and let each view observe changes; keep table and form state inside each renderer.

Start with the React and Vue shared counter: it already shows how to read a value, update it from two apps and cancel subscriptions. Replace the counter with your product’s filter and connect each view to your API. Check that unmounting and remounting a view preserves the expected shared value.

Online stores and catalogs

Separate the catalog and cart if they need to evolve independently. The catalog communicates selections through data or events; the cart maintains its own representation. Define product identifiers and quantities as the public contract, without passing catalog components to the cart.

The application communication guide helps you choose between events, state and calls that return a response. Shell architecture explains who controls routes. Your store’s backend must validate prices, stock and orders; shared browser state is not the authority for those operations.

Internal tools and administration portals

An internal portal can bring together inventory, reporting and support in apps maintained by different teams. Use contracts when one app needs to request an operation and receive its result. Agree on input data, errors and version compatibility before connecting provider and consumer.

The sum service between apps teaches requests, responses, validation, timeouts and provider recovery. You can apply that pattern to your product’s operations. User authorization and business validation belong to your application and its backend; WU grants regulate access to its facade.

Migrate an application in stages

Choose a clearly bounded capability, adapt its entry point to the WU lifecycle and preserve the routes users rely on. Test mounting and unmounting before moving another part. If you combine frameworks, see React and Angular and the differences between adapters.

Create your first frontend project

With Node 24 and npm, the initial walkthrough uses these commands. Run creation in a location where the named directory does not yet exist:

npm install --global @wu-framework/cli@1.2.0
wu create mi-plataforma --template react --shell astro
cd mi-plataforma
wu install
wu dev --native --port 3000 --no-open

Open http://127.0.0.1:3000, select mi-plataforma and check that the React counter responds. The complete guide identifies the files you will edit and the result of each step. Then you can add another app or explore the JavaScript and TypeScript templates.

From your first screen to an application you can publish

Before splitting out more apps, complete one capability: interaction, loading, errors, empty states and cleanup. Test the contract from both sides and review navigation, focus and styles. Use the APIs to look up specific signatures and the laboratory to observe execution.

Then follow production to build and review what you will publish. If one team can deliver everything in a coordinated release, a modular app may be enough; when to choose microfrontends explains the cost of splitting it.