As a front-end developer, I recommend 18 wheels that I use in my work. These wheels can greatly speed up your development efficiency.

In real Chinese IT companies, the development time for you is always so tight that sometimes IT is difficult to complete the task even if you work overtime. So there’s less time to build your own wheel, more time to understand the business and develop the business. So I’m going to introduce you to the wheels THAT I’ve used a lot in my work in recent years.

React UI component library

React is used for the development of small and medium-sized projects in the company. In large factories, React is basically used. Here is a simple recommendation for the React component library.

  • Ant Design: Well-documented, community friendly, available on mobile and PC. Can be used to quickly create a library of UI components for mobile/background/internal applications.

    Ant Design of React

  • React Bootstrap I’ve been using it since the days of JQuery and now React Bootstrap. While the UI design isn’t great, it’s enough to get a quick personal project done.

    Address: the react – the bootstrap

  • Mui: A React component library that implements Google’s new Material Design language. There are over 50,000 stars on Github, one of the most popular React component libraries.

    Url: s

Vue UI component library

Most of our company’s projects and my own projects are developed using Vue. At present, most of the company’s front-end development uses Vue framework, so a good Vue UI component library must be recommended. And Vue is the most popular front-end framework in the country.

  • Element: the most popular Vue UI component library in China, complete documentation, support under Vue3 use. Element also offers elder-React and Elder-Angular versions. This means that you have a UI that you can use in a major front-end framework, but if you only have a UI component library, that’s the right thing to do.

    Address: ElementUi

  • Vant: An open source component library for mobile development. The components are complete, easy to use, and the UI design is beautiful. Vant also provides a framework for appellate applications to use.

    Address: Vant

  • View UI: I just got in touch with Vue development and use. UI component library used in the first project. UI design is very beautiful, with free version and professional version (that is, paid version). But out of the paid version after the use of little.

The animation library

If you want to make a good page, animation effects must be indispensable. Animation plug-ins must be recommended.

  • Animate. CSS is a pure CSS animation library, so no matter what framework you use, it is very easy to use it, built-in animation effects, and very easy to preview.

    Address: Aanimate. Style

Common effect components

Some UI component libraries are introduced. Component libraries are large and complete, but sometimes the level of refinement is not enough, so sometimes we need some small and refined proprietary components.

  • Swiper: The rotation map component provides too many effects, Complete Chinese documents, and communication QQ group. Support native, JQuery, Vue, React, Angular, any front-end development scenario. There’s also PC and mobile.

    Address: Swiper

  • Mescroll.js: a scrolling plugin that often causes problems with mobile scrolling, such as poor flow and latency. I also tried to use a lot of great scrolling plugins, so I chose this one. It is based on H5, does not rely on other front-end frameworks, is less intrusive, very useful. If you run into problems with scrolling, you can use this plugin to solve them.

    Address: Mescroll

Tool wheel

Development in addition to the production of the interface, but also need some tool class wheels, I will introduce the development of some tool class wheels.

  • Lodash.js is a consistent, modular, high-performance JavaScript utility library. This library can be used in native JS, React and Vue. For almost any function you develop, this library will be written for you. All you need to do is use it skillfully and properly.

    Address: Lodash

  • Day.js: A minimalist JavaScript library that validates, manipulates, and displays dates and times for you.

    Address: Day

  • Echarts: Data Visualization: All of our company’s data visualization plug-ins use this component library for enterprise-level development. This is one of the best visual development component libraries in the country.

    Address: every

  • Editor: As a programmer, writing documents in Markdown format is a must, so if you are developing applications and websites for programmers, be sure to support Markdown functionality. I went through a lot of holes in the Markdown editor selection process before I finally found one that worked.

    Address: Editor

  • Validator.js: This is a component that I think most people have used, because validation is a must for both the client side and the management side of the front end, whether it is a company or an individual. I use this validation plugin all the time.

    Address: Validatorjs

  • Vue-draggable: The VUE draggable component, which is used in most applications that need to have a mobile end, is becoming more and more popular. It is the best VUE based draggable component I have seen so far.

    Address: vue – draggable

  • Vue-qr: VUE generates two-dimensional code, if you need to generate two-dimensional code, with this component is absolutely right, the company’s project has been used, can easily and quickly generate any form of two-dimensional code. Includes color and custom styles.

    Address: vue – qr

  • Vue-cropper: Vue image clipping No matter how you develop any app, you need to upload your image. But in order to maintain the consistency of the page, so it is necessary to upload pictures, install design specifications, crop. This is where you can use the component.

    Address: vue – cropper

  • Vue-lazyload is already available in many UI component libraries, but it will be mentioned separately because it does not conflict with other VUE component libraries and has more features.

    Address: vue – the lazyload

  • Vue-simple-upload: Vue upload component. Upload is one of our development requirements, so you must have a fully functional upload component. It works very well, but the downside is that it doesn’t have an official website, just a Github address.

    Address: vue – the lazyload

There are a lot of common wheels out there, but these are the top 18 that I use most in my work. If you have a good front wheel, please leave it in the comments. If I come across any useful component libraries and wheels in the future, I will keep updating them here.

The last

The company has some positions of recruitment, 10 in the morning and 7 in the evening/double leave/full payment of five insurances and one housing fund. Have a look if you are interested.