Top 10 top front-end open source projects! 1534K Star!

Hello, everyone. Today, Brother Mao recommends to you the top 10 front-end open source projects, each of which has a Star of about 100K. What are the open source projects?

I believe many people don’t know it. Today, Brother Cat will take you to find out.

1. freeCodeCamp

• 323 K

FreeCodeCamp is a free and open source learning programming community dedicated to helping people learn programming in their spare time. Its mission is Learn to code and help nonprofits.

FCC covers courses such as HTML5, CSS, React, JavaScript, Database, etc. The degree of gamification is very high. Students can help each other through online chat rooms and offline community activities (Coffee and Code).

Currently covering 160+ countries and 1000+ cities around the world, 40W+ developers are learning on the platform.

For the domestic Chinese version of please see 1607fa34c3dc30 https://freecodecamp.cn (This is the Chinese version translated by domestic enthusiasts)

https://github.com/freeCodeCamp/freeCodeCamp

2. Vue.js

• 182K

Vue.js is a progressive JavaScript framework and the most popular front-end framework.

easy to use

• Already know HTML, CSS, JavaScript? Read the guide now and start building the app!

Flexible

• The ever-booming ecosystem can scale freely between a library and a complete framework.

efficient

• 20kB min+gzip running size
• Super fast virtual DOM
• The most worry-free optimization

https://github.com/vuejs/vue

Vue-related projects can be seen: recommended 7 Vue2, Vue3 source code decryption analysis of open source projects and Vue3 learning tutorial summary, source code explanation project, supported UI component library, high-quality actual combat project , you will find Vue Learn the treasure trove.

3. React

• 167K

A declarative, efficient and flexible JavaScript library for building user interfaces.

Declarative

React makes it easy to create interactive UIs. Design a concise view for each state of your application. React can effectively update and render components correctly when the data changes.

Writing UI declaratively can make your code more reliable and easier to debug.

componentization

Create components with their own states, and then these components form a more complex UI.

Component logic is written in JavaScript instead of templates, so you can easily pass data in the application and separate the state from the DOM.

once, write anywhere

No matter what technology stack you are currently using, you can always introduce React to develop new features without rewriting existing code.

React can also use Node for server rendering, or use React Native develop native mobile applications.

https://github.com/facebook/react

For React-related projects, see: a project revealing the secrets of React technology, and a top-down analysis of React source code .

4. awesome

• 157K

awesome: awesome; awesome; terrible; excellent

Just like we summarize our commonly used computer environment software, we will find some very good software suitable for our use to make a summary. The same is true for the awesome project. Since there are a large number of open source projects on GitHub, developers will summarize them as needed. Some commonly used and easy-to-use resources are divided according to the theme of awesome, and similar resources are also summarized for development languages.

https://github.com/sindresorhus/awesome

5. bootstrap

• 149K

A smooth, intuitive and powerful front-end framework for faster and easier web development.

Use the world's most popular front-end open source toolkit Bootstrap to quickly design and customize responsive mobile-first sites. It has Sass variables and mixins, a responsive grid system, a large number of pre-built components, and powerful JavaScript plug-ins.

https://github.com/twbs/bootstrap

6. You-Dont-Know-JS

• 136K

This project is the YDNJS (You Don't Know JS) book series, including a series of books that explore the core mechanism of the JavaScript language in depth.

Content outline

• Getting started and advanced
• Scope and closure
• this and object prototype
• Type and grammar
• Asynchrony and performance
• ES6 and the future

https://github.com/getify/You-Dont-Know-JS

7. vscode

• 114K

Visual Studio Code is a cross-platform editor that runs on OS X, Windows and Linux, and is aimed at writing modern web and cloud applications.

It is also the most popular editor on the front end today!

https://github.com/microsoft/vscode

8. javascript

• 107K

This project is a JavaScript programming style guide.

Contains: type, object, array, string, function, attribute, variable, promotion, comparison operator & equal sign, block, comment, blank, comma, semicolon, type conversion, naming rule, accessor, constructor , Events, modules, jQuery, ECMAScript 5 compatibility, testing, performance, resources, JavaScript style guide description

https://github.com/airbnb/javascript

9. javascript-algorithms

• 103K

The warehouse contains a variety of algorithms and data structures based on JavaScript.

Each algorithm and data structure has its own README, including related instructions and links for further reading (and YouTube videos).

The data structure includes linked list, doubly linked list, queue, stack, hash table (hash), heap, priority queue, dictionary tree, tree, priority queue, binary search tree, AVL tree, red-black tree, line segment tree, tree Shape array, graph, union search, bloom filter

Algorithm includes algorithm topics and algorithm paradigms.

Algorithm topics include: mathematics, sets, strings, search, sorting, linked lists, trees, graphs, encryption, and machine learning.

Algorithm paradigm: Algorithm paradigm is a general method based on the design of a class of algorithms. This is a higher abstraction than an algorithm, just as an algorithm is a higher abstraction than a computer program.

Algorithm paradigm includes: BF algorithm, greedy method, divide and conquer method, dynamic programming, backtracking method, Branch & Bound, etc.

There are also corresponding instructional videos for this project. There are a total of 81 video explanations. Each video is about 5-10 minutes. You can also learn English😉

youtube instructional video: https://www.youtube.com/playlist?list=PLLXdhg_r2hKA7DPDsunoDZ-Z769jWn4R8

When Brother Mao learned the algorithm before, he also benefited a lot from this project!

And this project has always been maintained and updated! A really good project!

https://github.com/trekhleb/javascript-algorithms

For more algorithm-related project recommendations, please see this article: 7 super-hot front-end learning data structure and algorithm projects on

10. d3

• 96K

Use SVG, Canvas, and HTML to bring data to life.

D3 (or D3.js) is a JavaScript library for visualizing data using web standards. D3 can help you use SVG, Canvas and HTML to bring your data to life. D3 combines powerful visualization and interactive technology with data-driven DOM operation methods to provide you with all the functions of modern browsers and provide you with the freedom to design a correct visual interface for your data.

https://github.com/d3/d3

At last

For how to find a good open source project, you can read this article: GitHub-How to Find a Good Open Source Project

Front-end GitHub focuses on mining excellent front-end open source projects on GitHub, and recommends them in the form of topics. There are about 10 good projects per topic, and one to three elite articles will be pushed every week.

The original link is in the treasure trove below:

https://github.com/FrontEndGitHub/FrontEndGitHub

• The 10 most popular top open source projects on the front end! Soaring 174K Star!
• soared 110K Star! The top 10 top front-end learning resource projects with the most annual growth!
• Recommend 7 open source projects for Vue2, Vue3 source code decryption analysis
• Vue3 learning tutorial summary, source code explanation project, supported UI component library, high-quality actual combat project

Micro-letter search " the front GitHub ", reply " eBook " which can be obtained following 300 this technology essence books Oh, brother cat WX: CB834301747 .

Unconsciously, the original article has been written to the 39 issue. Almost every article is a high-quality open source project carefully selected by Brother Mao. The projects in every article pushed are almost helpful for front-end development. of.

It’s not easy to be original. It takes a few nights for a high-quality article to come out. It takes a lot of time and energy to filter and write the reason for recommendation. After reading the article, the big guys like it or repost it, just treat it. Brother Cat, please encourage me.