Thought map of front-end knowledge system



Hello everyone, I’m “the wind doesn’t know the way”. This article is to share,The author learned the knowledge in self-study front-end and summarized the thought map(not including all the knowledge points at the front end), many of them are thought maps that summarize in combination with their own notes;

This article is suitable for people: for those who are learning the front-end by themselves, you can refer to the technologies that the front-end needs to learn, or the brothers and sisters who have learned, and you can review the interview and review knowledge points in combination with the mind map;

To view the source file: in the GitHub warehouse that has been uploaded, I have also uploaded it to gitee warehouse for my friends who visit GitHub slowly. If it is helpful to you, give it to star ⭐ Encourage me~

Front end three swordsman


HTMLandCSSThey are friendly to beginners and learn some labels andCSSAttributes will be effective soon. After feedback, you will be more motivated to continue learning,HTML5andCSS3Many useful features have been added, which is relatively easy to learn;

Mobile web

It is still necessary to learn many adaptive layouts of the mobile terminal. You will find that it is not too cool than the floating + positioning layout. In addition to many adaptation schemes, the mobile terminal is more troublesome. In addition, the layout is better than the floating + positioning layoutPCThe end is much easier;

JavaScript Foundation

JavaScriptGrammar is not difficult. If you have learned other languages, you can start againjsIt’s easy, butjsThe bizarre features of are gradually accumulated by filling pits with daily projects,jsLibraries are also diverse. There is no so-called learning. It is the same with other languages. The key is thinking. Functional programming thinking, process-oriented, object-oriented and design patterns are vast and unfathomable;


Learn roughly and remember some commonly usedAPIFinally, I will write a rotation chart by hand. Ha ha, I can basically understand a lot of operationsDOMofAPIIt’s too late;

JavaScript advanced & ES6

Many new features of ES6 are used almost every day in actual development, which is very necessary to master;

Mobile web knowledge point supplement


jQueryAlthough it is outdated, the idea of encapsulating code inside can still be used for reference (you can skip it selectively)

JQuery knowledge point distribution

version control


Advanced front end

Front end performance optimization


Node. JS Foundation

Third party modules commonly used by node

Network request


Front end frame