孤立的Javascript组件开发 [英] Isolated Javascript Component Development

问题描述

我即将开始一个非常大的Javascript / Typescript驱动的Web UI项目。



将有100个屏幕构成许多工作流程。



我正在寻找有关如何在大型团队中管理这些内容的指导环境。



例如，第一阶段是创建基本组件工具包，其中包含所需的锅炉板功能，如多语言，RTL和LTR支持以及内部CSS基本项目的规则，如文本框，复选框，列表等



我希望这个组件框架独立存在，因为它是自己的项目。然后我想从这个项目输出一个资源供其他团队使用，就像你分享.Net组件库一样。



下一级开发将是设计每个工作流程和它的形式，我想再次与应用程序的其余部分隔离。然后我想从这些项目获得类似的输出，这将由负责整合整个应用程序的集成团队使用。



我们将编写编码用于测试每个工作流程的UI测试。这也是每个项目孤立工作的驱动因素，因为这是我想要执行第一阶段集成测试的级别。



所有这一切都很容易用于Visual Studio for ASP.Net，其中输出是一个编译的.Net程序集。



但是我很难为一个纯粹的JS项目找到一个好方法。



一个提议的解决方案，我开始看看React.js和JSX语法？对此有什么想法吗？



你能想到哪些其他方法或模式可以提高这个项目的可维护性和可管理性？

Hi,

I'm about to embark on a very large Javascript/Typescript driven Web UI project.

There are going to be 100s of screens making up many workflows.

I'm looking for guidance on how this can be managed within a large team environment.

For instance, phase one is to create the basic component tool kit with the required boiler plate features such as multi-language, RTL and LTR support and internal CSS rules for basic items such as text boxes, check boxes, lists e.t.c.

I want this component framework to exist in isolation as it's own project. I then want to output from this project a resource to be used by the other teams in the same way you'd share .Net component library.

The next level of development will be to design each of the workflows and it's forms which again I want done in isolation from the rest of the application. I then want a similar output from these project which will be used by an integration team who will be responsible for putting together the overall application.

We will then be writing coded UI testing to test each work flow. This is also a driving factor for each project to work in isolation as this is the level at which I want to perform our first stage integration testing.

All of this is easy to do with Visual Studio for ASP.Net where the output is a compiled .Net assembly.

But I'm struggling to find a good way to do this for a pure JS project.

One proposed solutions which I'm starting to look at is React.js and JSX syntax? Any thoughts on this?

Any other approaches or patterns you can think of which would improve the maintainability and manageability of this project?

推荐答案

我工作的地方有同样的问题。有一个'组件'框架，用于其他Web应用程序。由其他开发团队。



为了创建组件，您将有几个选项。 React绝对是其中之一。

我也看了Polymer，它允许你创建web组件。



对我们来说，我们决定淘汰赛定制组件。但这主要是因为我们的后端选择是在顶层使用带有oData webapi的Entity Framework。我们使用Breeze.js与这个后端进行通信。 Breeze对淘汰赛有很好的支持。



所有组件都公开了一个viewModel，它用于渲染组件并提供双向数据绑定。





要分发和共享组件，我们实际上只使用NuGet包装系统。通过正确的配置，它可以轻松共享javascript库。

Where I work we have the same issue. There is a 'component' framework, which is used in other web applications. By other development teams.

For creating the components you'll have several options. React is definitly one of them.
I've also looked at Polymer which allows you to create webcomponents.

For us we settled on knockout custom components. But this was mainly because our back-end choice was to use Entity Framework with an oData webapi on top. We use Breeze.js to communicate with this back-end. And Breeze has excellent support for knockout.

All the components expose a viewModel, which is used to render the component and provide 2 way data binding.


To distribute and share the components we actually just use the NuGet packaging system. With right kind of configuration it can share javascript libraries with ease.

这篇关于孤立的Javascript组件开发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！