Web front-end development learning route

First, Confessions

I like the development of the front-end when I graduated from the university, I think it is a very interesting thing to combine the rational thinking of writing code with the creative thinking of visual aesthetic. After the study of the first admission, did a service number of the project, the JS and CSS layout into the door, the second half of the semester with the laboratory and 301 Hospital Cooperation, did an Internet medical platform, the entire product development process, the front and back of the interaction has some understanding. In the first half of the second semester to China Mobile internship, work rhythm is finally slower than the laboratory, there is time to self-study angularjs, and used in the mobile development of the data analysis platform.

Busy projects make me feel full, but also easy to burn, no time to look up the road. Now stop to examine themselves, found that although done some things, the foundation of their own js/css is not solid, each time to adjust the bug can not find a clue, some layout or logical implementation is only a general idea, specific to the grammatical or ambiguous, do not know. The thought of finding a job is getting closer and sweaty. I decided to re-tamp down my JavaScript and CSS fundamentals, combining the JavaScript advanced programming, the best-of-class video in the classroom, concrete examples and projects to get through what you learned before next April, and to understand some of the vague concepts. So write a general study plan here, hoping to be able to organize a series of "JS elevation" Learning notes in the blog Park next April, and build your own CSS work warehouse and JS code base on GitHub, is a summary of their own graduate harvest.

second, time node

• 2015-12-13
  

2. JS Elevation: Review the 23rd Chapter offline application and Client storage
4. Wonderful lesson: Watch Video Cookies
6. Example: Write a Javacript quiz application to achieve the following functions
   • Add client data validation: Ensure that the user answers the current question before entering the next question.
   • Add a "Back" button that allows the user to return to the modified answer. You can return up to the first question. Note For questions that the user has answered, the Select button to display is selected. This eliminates the need for users to re-answer questions they have already answered.
   • Add animations with jquery (fade out the current issue, fade into the next question)
   • In IE8 and IE9 test, modify the bug, here should have you busy. ;D
   • Export the problem to a JSON file
   • Add user authentication, allow user to log in, save user authentication information in 本地存储 (local STORAGE,HTML5 browser store).
   • Use cookies to remember users and show "Welcome back" when users log in again 用户名 .

• 2015-12-31
  

1. JS Elevation: Review the 5th Chapter reference type, learn the 6th chapter Object-oriented program design, the 7th Chapter function expression, 24th Chapter best Practice. Understand the concepts of prototype chains, closures, etc.
2. Wonderful classroom: Watch video Object-oriented 1-5, function declaration and expression, closure, object reference.
3. Example: Using bootstrap to optimize the UI, using Angularjs refactoring code to construct a single page application.

• 2016-1-20

1. JS Elevation: Review the 8th Chapter BOM, the 10th chapter DOM, the 11th chapter DOM expands, the 13th chapter event.
2. Wonderful classroom: Watch the video BOM, Dom1-2, event 1-3, DOM optimization, event Delegation (Web page).
3. Example: video instance

• 2016-1-31

1. JS Elevation: Learn the 21st Chapter Ajax, learn regular expressions, learn to use various front-end tools, solve iframe and cross-domain issues
   
2. Wonderful classroom: Watch video ajax1-2, regular Expressions 1-2, Firebug tool usage, IFRAME, cross-domain issues
3. Example: Record user scores for questions and answers, showing how users rank compared to other users in the quiz app.

• After the New Year

1. Encapsulate your own JS library
2. Achieve a variety of front end effects
3. Prepare for the interview, do the front-end test (miao, Niu Ke net,), solve the algorithm problem (see good taste video fast sorting, enumeration algorithm)

Iii. Summary

Remember the last time you made a plan see JavaScript advanced Programming This book seems to be the time for the new year. Writing out a plan will have a sense of accomplishment that you've already completed, but if you don't, it's just a waste of time. Only 4 months left, give yourself a chance.

Web front-end development learning route