A team

The UI library was a huge project that would have taken up a lot of my spare time if I was working on it myself, so I thought of forming a team, launched one at Nuggets, and soon had over 20 front ends to join in.

Scrum Agile Model

With so many people joining in, what kind of process management can ensure the effective progress of the project, make them complete tasks on time and schedule, and finally ensure the progress? At this time, I adopted the popular Scrum agile mode to do process management.

Use the TAPD management tool

There are many tools for scrum agile mode management in China, and tapD was chosen after a vote.

Separate roles

If you are going to do a large project, you should have project manager, architect, front end engineer, designer, product, test, etc.

Establish iteration 1

I took on the role of product and project manager myself. As a product, I proposed a simple requirement for Iteration 1, realizing 16 basic components, about one component for each partner participating in open source, which was very easy.

Development of Iteration 1

For a UI library project, the task of iteration 1 is crucial. It is the source of a project, and if the source is not clearly thought out, subsequent iterations will be disastrous. Looking through the pits we’ve climbed, I think iteration 1 development should do a few things:

  • Eslint strategy
  • Make code specifications such that CSS can only adopt BEM naming conventions
  • Unit testing
  • CSS architecture
  • Branch management strategy, how to make multiple people develop, the probability of code conflict is minimal
  • Build UI library official website, you can write component API
  • Do good PR, which is the last step in ensuring code quality

If one of them is not built in advance, we can think of the consequences, such as the CSS architecture is not built in iteration 1 and is not built until iteration X, then all the CSS will have to be rewritten according to the new architecture, which is a huge pit.

Iteration 2

Iteration 2 still requires building some basic components. Let me highlight the development tasks for Iteration 2. In addition to implementing the requirements, the architect focused on the project architecture and did the following:

  • Introduction of a new ESLint policy to make ESLint only detect its own commit code, regardless of other code, to avoid code conflicts.
  • The router is fully command line controlled and imported once, so that no one has to manually add written components to the router
  • Generate a component template from the command line without having to create a new file every time you develop a component

Iteration 2 essentially took a lot of development nonsense and left it to the command line to do it automatically, allowing us to focus on the right things.

Iteration 3

Building on the foundations of the previous two iterations, Iteration 3 simply continued to develop new components in accordance with existing specifications.

Iterative x

The first version of the NPM package is released after iterations of adding and refining components until enough components are implemented in the library to write a full project with the library.

Open Source project address

address

Want to join open source?

The project is still in iteration 3, the preliminary phase. If you want to join open source, add my personal wechat: FCSboy

Or scan code: