DOCSEARCHbyAlgolia
Submit Docs

Tango LowCode Builder

repository·main·Indexed 25 days ago

https://github.com/netease/tango

A source code-based low-code builder that leverages AST for real-time code generation, allowing developers to build platforms like dashboard or mobile app builders using standard source code without proprietary DSLs. The ecosystem includes packages such as @music163/tango-core for engine initialization, @music163/tango-designer for the low-code designer, @music163/tango-context for React state management, and a rendering sandbox for isolated component testing.

Tokens
30.4K
Snippets
39
Records
243
Agent score
84%

What's inside Tango

  3. Overview of Tango Low-Code Designer

    main
    Tango is a source-code driven low-code designer framework. It uses an AST (Abstract Syntax Tree) driven engine without proprietary DSLs or protocols, allowing for real-time code generation (source-in, source-out). It is designed to be integrated into low-code platforms or local development tools and provides ready-to-use React components for building designers.

  4. Overview of Tango LowCode Builder

    main

    Tango is a source code-based low-code builder designed to be integrated into low-code platforms or local development tools. It uses source code AST (Abstract Syntax Tree) to provide real-time code generation without a private DSL or protocol, supporting both 'source code in' and 'source code out'.

    Key features include:

    • Real-time code generation via AST.
    • Out-of-the-box React components for building front-end low-code designers.
    • Full TypeScript support with complete type definitions.
    • Proven in production environments (NetEase Cloud Music).

  6. Understand the Tango Config Spec

    main
    The tango-spec package provides the formal specification for the Tango Config format used across the Tango ecosystem. Developers should refer to this specification to ensure their configuration objects adhere to the required structure for Tango-based applications and tools.

  7. Run the Tango designer playground locally

    main

    Follow these steps to clone the repository, install dependencies, and start the designer example application:

    1. Clone the repository
    2. Enter the project root
    3. Install dependencies
    4. Start the designer example
    # 下载仓库
git clone https://github.com/NetEase/tango.git

# 进入项目根目录
cd tango

# 安装依赖
yarn

# 启动设计器示例
yarn start

  8. Generate local HTTPS certificates with mkcert

    main

    If your local development requires HTTPS, use mkcert to generate signed certificates.

    1. Install mkcert via Homebrew.
    2. Install the local root CA.
    3. Navigate to the apps/playground directory.
    4. Generate a certificate for local.netease.com.
    brew install mkcert

# 将 mkcert 添加到本地根 CA，仅在本地生效
mkcert -install

# 进入 playground 应用目录
cd apps/playground

# 为网站生成一个由 mkcert 签名的证书
mkcert local.netease.com

  12. Set up Tango development environment

    main

    To develop on the Tango repository, ensure your environment meets the following requirements:

    Requirements:

    • Node.js: >= 18
    • Yarn: >= 1.22 && < 2

    Quick Start Steps:

    1. Clone the repository.
    2. Enter the project root.
    3. Install dependencies using yarn.
    4. Start the designer playground app using yarn start.
    # clone the repo
git clone https://github.com/NetEase/tango.git

# enter the project root
cd tango

# install dependencies
yarn

# start the designer playground app
yarn start