Shulou(Shulou.com)06/02 Report--

Today, I would like to share with you the basic knowledge and skills that web front-end engineers should master. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article.

1 basic structure of web pages (HTML + CSS)

HTML is a markup language, not a programming language. The most basic thing is that the tags are and, and CSS is used to define how to display HTML elements. It's easy to get started with HTML+CSS, but many people don't go deep enough. Let me give you a few examples: what are tags for? What is the difference between margin-left and left, and under what circumstances should it be used? Another DIV+CSS layout problem: a DIV with uncertain width contains three horizontally aligned DIV, the width of the left and right DIV is fixed to 150px, and the middle DIV is filled with the remaining width. If you don't know these problems yet, and you can't solve that layout problem in a few minutes, you don't know enough about HTML+CSS.

2 how do browsers display web pages

Browsers with different cores render web pages differently. Currently, browsers all have client-side debugging tools. The following figure shows the details of loading a google homepage under IE9:

When doing web performance optimization, you need to know more about browser rendering and details. A more useful knowledge point: the current limit for parallel loading of browsers is 6, and older browsers will be different.

3 the life cycle of the web page

Under different web frameworks, the life cycle of the page will be different, basically the same: the client sends the GET request, the server returns the corresponding page, the client completes the operation and data, and then POST to the server. Be sure to know the details of data transmission (foreground and background, between pages).

4 DHTML DOM BOM Javascript AJAX

This is the top priority of Web front-end development, and we deal with them most of the time. To say a few points: javascript is single-threaded programming, the so-called javascript asynchronous programming only plans to execute the corresponding events at some point in the future; learn more about the DOM event mechanism; client-side storage (localStorage and sessionStorage are added to HTML5); javascript is not as rigorous as the server-side language, debugging is not very convenient, so you should develop a rigorous javascript editing habit at the beginning Javascript is powerful and flexible, so don't fantasize about being proficient (let alone proficient in it) in a short period of time, and write some frameworks and class libraries. In the initial stage, you should start with a proficient framework (such as jquery); be sure to be proficient in using client-side debugging tools.

6 server-side language development experience, PS image cutting technology

Web front-end development is somewhere in the middle of design and development, so you need to know something about both ends. The editing language is the same. I have written a server language before, which is very useful for learning javascript. From pictures to static HTML pages, there is no lack of PS cutting technology.

5 browser compatibility

Due to historical reasons, browser compatibility has always plagued web front-end engineers. Although there is a W3 organization and some specifications have been developed, and although browser manufacturers are trying to improve and approach their specifications, there is a place for various kernels and versions of browsers in the real network environment. Solving browser compatibility depends on experience, and the good news is that there is a lot of information on the Internet. Http://www.w3help.org/zh-cn/ this is a good reference website.

(6) Fast learning ability and willingness to learn actively

With the rapid development of web front-end, it is necessary to have fast learning ability and active learning willingness to engage in this industry, so as to meet the requirements of web products. There is no absolute right or wrong in the web front-end field, there are many ways to solve a problem, but we need to find a more suitable method, to find a more suitable method requires experience to accumulate, in short, the web front-end is easy to start, it is difficult to be proficient, and we need more willingness to take the initiative to learn.

7 good communication skills

Excellent front-end engineers need to have good communication skills, because your work is closely related to the work of many people, such as project managers, designers, end-users, development engineers, front-end engineers are located at the intersection of these types of people. You have to take good care of these roles, balance the needs of these four types of people, and come up with a more appropriate solution. Thus it can be seen that communication skills are more demanding to front-end engineers.

First, the front-end engineer must master HTML, CSS, and JavaScript. It is not enough to know only one or two of them. You must be familiar with all three languages. It's not that you have to be proficient in all three languages, but you should at least be able to use them to accomplish most tasks without having to ask for help frequently.

A good front-end engineer should have the ability to learn quickly. The technology that drives Web is not static, is it? I can even say that these technologies change almost every day, and if you don't have the ability to learn quickly, you won't be able to keep up with the development of Web. You must constantly improve yourself and learn new technologies and models; you cannot adapt to the future by relying solely on today's knowledge. The future of Web will be very different from today, and your job is to figure out how to reflect this earth-shaking change through your own Web application.

Many branches of computer science under this big category are actually nothing more than science in people's eyes. However, the front end we are talking about is not science, but art. Artists should not only master the skills to make a living, but also know how to use them. A solution to the same problem applies in this case and may not in another case. For the front end of Web applications, there are often many solutions to the same problem. No plan is wrong, but some of them are more appropriate. A good front-end engineer should know under what circumstances which solution is more appropriate and when it should be re-selected.

A good front-end engineer needs good communication skills, because your work is closely related to the work of many people. In any case, the front-end engineer must meet at least the needs of the following four types of customers.

Product managers-these are the people responsible for planning applications. They can imagine how to meet the needs of users through applications and how to make money from the patterns they design (hopefully). Generally speaking, these people pursue rich functions.

UI designers-these people are responsible for the visual design and interaction simulation of applications. What they care about is what users are sensitive to, the consistency of interaction, and the overall usefulness. They are keen on smooth and beautiful user interfaces that are not easy to implement.

Project managers-these people are responsible for actually running and maintaining applications. The main focus of project management is uptime (uptime)-- the time, performance, and deadlines when the application is always available. Project managers often pursue the goal of keeping things as simple as possible and not introducing new issues when upgrading and updating.

End users-- the main consumers of the application, of course. Although we don't often deal with end users, their feedback is crucial; applications that no one wants to use are worthless. What end users ask for most are the features that are useful to individuals and the functions of competitive products.

So who should front-end engineers pay the most attention to? The answer is all four types of people. Good front-end engineers must know how to balance the needs and expectations of these four types of people, and then come up with the best solution on that basis. Because the front-end engineers are at the intersection of communicating with these four types of people, the importance of their communication skills is self-evident. If a very cool new feature has to be simplified because it affects front-end performance, how do you explain it to the product manager? For example, suppose that a design that does not change back to the original plan may have a negative impact on the application, how can you convince UI designers? As a front-end engineer, you must understand where each type of person's ideas come from and must be able to come up with solutions that are acceptable to all parties. In a sense, a good front-end engineer is like an ambassador who needs to deal with every day's work with the mentality of a diplomat.

One of the most common words I warn new front-end engineers is not to accept a task without making an evaluation. You must always keep in mind that you must first figure out what other people want you to do, and you can't simply accept general statements like "there's something wrong with this function." Also, you need to know exactly what the real purpose of this feature or design is. Tasks like "add a button" don't always mean you end up with a button. It may also mean that you will go to the product manager and ask what this button is for, and then talk to the UI designer about whether the button is the best way to interact. To be a good front-end engineer, this kind of communication is essential.

These are all the contents of this article entitled "what are the basic knowledge and skills that web front-end engineers should master?" Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.