Starry Platform: Code‑In & Code‑Out Low‑Code Solution for Frontend Development and Micro‑Frontend Integration

The article explains how ByteDance’s Starry low‑code platform uses a Code‑In/Code‑Out model to enable flexible component development, break R&D bottlenecks, generate full React projects, and integrate with micro‑frontend architectures like Garfish to support SSR for large‑scale web applications.

ByteDance Web Infra
ByteDance Web Infra
ByteDance Web Infra
Starry Platform: Code‑In & Code‑Out Low‑Code Solution for Frontend Development and Micro‑Frontend Integration

The rapid growth of digital transformation creates a shortage of IT talent, prompting the need for platforms that accelerate application development while reducing costs; Starry is presented as a solution that breaks traditional R&D pipelines by allowing multiple roles to work concurrently on product‑related tasks.

Starry differentiates itself from conventional CMS and DSL‑based visual builders by avoiding the rigidity of template‑bound content and the lock‑in of proprietary DSLs, instead offering a Code‑In approach where developers create well‑encapsulated React components (materials) that are later wrapped with runtime protocols.

Materials are built as standard React components with added property‑control and ref schemas, enabling both attribute configuration and logic definition through a visual editor; state and method exposure is achieved via runtime utilities like useGlobalState and ref, allowing external components to interact with internal component state.

The platform’s “Code‑Out” capability generates complete front‑end projects without exposing DSLs, producing a Modern.js‑based codebase where slots, data, and logic are transformed into JSX, props, and event handlers, respectively, and then integrated into the host application.

To incorporate Starry‑generated pages into the existing Volcano Engine website, a micro‑frontend strategy was adopted; Garfish was evaluated but rejected due to lack of SSR support, leading to a custom integration that leverages React’s routing and server‑side rendering capabilities.

The integration workflow includes downloading the generated bundle, mounting the component via new Function, and rendering it within the host’s routing context; SSR is handled by re‑injecting the component and its CSS on the client side after server rendering.

Future plans emphasize further decoupling of the platform, expanding low‑code capabilities (functions, templates, workflow engines), and offering private‑cloud deployments for enterprises, aiming to empower product and operations teams to build pages independently.

frontendDSLReActmicro-frontendplatformlow-code
ByteDance Web Infra
Written by

ByteDance Web Infra

ByteDance Web Infra team, focused on delivering excellent technical solutions, building an open tech ecosystem, and advancing front-end technology within the company and the industry | The best way to predict the future is to create it

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.