With the further development of the Internet, it has become the front-end development engineer on the market very competitive talent. Many students, including former UI, java, or completely zero-based, want to learn the front. The following maps are widely disseminated on the Internet front-end learning map. Many beginners say, when they see these intensive knowledge will feel dizzy. In fact, the front is a broad topic. But you need to learn the front you do not have to panic, though more content, but there is no trace to follow, step by step, as long as the poor are not afraid of learning the tip!
So in the end what front-end developers need to learn it? What should I learn? Next, navigate the teacher to teach you how to learn from zero front-end basis.
First, the introduction of front-end development
In the introduction stage, you must first learn the basic skills: HTML static pages generated based on the draft UI design. This requires you to master the skills HTML, layout, style CSS style pages and so on.
At this stage, you need to learn:
1, HTML + CSS foundation
Master the use of HTML tags, typography, CSS layout, style landscaping and browser compatibility.
2, JavaScript foundation
Master the basic grammar, conditions, statements and loops js, and to enhance the learning algorithm commonly used logic.
three. Common front-end tools
As Webstrom, sublime, Dreamweaver and so on. Grasp the shortcut keys and other technologies, can rapidly improve the efficiency of development and debugging.
This phase of the study is relatively difficult to learn after the finish, we can complete the production of the static pages. Of course, this is just an introduction, if you want to use these skills, it is difficult to find a job.
Two. Front-end development
In the next phase, our goal is to meet the basic requirements of front-end development of the industry, let us have the courage to go out and get a monthly salary of more than 8000 yuan of work.
At this stage it should be noted that the ability of these two aspects:
A development frame using the jQuery, guidance and other complex interactive functions and effects.
2. Use HTML5, CSS3, Mobile Terminal on the canvas.
Taking into account the capacity of the first aspect, you need to learn:
1, the basic effects javascript
It implements the Trojans, drag and drop, a magnifying glass and other common network effects.
2, jQuery base
Master general of the API uses jQuery, and to become familiar with the development of mechanisms jQuery plug-ins.
3, in response to the guide
Master machine response mechanism, use of a grid layout and the layout in response to the boot process, the development of complex page layouts.
4, ajax foundation
Fully understand the principles of Ajax, Ajax native to master the use of ajax and jQuery.
5, UI popular frameworks
Master JQueryUI use, web role is quick and efficient.
Learn these skills, you can create a separate business and business websites, dynamic effects common JS achieve cool effect and complex functions under the guidance of jQuery.
For the second aspect of the mobile terminal development, you need to learn:
New features 1, HTML5 and CSS3
In the mobile terminal, to master the use of HTML5 and CSS3 techniques.
2. Base oil paintings
Canvas master basic drawing API, the canvas is displayed in the application reports and advertising, to achieve display.
three. Mobile Web framework
It may be based on mobile jQuery / Zepto frame on the mobile terminal by the JS.
With these two major skills, you meet the basic requirements of the market front-end engineers. According to market feedback data, wages are generally between eight thousand to thirteen thousand Australian dollars / month.
three. Front-end development steps
I know you're a good person, not satisfied with the main front-end development. Next, take the road of development of advanced, improve their ability. Wages will rise one!
However, if you are a new front end, you may not use or hear some knowledge of the next article. Do not worry, you can first collect the article, then slowly understand.
Well, at this stage, we should concentrate on the following competencies in two areas:
1. At the same time, we consider the elegance of the code, and pay attention to performance and reusability of code.
2. And the ability to develop a deep understanding of the principles and general terminal assembly disposed distal to the distal end of the frame re-implemented.
At this stage, you need to learn the following:
1. Reflections on object-oriented development
2, object-oriented JavaScript
3, javascript closure scope chain, chain prototype advanced features
4. Common design patterns
5. The machine implemented using JavaScript framework principles package
6, jQuery frame package principle
7 The principle, jQuery plug-ins
The principle grasp jQuery plugin, in-depth understanding of two extensions of the implementation mechanism.
8. And modular component-based development: SeaJS, RequireJS
If you have mastered these skills, you have the ability to solve complex problems and technical issues, and be able to independently design and development of complex functional modules. If you reach this level, congratulations, you've met the needs of the middle of the front end of the industry. According to market feedback, the average monthly wage is 13000-20000 yuan.
four. Advanced front-end development
I write to you, even minor edits are very excited, because in the next phase, our goal is to enter the whole stack development engineers! The entire stack is not only front-end development engineers, but also the back-end, you can quickly solve problems and resolve problems quickly. According to statistical data collection in 20k-50k wage development engineer Beijing group of up to 60%, while the talent is very short!
In order to improve the development of a bunch of engineers, we have to do it at this stage:
1. We can understand the principle and mode of popular frameworks from the global perspective of the front end.
2. Further understanding of the models and technology choices for mobile applications.
3, familiar with Node.js full-stack solution;
4. BACKGROUND mainstream understanding and collaborative approach, the entire life cycle from a global perspective to understand the project.
Therefore, you need to learn the following:
1, workflow framework website development: farmers / grunt htoon pavilion.
Grasp the popular front-end workflow tool that allows front-end development more convenient and efficient!
2, MVC / MVVM framework: AngularJS etc.
Grasp the implementation mechanism of front-end MVC / MVVM framework to understand the MVC development model of practice AngularJS and understand the concepts of two-way data binding.
3, HTML5 response frame
4, UI popular frameworks: JQueryUI, EasyUI, ExtJS, etc.
Grasp the principle of common UI framework package, source code analysis, in-depth understanding of the concept of component-based development.
5, ion, an angle
We should grasp the mixed development mode mobile terminal, combined with understanding ions and angle of the whole process and HTML5 and CSS3 JS implementation mechanism.
6, the reaction of nature
Master the development mode of the mobile terminal.
7 HTML5 Plus
8, all stack Node.js development
Node.js grasp the full stack solutions and server-side JS efficient development.
If you can master the knowledge and skills of the four stages, will be able to meet the needs of front-end and advanced mobile development industry.
Create a front-end learning qun438905713, most in the group are zero-based learners, we help each other, answer each other, and also to prepare a lot of learning materials, welcomed the zero-based junior partner to the exchange.
Full stack engineers need to know all the front-end technology, Node.js and HTML5 mobile background technology development technology. Meanwhile, in the course of the design process, to fully take into account most of the students zero base case. It should be the interface between the modules to each other, and gradually upgrade, so that students can better absorb the transition and in the learning process. If you want to learn the front end, if you want to change from a zero-based white into a good front-end developers.
