“Live up to the time, the creation of non-stop, this article is participating in 2021 year-end summary essay competition”

The introduction

Annual essay comes, think about this year or quite substantial, write their own heart this year’s course, gossip. The author is from Sichuan province and works in Wuxi. He is a front-end developer with a college degree. In 2021, he made a small project called Varlet, which is a Vue3 open source component library.

Decided to make a scene

Last year’s life was relatively decadent, and the company the author was working in was relatively idle. Every day to work for a while to write business, off work to amuse the cat for a while, time on the past.

Thinking that such a life is not particularly fun, the author secretly decided to do something meaningful. I had no idea what to do until the company had a component library and embraced Vue3’s vision, and the author was interested enough to do it.

The company doesn’t think the return is good, they don’t want to do it, they do it themselves

After all, component library development is not an overnight thing, plus no experience in this area, no time to see the return, this matter is temporarily shelved (abandoned pit). The author is not a person who gives up halfway, since the company is not willing to provide support, the author will do it by himself, holding what will not learn what attitude, pulled two friends to github to open a repo, do!!

Confusion about open source

As we all know, there is no point in doing something by one’s own enthusiasm. We have no idea about what an open source project should have, so we spent nearly a month to see the implementation of some open source component libraries, to explore their details, to learn their experience. It can be said that most of the open source component libraries you can think of are our teachers, and we have great respect for them.

Ui-related resources are limited

We are an individual, we have no enterprise support, and the three early developers, including me, do not have strong design ability. The UI component library has strong requirements for visual effects and interactive experience. What should we do? To dig the details! .

Because our component library is based on the Design specification of Material Design, we found all the Design resources we could find within our ability, and referred to the existing implementation of the community, and slowly explored what effect is the most appropriate, how many pixels should be here, how many other libraries, Are the values of other libraries and API design suitable for us? What kind of API do we domestic developers like to see most?

We worked out each component in this way, which took a lot of time and energy, but at this time, the lack of corporate support became our advantage, because no one urged us to go online. It’s stupid, but it works.

Of course, there are arguments over minor issues

There is no one in the world who has the same idea. If you can’t decide something, you have to argue. After the quarrel, you are still good brothers

Officially open source

After more than half a year of development, our component library has become a “small sparrow, all the five organs”, we decided to open source it officially, so that more interested students can participate in it, so as to make more friends and broaden their horizon. It also attracts more contributors to add to the component library, both good things.

This is the first time that the author started to contribute in Nuggets, sharing some of the component library development experience, so that interested students can also understand some of the component library construction knowledge, details can see this article, how to develop an open source component library from 0 to 1

Ruan Yifeng technology weekly recommended

Holding the attitude of trying, our members of the small partner ran to ruan Yifeng teacher’s technology weekly warehouse brush existence. Every open source author likes to feel a sense of presence, and most of the time a new open source project is begging others to use its own stuff. Students who have no concept of open source may not understand this feeling. This is actually a desire to share, when you put in the effort to do something, you want to be recognized by others. Fortunately, we were selected into Ruan Yifeng technology weekly, which is the first time we harvest joy because of open source. Because we all grew up reading Teacher Ruan Yifeng’s ES6 books.

Tech Enthusiast Weekly (Issue 156) : Graphics card shortages and competition

Ruan teacher’s influence is very powerful, because of this weekly, we went through the 0-100star stage, we are very happy, even happy cloud a wave of milk tea.

Job changes

The author experienced a job change here, and I have to say that the open source project also contributed a lot to this job change. Although the STAR was only over 300 points at that time, it was obvious that a large number of enterprises were very interested in this project. The author is a developer with a college degree, but many enterprises are willing to make an exception for this open source project, which is also unexpected for the author, which is also a positive significance. The author is also very grateful, after all, eating is also a very important thing.

Foreign technical community recognition

Our component library was designed with an international API from the beginning, and we wrote relatively good Documentation in English (though mostly through translation software and our own corrections), which attracted the interest of some foreign developers. I remember it was on a weekend afternoon that a young man in the group found traffic from abroad when he was reading data statistics and then read this article.

It was a never-before experience, and the article even said that our component library was Vuetify for mobile, which was a huge compliment, as detailed here. The best new Vue 3 UI libraries of 2021

Antfu accepted PR

Antfu is a full-time developer on the Vite core team, working on the Vite ecosystem, and is the author of unplugin-Vue-Components. Unplugin-vue-components is a plug-in that enables components and instructions to be registered free and automatically imported on demand, and can be used across build tools. It is the preferred solution for on-demand component library introduction in the future.

I tried to incorporate first-party parser support for our component library into this plugin. We didn’t think it would be merged. At that time, our library was only 200 or 300 star, which was not a famous enterprise project, but a small transparent in small transparent. To my surprise, Antfu did not care about these things, and directly merged my PR (later Antfu assigned us the corresponding code control permissions, and we could even modify our parser directly without committing through PR). Since then, our component library has become smoother and more free to use this plug-in. Here we can also see the open source spirit of the Vue team, which is very tolerant of new libraries.

First exposure to VSCode plug-in development

We all know that Vue3 and Volar can be a very comfortable development experience, and solving some problems at the IDE level is the trend. This is the first time for the author to contact the development of VSCode plug-in. Although the function of the final implementation looks very cerebral palsy, which is just a quick document search and the code implementation is very simple, it does solve a lot of problems and significantly improves the development experience, which is also worthy of further research.

Yu Yu Creek’s recommendation

This should be the happiest thing for the author this year, but also quite unexpected. In this year’s Vue JS Live, UVU shared the current ecology and future outlook of Vue3, which is equivalent to the 2021 annual summary of Vue3. We were flattered and encouraged that our component library was featured in the speeches of the University. This conference is available both at home and abroad, but the video is not easy to find, the foreign video is on YouTube, and the domestic video is in the early chat.

conclusion

2021 is a year of continuous work for me. It is the closest year to my idol (hahaha, I am a big fan of UVU and Vue). I have made a lot of friends and gained a lot of knowledge. I hope that I can further grow in 2022. I will concentrate on technology, stay true to my original aspiration and do not be impetuous. For our support, we can click a STAR for our warehouse, and relevant links are in the following.

Links to related

Varlet repository Varlet documents