Creating new application | GitHub | CM tutorial - KendoUI edition
Differences from the original version
This document is not a tutorial on KendoUI bridge base application development - check Aurelia KendoUI Bridge to learn more. Similarly this document does not teach you about RequireJS module loader. Instead it will show you how to manually enhance the original Contact Manager tutorial to use KendoUI bridge and render its view using Aurelia KendoUI components, instead of using Bootstrap.
The source code for for the Contact Manager tutorial - KendoUI edition is here, and this article will describe the details of changes applied to the application configuration files.
1. package.json
Add references to as specific versions of jQuery and aurelia-kendoui-bridge
Image 1
2. aurelia.json
Set
"stub: false
in the loader section:
Image 2Add the code
{ "name": "aurelia-kendoui-bridge", "path": "../node_modules/aurelia-kendoui-bridge/dist/amd", "main": "index" }
to the dependencies section
Image 3
Note: the rest of the changes required to change the application rendering are of course specific to Aurelia KendoUI components. Check the following files for details:
contact-list replaced the original bootstrap list with KendoUI panel bar.
app added KendoUI tab strip
new component contact-grid.