Linko
Links: https://www.zhihu.com/question/26582745/answer/86755953
Source: Know
Copyright belongs to the author. Commercial reprint please contact the author for authorization, non-commercial reprint please specify the source.
Basic knowledge
1.
HTML + CSS This part of the recommended online tutorial to learn, while learning to practice.
Then you can imitate some websites to make some pages. After accumulating some experience in practice, we can read one or two books systematically and recommend the Head first HTML and CSS
Chinese version, this book is too thin, I did not take the patience to read. You can weigh it according to the situation.
2, Javascript to learn a lot of content, if there is no other programming language Foundation, it may take some power to learn, suggest to read "Javascript language essence", JS is a very confusing language, this book can help you to distinguish which is the essence of language, which is bad
Meal, for the essence of language, should be in-depth study. The dross part can understand other people write code on line, oneself will not have to try.
With the above basis, you can do a general static Web page design, but for the complex pages still need to learn further.
1, CSS. Must see "Proficient in CSS", after reading this book you should be: Box model, Flow, block,inline, cascade, style priority, and other concepts very well understood. As an exercise, you can look at the book "The Craftsman of CSS", which has a detailed introduction to the topics of title, background, fillet, navigation bar, table, forms, etc.
2, Javascript. The above mentioned content is not enough to make you competent JS programming. Following the basics, further learning includes:
A) framework.
jquery is recommended, easy to use, and a few simple projects can be done with jquery. The learning method is also very simple, according to the product documentation
Several pages on the line, do not have to cover everything, later encountered problems to check the document on the line. The framework can help you block browser differences, allowing you to focus more on the essence of learning with web development. Supplement: You can use
Codecademy Learning Javascript,jquery, the user experience is really good (thanks Tonyouyang).
b) Javascript language paradigm
。 The name may not be appropriate, but I cannot find a concept that describes the two concepts of "object-oriented" and "functional". JavaScript is not exactly an object-oriented language, it's a lot of
Design philosophy has the shadow of a functional programming language, even if you do not object-oriented, it can be fully understood as a functional programming language.
Many of the language features of JavaScript exist because of the features of his functional language. This part of the recommendation is to learn the basic object-oriented theory, the encapsulation, inheritance, polymorphism and other concepts to
Understanding, Wikipedia, Baidu Encyclopedia will be your helper, another recommended "Object oriented
There should be a Chinese version of Javascript. and functional programming I do not understand the system, not much to say, you can Baidu a bit.
c) Javascript language internal mechanism. The following concepts must be clarified: JS
The scope of the variable, the way the variable is passed, the definition of the function environment and the execution environment, the closure, the function of the four methods of invocation (General function, object method, Apply,call), and four ways to call
Under, ' This ' points to who. You'll learn more about this in the language of JavaScript. In addition, you must understand JSON.
d) Dom programming, one of the core skills of this web front-end engineer. Must read the art of Dom programming, and the section on DOM programming in the book High performance Javascript is also very good.
e) Ajax programming, this is another core technology. Ajax recommends searching the Internet for some information, understanding the context of the concept, Baidu Encyclopedia, Wikipedia content is enough. Real programming is easy, and today almost all frameworks have a good encapsulation of Ajax, and programming is not complicated.
f) Understand browser differences. This part includes CSS and JS two parts, browser difference content is many, suggest in practice accumulate. In addition, for the browser rendering mode, DOCTYPE and other content should be systematically studied.
3, HTML5 and CSS3. HTML5 specification has been released on October 28, 2014, Mobile HTML5 and CSS3 have been very widely used, must know.
Step into the first order · Code level:
With this knowledge, for most small sites, you should already be able to write code that works. But to be a more professional front-end, you need to keep working on it. The higher requirements are about four areas: 1) easy to maintain, 2) testable, 3) high performance, 4) low flow (mobile side).
1) easy to maintain. For the page you should understand the ' style ', ' data ', ' behavior ' of the three separate, the corresponding is of course css,html,js. For JS code, you better understand the design patterns, refactoring, MVC and other content.
2) testability.
3) High performance. Must-read "high-performance JavaScript"
4) Low flow rate. Focus on the mobile side more.
5) for the students who want to learn the front-end, especially self-study partners, self-study is not permanent, if there is no fixed force or find a training institution.
Step into the first order · Engineering Level:
Front-end projects also face every aspect of the software lifecycle, first of all code management, and you must learn to use SVN and git. Next is the code construction, now the front-end code building is not a simple compression, need to rely on management, module merging, various compilations, than need to learn to use Grunt, gulp and other front-end building tools.
For the front-end development, the basic content of these, according to their interests and hobbies to choose to learn the following content.
1, interactive design. Big companies still have professionals to do these, but do not understand the front end of the interaction must not be good front end.
2, back end.
It should be said that the former engineer must know at least a back-end language, but if the hobby can also be deep learning, the difficulty is lower than it should be PHP. This part can be divided into page based, based on two kinds of framework.
Large projects are based on frameworks, and it is recommended to understand at least one MVC framework, such as Php ci, Yii, YAF
And so on, the design ideas of the framework are very similar. Now that Nodejs is widely used in large companies, it is recommended that you use the Express Framework on node to do some back-end service opening
Hair
3, Android and iOS development.
Today, the front-end of the field of work has been very extensive, native interface development is essentially the front-end development, a large company is facing the native environment and Web environment page maintenance problems, if the technology can be unified, there will be great value. For students with the ability to learn, should understand the basic process of native development, at least to understand the interface building technology.
From for notes (Wiz)
Front-end Learning route (turn to self-knowledge)
