This example shows how you can configure the DasardControl component in a React application.
The following properties specify the currently displayed dasard and designer availability:
In addition, the onBeforeRender event handler registers the extension that enables Text Editor functionality.
See the following file for implementation details:
The example uses a client-server architecture. The server (backend) project communicates with the client (frontend) application that includes all the necessary styles, scripts and HTML templates. Note that the script version on the client must match the version of libraries on the server.
- The asp-net-core-server folder contains the backend project built with ASP.NET Core.
- The dasard-react-app folder contains the client application built with React.
In the asp-net-core-server folder, run the following command:
dotnet run
The server starts at http://localhost:5000 and the client gets data from http://localhost:5000/api/dasard. To debug the server, run the asp-net-core-server application in Visual Studio and change the client's endpoint property according to the listening port: https://localhost:44371/api/dasard.
See the following section for information on how to install NuGet packages from the DevExpress NuGet feed: Install DevExpress Controls Using NuGet Packages.
This server allows CORS requests from all origins with any scheme (http or https). This default configuration is insecure: any website can make cross-origin requests to the app. We recommend that you specify the client application's URL to prohibit other clients from accessing sensitive information stored on the server. Learn more: Cross-Origin Resource Sharing (CORS)
In the dasard-react-app folder, run the following commands:
npm install
npm run dev
pen your browser and navigate to the URL specified in the command output to see the result.
- Create a React Dasard Application
- Dasard Component for React
- Install DevExpress Controls Using NuGet Packages
- Dasard Component for Angular - Configuration
- Dasard Component for Vue - Configuration
- Get Started - Client-Side Dasard Application (React)
- ASP.NET Core 3.1 backend for Web Dasard
(you will be redirected to DevExpress.com to submit your response)