3rd-Party Libraries and Frameworks Integration

DevExtreme provides many instruments for mobile and web development. At the same time, it is not a standalone product. It can be combined with other libraries and frameworks in certain tasks. In this article, you will learn about the third-party libraries and frameworks for which DevExtreme is adapted and tested.

Required Libraries

DevExtreme requires jQuery. Currently, jQuery version 2.1 - 2.2 and 3.x is supported.

Certain DevExtreme functionality also requires Globalize library to be referenced if your application should support the following functionality.

  1. Non-English locales
  2. Custom message dictionaries
  3. Non-USD currency formatting
  4. Custom date and number formatting

The currently supported version of Globalize is version 1.x.

To learn more about how to use the globalize library, refer the Localization topic.

You can also load these libraries from a Content Delivery Network (CDN).

<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/cldrjs/0.4.5/cldr.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/cldrjs/0.4.5/cldr/event.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/cldrjs/0.4.5/cldr/supplemental.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/1.1.1/globalize.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/1.1.1/globalize/message.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/1.1.1/globalize/number.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/1.1.1/globalize/currency.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/globalize/1.1.1/globalize/date.js"></script>

Data Binding and SPA Frameworks

When using DevExtreme UI widgets, you may need Knockout or AngularJS for data binding. In addition, you can use AngularJS as an SPA framework and build applications utilizing UI widgets.

Currently, the following versions are supported.

  • Knockout versions 2.2.3 - 2.3.0 and 3.1.0 - 3.4.0

  • AngularJS version 1.2 - 1.5
    When using version 1.3 - 1.5, pay attention to the Migration Guide.

These scripts are accessible within your DevExtreme Package or via CDN.

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-sanitize.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-route.js"></script>

NOTE: When using the DevExtreme SPA Framework to build a single-page application, referencing Knockout is required.

Data Access Libraries

The DevExtreme data layer includes the Store data access interface, which is supported by all DevExtreme UI widgets working with data, such as the List, Gallery, DataGrid widgets, etc. DevExtreme includes several Store implementations out-of-the-box. To consume OData web services, use the ready-to-use ODataStore.

In addition to the ODataStore, we introduced the BreezeJS and JayData extensions, which contain classes accessing data using the BreezeJS and JayData libraries respectively.

Exporting Libraries

The DevExtreme DataGrid widget supports client-side data export - see Client-Side Export. To accomplish this, a reference to the JSZip library is required. This library can be found in the DevExtreme zip archive or in the folder where you have installed DevExtreme, which is C:\Program Files (x86)\DevExpress 16.2\DevExtreme\Sources by default.

Template Engines

DevExtreme widgets are built so that you can provide custom templates for their elements. Along with a built-in template engine that allows you to provide a custom rendering function, DevExtreme enables you to use 3rd-party template engines to customize the appearance of widget elements. The following template engines are supported.

NOTE: Use the latest versions of these template engines.

See Also

Bootstrap Framework

DevExtreme UI widgets can be used in applications built using the Bootstrap framework version 3.3.X.