"Reprint" Web front-end Development Learning experience Summary

Original link

Web development is probably divided into the foreground and back end, the foreground can be divided into art, interactive design, JS programming. Backend know not much, the front-end words, can follow the following thinking system learning:

Basic knowledge:

1. html + CSS. This part of the proposal in the WWW.W3SCHOOL.COM.CN study, learning while practicing, each chapter after a small test. Then you can imitate some websites to make some pages. In practice, after accumulating some experience, can read one or two books systematically, recommend "head first HTML and CSS Chinese version", but this book is too thin, I did not take the patience to read.

2. JavaScript. There are a lot of things to learn, if not the basis of other programming languages, it may take some force to learn, or it is recommended to study on the W3school first. After the suggestion immediately read the "JavaScript language essence", JS is a very confusing language, this book can help you to distinguish which is the essence of the language, which is the dross, for the language essence, should be in-depth study. The dross part can understand other people write code on line, oneself will not have to try.

Advanced:


With the above basis, you can do a general static Web page design, but for the complex page also learn further.

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.

Javascript. The above mentioned content is not enough to make you competent JS programming. Following the basics, further learning includes:

The
1. framework. Recommended jquery, easy to use, my first Web project is in W3school simple learning, the direct start of jquery completed, really difficult simple, very useful. However, jquery has a limited environment and is not competent for pages that have high performance requirements. Recommended to learn about YUI or Baidu Tangram, are very useful, learning method is very simple, follow the product documentation to do a few pages on the line, do not 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. The
2. 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, many of its design concepts have the shadow of a functional programming language, even if you do not use object-oriented, it can be fully understood as a functional programming language. Many of the language features of JavaScript exist because he has features that are language-specific. This part of the recommendation to learn the basic object-oriented theory, the package, inheritance, polymorphism and other concepts to understand, Wikipedia, Baidu Encyclopedia will be your helper, in addition to recommend "Object oriented JavaScript", there should be a Chinese version. and functional programming I do not understand the system, not much to say. The internal mechanism of the
3. JavaScript language. The following concepts must be clarified: the scope of the variable in JS, 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, the method of the object, Apply,call), and four ways of invocation, ' this ' points to who. You'll learn more about this in the language of JavaScript. In addition, you must understand JSON.
4. DOM Programming, one of the core skills of this web front-end engineer. Must-read "JavaScript DOM programming Art", plus "high-performance JavaScript" in the book on DOM programming is also very good.
5. Ajax Programming, which 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.
6. to 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.

One more step:

With this knowledge, for most small sites, you should already be able to write code that works. But writing code that can be run is just the primary stage of programming. The higher requirements probably have three aspects: 1 Easy maintenance, 2 can test, 3 high performance, if the page traffic is required, then the fourth is low traffic.

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. JS code testability of the subject, I am studying, welcome interested students contact me, learn together.
3. Performance. Must-read high-performance JavaScript.
4. Low flow. Skill is too strong, non-overnight, not much to say

Add:

For the previous development, the core of the basic part of these, according to their own interests and hobbies to choose to learn the following content.

1. Art. Big companies have professional artists, but if hobbies can also be understood. Recommend the design book for everyone to read.
2. Interactive design. Big companies still have professionals to do this, but if hobbies can be understood. Recommend "Simplicity first".
3. Back end. The former engineer must know at least one back-end language, but if the hobby can also be studied in depth, 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, it is recommended to understand at least one MVC framework, PHP zend,asp.net ASP, and so on too many, good and framework design ideas are similar.
4. Flash I do not have flash as one of the core skills of the front-end project, because I will not, but ActionScript should not be much different from JS, you can learn according to the work. But my principle is can not use, in fact, a lot of effect through JS,CSS can be achieved, completely do not need flash. And with the development of HTML5 Flash will be eliminated sooner or later.
5. HTML5 and CSS3. HTML5 standards have not yet been officially released, but now almost all new browsers have started to support, more so on mobile phones, it is recommended to learn, very good, very powerful.

Front-end development needs to learn a lot of content is miscellaneous. Art, interactive design, flash,js,html+css, backend, any skill, if you learn a special cow, you can guarantee that you have a career. Figured to eat, not a few years even. The key is to choose their own hobbies, in-depth study of a, face to spread, but the depth is more important.

List of recommended bibliography:

• "Head first HTML and CSS Chinese version"
• The essence of JavaScript language
• "Mastering CSS"
• "The Craftsman of CSS art door"
• "Object oriented JavaScript"
• The art of Javascript DOM programming
• "High-performance JavaScript"
• The design book written to everyone
• "Simplicity comes First"

"Reprint" Web front-end Development Learning experience Summary