咖啡仓库仪表盘应用
Coffee Warehouse示例应用程序将 React UI组件(如数据网格、图表、调度程序等)展示到一个单一的仪表板中。它的开发遵循的原则和质量标准与你为产品开发应用时使用的相同,所以你一定要看一看源代码,因为你可能会学到一些东西。
如何运行Demo
无论您是在寻找如何在应用程序中使用 KendoReact 的例子,还是为您自己的仪表板寻找起点,请前往现场咖啡仓库React应用.你可以找到 应用程序的源代码在GitHub上.
要使用演示并查看它是如何构建的,你可能需要在本地运行它:
- 克隆或从GitHub下载源代码。
- 通过安装所需的 依赖项
npm 安装——保存
. - 使用
npm 开始
或纱线开始
命令启动应用程序。 - 开放
http://localhost:3000
,在浏览器中查看。
关于应用程序
这个应用程序是创建 遵循最好的 实践 与 KendoReact 组件的构建,并有一个干净的结构,这使它成为一个极好的学习资源。 您可以看到设置数据网格(表)、图表、调度程序或 表单等复杂组件是多么容易。您还将找到处理 组件之间连接的示例。例如,如何根据按钮选择设置图表类型,或者如何 在全局用户设置中保存新上传的头像。
造型KendoReact组件轻松
为了使样式化尽可能简单,你可以使用这个React UI组件库自带的KendoReact Themes。 在这个演示中,我们使用 KendoReact默认主题对于 ,让我们的组件 脱颖而出,看起来很棒。
有关如何向项目中添加主题的更多信息,请参阅 上的文章在React项目中使用KendoReact主题.
如果你对更多的造型感兴趣,如何添加自定义样式KendoReact组件与Sass是另一个有用的资源。
更容易与你的设计师合作
为了使设计人员和开发人员之间能够顺利和无问题的协作,我们创建了Figma的三个UI套件.这些套件为您的设计人员提供与您使用的KendoReact UI组件相匹配的资产。匹配双方的构建模块——设计和开发——保证了设计的顺利实施。
全球观众申请
全球化是一个将组件消息的翻译(本地化)与它们对特定文化的适应(国际化)结合起来的过程。在这个演示应用程序中,我们想展示 全球化是如何与 我们的 UI 组件一起开箱即用的。 使用右上角的语言下拉菜单查看效果。