> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# YiDA Developer Guide

> The Developer Center for the DingTalk YiDA low-code platform. Build more complex business systems with custom pages, frontend APIs, component libraries, and connectors.

DingTalk YiDA is the low-code development platform of Cloud DingTalk. Beyond foundational capabilities such as forms, workflows, and reports, YiDA offers a more flexible **custom page** development experience: WYSIWYG drag-and-drop development, a rich set of frontend APIs covering the full app lifecycle, direct access to DingTalk JS-APIs, and backend customization through connectors.

<Note>
  If you are new to coding and want to quickly build form, workflow, or report pages, we recommend starting with the [YiDA User Guide](/yida/intro/sbg6g2nsoxacis5y) to explore the core product capabilities.
</Note>

## Learning Path

<Steps>
  <Step title="Get Started" icon="landmark">
    <CardGroup cols={2}>
      <Card title="About the Developer Center" icon="circle-info" href="/open/yida/guide/about">
        Learn about the positioning, target users, and use cases of the Developer Center.
      </Card>

      <Card title="Quickstart" icon="rocket" href="/open/yida/guide/start">
        Create your first custom page from scratch.
      </Card>

      <Card title="Glossary" icon="book" href="/open/yida/guide/keywords">
        Master the core terminology of low-code development.
      </Card>

      <Card title="Designer Overview" icon="palette" href="/open/yida/guide/designer">
        Get familiar with the interface and capabilities of the page designer.
      </Card>
    </CardGroup>
  </Step>

  <Step title="Go Deeper" icon="crown">
    <CardGroup cols={2}>
      <Card title="Core Concepts" icon="lightbulb" href="/open/yida/guide/concept/state">
        Global variables, remote APIs, lifecycle, event handling, conditional and loop rendering, form validation, and more.
      </Card>

      <Card title="API Reference" icon="code" href="/open/yida/api/about">
        YiDA JS-API, cross-app data source, DingTalk JS-API, and Server-side Open API.
      </Card>

      <Card title="Advanced Tutorial: TodoMVC" icon="graduation-cap" href="/open/yida/tutorial/todoMVC">
        Master the end-to-end custom page development workflow through a complete example.
      </Card>

      <Card title="Example Center" icon="flask" href="https://www.aliwork.com/o/coc?from=developers_index_more">
        Try live demos such as custom data management pages and DingTalk Event apps.
      </Card>
    </CardGroup>
  </Step>

  <Step title="Components" icon="cubes">
    <CardGroup cols={2}>
      <Card title="Layout Components" icon="table-columns" href="/open/yida/components/layout/container">
        Container, section container, and tabs.
      </Card>

      <Card title="Basic Components" icon="shapes" href="/open/yida/components/basic/button">
        Button, icon, text, image, link, dialog, drawer, video player, and more.
      </Card>

      <Card title="Form Components" icon="pen-field" href="/open/yida/components/form/numberField">
        Data entry components such as number input, select, multiselect, and dropdown.
      </Card>

      <Card title="Premium Components" icon="wand-magic-sparkles" href="/open/yida/components/advanced/table">
        Spreadsheet, search, pagination, step bar, progress bar, tree control, and more.
      </Card>
    </CardGroup>
  </Step>
</Steps>

## Community and Support

<CardGroup cols={2}>
  <Card title="YiDA User Guide" icon="book-open" href="/yida/intro/sbg6g2nsoxacis5y">
    Core product capabilities and usage guide.
  </Card>

  <Card title="Documentation Contribution Guide" icon="code-pull-request" href="/open/yida/guide/contributing">
    Contribute to the Developer Center documentation.
  </Card>
</CardGroup>