DevExtreme Application Template & CLI Tools for React #7698
It can be complex and time-consuming to create a web application that has a responsive layout, navigation, and uniform style.
The Proposed Solution
The new React Application Template is a simple application with a navigation menu and several sample views in a responsive layout.
DevExtreme React Application Template
The application template supports three adaptive layouts that arrange elements in the following way:
We created the media-query utility that defines how the application adapts to different screen sizes. You can change the screen size qualifiers (see the
Navigation & Routing
We implemented the navigation menu based on the DevExtreme TreeView component and used the react-router-dom library for routing.
To modify navigation and routing items, you can use DevExtreme CLI commands (see Add a View section).
The React Application Template uses two DevExtreme themes:
To modify these themes, change their metadata in the
To apply changes, run the following command:
This command uses the metadata to generate
DevExtreme CLI Tools
Add DevExtreme to a React Application
The following command installs the
Create a New DevExtreme React Application
If you do not specify the parameters, CLI dialogs prompts you to specify them.
The following command generates an empty view and adds it to the navigation menu and routing:
Check out the early working prototype
> npm i -g devextreme-cli@next
We Need Your Feedback
Take a Quick Poll
Get Notified of Updates