devextreme-datasource

Configure DevExtreme DataSource and store types for UI components.

39|7|Updated Jun 2, 2026
One-click install
npx skills add https://github.com/DevExpress/agent-skills --skill devextreme-datasource
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: devextreme-datasource
Source: https://github.com/DevExpress/agent-skills/tree/main/plugins/dx-devextreme/skills/devextreme-datasource
Command: npx skills add https://github.com/DevExpress/agent-skills --skill devextreme-datasource

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Developers often struggle with correct DevExtreme data layer configuration, leading to broken data binding, silent failures in editing and selection, and AI-generated code with incorrect API usage or missing guardrails for data operations.

Core Features & Use Cases

  • Full Store Configuration Support: Guides setup of ArrayStore, LocalStore, ODataStore, and CustomStore for all DevExtreme UI components.
  • Dual Processing Mode Guidance: Covers client-side and server-side data processing for paging, sorting, filtering, grouping, and CRUD operations, with framework-specific examples for Angular, React, Vue, and jQuery.
  • Common Pitfall Prevention: Enforces critical rules like mandatory key field assignment, correct loadMode selection, and proper Promise returns for store functions to avoid silent failures.
  • Use Case: For example, use this skill to implement a CustomStore that loads editable DataGrid data from a REST API, with proper error handling and byKey support for lookup columns.

Quick Start

Use the devextreme-datasource skill to configure a CustomStore that loads and edits DataGrid data from your REST API endpoint with proper error handling.

Frequently Asked Questions about devextreme-datasource

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I configure a DevExtreme CustomStore for DataGrid data binding to a REST API?

Configure a DevExtreme CustomStore for DataGrid by defining load, update, and insert functions that return Promises. Ensure you implement byKey support for lookup columns and assign a mandatory key field to prevent silent failures during editing.

Why does my DevExtreme DataGrid fail silently during editing and selection operations?

DevExtreme DataGrid editing and selection fail silently when the underlying store configuration is missing a mandatory key field. Assigning the key property in your ArrayStore, CustomStore, or ODataStore ensures proper row tracking and CRUD execution.

What is the difference between client-side and server-side loadMode for DevExtreme data processing?

DevExtreme loadMode controls where paging, sorting, and filtering occur. Client-side loadMode processes all raw data locally in the browser, while server-side loadMode delegates these heavy operations to the backend via remote parameters.

Does DevExtreme DataSource support ODataStore configuration for Angular and React applications?

Yes, DevExtreme DataSource fully supports ODataStore configuration across Angular, React, Vue, and jQuery. This allows seamless server-side data processing, remote filtering, and CRUD operations within your chosen JavaScript framework.

How to fix incorrect DevExtreme data layer configuration causing broken API responses?

Fix broken DevExtreme data layer configurations by ensuring all CustomStore functions properly return Promises and verifying correct API usage. Enforce appropriate loadMode selection and key assignment to resolve incorrect data binding.

What are the limitations of using ArrayStore and LocalStore for DevExtreme client-side data processing?

ArrayStore and LocalStore are limited to client-side data processing, meaning all paging, sorting, and filtering execute locally in the browser. They are not suitable for large datasets requiring remote server-side operations or remote CRUD execution.