The right learning curve Web front-end development, no confused

Many of the Web front-end development of interest to students who want to finish school system and complete front-end development courses. However, with advances in Web technology, a growing number of front-end development model and framework continue to emerge, so many front-end development of white students were discouraged, and some even lamented: front-end development is simply a "bottomless pit" ah!

Teaching for many years in the front line of small series, summarizes the common market of technology, students will continue to devote the high-quality content related to the Web front-end development. Today, let's start with the learning curve Web front-end development of it.

In simple terms, Web front-end development of learning content includes the following three components: production, production of mobile end page items, JS framework of the project Web page study. On the basis of this three-part learning content on my Web front-end development of the whole learning curve is divided to five learning phase.

1, set sail: Web page layout stage.

The correct Web front-end development of the learning curve, does not require a trance

The first stage: sail

This should be the first stage all Web front-end white learners must experience. The stage layout and production of the independence of the Web interface, it is possible to design a page using the "block + CSS style" layout mode. In addition, as a front-end designer should also be familiar with the use of Photoshop.

This phase should focus on learning the following courses:

  • Adobe Photoshop
  • HTML Hypertext Markup Language
  • CSS Cascading Style Sheets
  • "Block + CSS" layout pattern

2, sail: page behavior stage.

The correct Web front-end development of the learning curve, does not require a trance

The second stage: sail

Web page design their own face, if we can add some of the effects of the mouse or page animation, the effect of the entire work on the more cool. This behavior requires the system to learn the page. The stage will be in contact with the jQuery framework known, learning JavaScript scripting language native. In order to develop a more consistent effect of commercial applications, you can learn jQuery UI technology, but also more familiar with the way the frame.

The end of the first two stages of learning, you have been able to make a mark on the market the most common page layout mode and the effect. Here, Xiao Bian is strongly recommended to use in the final stage of the learning Visual Studio's. Visual Studio .net can be used to make the project background, here is not to let the students learn .net technology system, but because many companies conduct background development in the use of .net technology, so we can only learn to make front-end Visual Studio at this stage MVC model development and use of methods to make the front page of the way the Web project.

This phase should focus on learning the following courses:

  • jQuery technology
  • JavaScript scripting language
  • jQuery UI
  • Visual Stuido use

Difficulty at this stage is to learn to JavaScript scripting language, I learn the language of the process is divided into three parts:

  • The first part: JavaScript Basics
  • The second part: DOM Document Object Model Development
  • Part III: Object-oriented programming

3, voyage: mobile page design stage.

The correct Web front-end development of the learning curve, does not require a trance

Requires a web front-end data, forwarded small series of private letters "web front-end," auto-reply access to information

The third stage: voyage

In the Web interface has been developed on the basis of proficiency, focus on training techniques and methods used to develop mobile page of this stage. We must first understand the details of new properties and the flexible pouch CSS3 layout pattern given. An important style classes Bootstrap framework has become the focus of the students to learn at this stage, this is the response we need to focus on mastering layout framework. Exclusive to third frame to move the page can be developed several suitable contact at this stage, for example, technology based on jQuery jQuery Mobile, Framework 7, Light 7, are handy mobile terminal technology development.

This phase focused on learning the following courses:

  • CSS 3 technology
  • Flexible pouch layout with media queries
  • Bootstrap framework
  • jQuery Mobile Technology
  • Framework 7 Framework
  • Light 7 frame

4. Advanced: HTML5 API development.

The correct Web front-end development of the learning curve, does not require a trance

Phase IV: Advanced

HTML5 technology is given on the basis of a lot of JavaScript API, feature rich the page, before the effect of making you want to write a lot of code to achieve the script easier to complete. Today HTML5 technology is relatively mature and commonly used API include: audio and vedio media API, Audio Context API, Canvas API, File API, WebStorage API and so on. Many of HTML5 technology are continuing to develop and improve the process, I believe the future will be more practical API added to the HTML5 camp.

This phase focused on learning the following courses:

  • HTML5 new markers and attributes
  • audio and video media API
  • Canvas Canvas technology
  • Scalable Vector Graphics SVG Technology
  • Audio Context API
  • Local File File API
  • HTML5 form validation API
  • WebStorage API
  • ……

5, explore: full stack development.

The correct Web front-end development of the learning curve, does not require a trance

Fifth stage: exploration

In order to better pass data to the background, coupled with the need to develop a full-stack, it appeared on the market many functional framework. The core stage is the stage of front-end development, need to know to build a full-stack development server, it is best to start learning and using a MySQL database design and database MongoDB at this stage.

Requires a web front-end data, forwarded small series of private letters "web front-end," auto-reply access to information

This phase focused on learning the following courses:

  • Node.js framework
  • Ajax Technology
  • ArgularJS framework
  • VUE.js framework

Conclusion

Of course, there are many front-end development of knowledge requires continuous improvement in the learning process, such as JSON, XML, Sass, Less so on. If we can learn some background development of knowledge, technologies such as ASP.net, JSP and Java technology, PHP technology, then your stock of knowledge really is even more powerful. So let us quickly develop a preliminary study plan, added to the Web front-end development colorful world go.

Xiao Bian is an engineer with many years of experience in the development of front-end now turned to the front lecturer job as a teacher here and we share some knowledge of the timing and front-end programming, and for everyone to summarize and organize a complete front-end learning information, the students want to collect and study together with me can add buttoned skirt: 1017226689, really want to help you, thank you.

Guess you like

Origin blog.csdn.net/qq_40163373/article/details/90726953