|
1 | | -# ASP.NET Core |
| 1 | +# ASP.NET Core DevExtreme Example |
2 | 2 |
|
3 | | -## Installation |
| 3 | +For more information about this example check the [Readme](../README.md). |
4 | 4 |
|
5 | | -Download the example and use Visual Studio 2019 to open the project. |
| 5 | +## Build and Run |
6 | 6 |
|
7 | | -## Client-side resources and bundling |
| 7 | +Prerequisites: .NET 8 SDK, Node.js (for npm/gulp resource bundling). |
8 | 8 |
|
9 | | -This project uses [NPM](https://www.npmjs.com/) and [Gulp.js](https://gulpjs.com/) to install client-side libraries. The project restores NPM packages before the first build. Then, Gulp bundles required scripts and CSS files into the resulting package during the first and every next build. |
| 9 | +Restore and build: |
| 10 | +```sh |
| 11 | +dotnet restore |
| 12 | +dotnet build |
| 13 | +``` |
10 | 14 |
|
11 | | -The resulted bundles will be located in the `wwwroot` folder: |
12 | | -* `css/vendor.css` - a file with all CSS styles. |
13 | | -* `css/icons` and `css/fonts` - folders that contain fonts and icons for DevExtreme themes. |
14 | | -* `js/vendor.js` - a file that contains all scripts. |
| 15 | +Run (HTTPS on 5001, HTTP on 5000 by default): |
| 16 | +```sh |
| 17 | +dotnet run |
| 18 | +``` |
15 | 19 |
|
16 | | -The default bundle includes jQuery, Bootstrap, and DevExtreme. |
17 | | - |
18 | | -### Add more 3rd-party libraries for additional features/components |
19 | | - |
20 | | -The main logic is located in the the `gulpfile.js` file at the root application level. The file contains two tasks: |
21 | | - |
22 | | -* the `add-resouces` task |
23 | | - |
24 | | - * copies JavaScript files located in the `scripts` array and adds them to `vendor.js`. The script bundle is moved to `wwwroot\scripts`. |
25 | | - * copies CSS styles located in the `styles` array and merges them into the `styles.css` bundle. Then, this bundle is moved to `wwwroot\styles` |
26 | | - * copies DevExtreme `fonts` and `icons` folders from NPM to `wwwroot\styles` |
27 | | - |
28 | | -* the `clean` task removes all previously created files (`vendor.js` and `vendor.css`) and folders (`icons` and `fonts`) |
29 | | - |
30 | | -If you need to include more features, you can uncomment one of the following sections: |
31 | | - |
32 | | -* Gantt - scripts and styles for [dxGantt](https://js.devexpress.com/DevExtreme/Guide/UI_Components/Gantt/Getting_Started_with_Gantt/). |
33 | | -* Diagram - scripts and styles for [dxDiagram](https://js.devexpress.com/DevExtreme/Guide/UI_Components/Diagram/Getting_Started_with_Diagram/). |
34 | | -* Export - scripts and styles for the exporting feature: [Export Data to Excel](https://js.devexpress.com/DevExtreme/Guide/UI_Components/DataGrid/Getting_Started_with_DataGrid/#Export_Data). |
35 | | -* HtmlEditor - scripts and styles for [dxHtmlEditor](https://js.devexpress.com/DevExtreme/Guide/UI_Components/HtmlEditor/Overview/). |
36 | | -* Full Bundle - scripts and styles for all above mentioned features/components. |
37 | | - |
38 | | -## Code |
39 | | - |
40 | | -Take a look at the following files of this example to see the required code: |
41 | | - |
42 | | -A list of files goes here |
43 | | - |
44 | | -## Development server |
45 | | - |
46 | | -Use the Visual Studio `Run (F5)` command to run the project. |
| 20 | +You can also use Visual Studio: F5 / Ctrl+F5. |
47 | 21 |
|
48 | 22 | ## Further help |
49 | 23 |
|
50 | | -You can learn more about the ASP.NET Core components' syntax in our documentation: [Concepts](https://docs.devexpress.com/AspNetCore/400574/devextreme-based-controls/concepts/razor-syntax) |
51 | | -The client-side API is based on jQuery [jQuery documentation](https://api.jquery.com/) and described in the following topics: |
52 | | -* [Get and Set Properties](https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Get_and_Set_Properties) |
53 | | -* [Call Methods](https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Call_Methods) |
54 | | -* [Get a UI Component Instance](https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Get_a_UI_Component_Instance) |
55 | | - |
56 | | -To get more help on DevExtreme submit an issue in the [Support Center](https://www.devexpress.com/Support/Center/Question/Create) |
57 | | - |
| 24 | +DevExtreme ASP.NET Core Razor syntax: https://docs.devexpress.com/AspNetCore/400574/devextreme-based-controls/concepts/razor-syntax |
| 25 | +Client-side API basics: |
| 26 | +* Get/Set properties: https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Get_and_Set_Properties |
| 27 | +* Call methods: https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Call_Methods |
| 28 | +* Get instance: https://js.devexpress.com/DevExtreme/Guide/jQuery_Components/Component_Configuration_Syntax/#Get_a_UI_Component_Instance |
58 | 29 |
|
| 30 | +To get more help with DevExtreme, submit a ticket through the [Support Center](https://supportcenter.devexpress.com/ticket/create). |
0 commit comments