Web front-Section learning methods

Reprint Please specify source: https://github.com/qiu-deqing/FE-learning

Table of Contents generated with Doctoc

• Fe-learning
  • Basic Skills Required
  • Basic development tools
  • Learning methods and learning goals
  • The way to get started
  • Continue to improve
  • Some personal experiences
    • Lingyucoder's learning Experience
      • Tools
      • Skills
        • Language Basics
        • Advanced
        • Project
        • Future
        • Other
      • Introductory book
      • Some nice websites.
      • Course
    • Mrraindrop's learning Experience
      • Origin
      • Project, next project
      • Collection Addiction and knowledge management
      • With the gods.
      • Reading
      • Positioning of the front end
      • At last
    • Byr Forum Yiyizym's recommendations

Fe-learning

Combined with personal experience to summarize the front-end approach, summarize from zero-based to the basic skills of the front-end road, learning methods, materials. Due to limited capacity, can not guarantee all-encompassing, just as a primer for beginners, so that beginners less detours.

The rapid development of the Internet and fierce competition, the user experience has become an important concern, leading to professional front-end engineers become a hot career, the major companies on the front-end engineers demand is very large, demanding more and more high, excellent front-end engineers are scarce. Personal feeling of the front-end is relatively easy to get started, but also need to systematically study hard, after playing a good foundation to persist in learning, become a good front-end engineer is only a matter of time.

Learning any knowledge of the most important is the interest, if after a period of time to learn to feel not like, it may be forced to study is very painful, the effect will not be good, after all, this is likely to be a lot of years of survival skills. However, with the development of the Internet industry, the front-end is bound to be the Web developers need to learn knowledge, and sometimes no professional front-end engineers to work together, so even if not to do a dedicated front-end engineer, master the basic front-end skills for the work to bring convenience.

Later invited some students to share the learning experience. If there are classmates willing to share, welcome to push

Basic Skills Required

Front-End Skills Summary This project details the knowledge of the front-end engineers involved. After having basic skills, you can find the direction of learning and improve your skills and knowledge.

Frontend-dev-bookmarks is the front-end development resource summarized by the foreigner. The coverage is very wide. including a variety of knowledge points, tools, technology, very comprehensive.

Here are some basic skills that you should be familiar with in the introductory phase:

• HTML4,HTML5 syntax, tags, semantics
• CSS2.1,CSS3 specification, combined with HTML for various layouts, effects
• Ecma-262 defines the language core of JavaScript, native Client javascript,dom operations, HTML5 new features
• A sophisticated client-side JavaScript library that recommends jquery
• A server-side language: If you have server-side development experience, using the language can be, if there is no server-side development experience, familiar with Java can choose Servlet, not familiar with the optional PHP, can achieve simple login registration function enough to support the front-end development, follow-up may need to continue to learn, The basic requirement is to achieve a simple function simulation,
• HTTP

After mastering these basic skills, you can quickly learn the techniques you need to meet your needs at work.

Basic development tools

The right tools can effectively improve learning efficiency, focus on the knowledge itself, in the event of problems can quickly locate and solve problems, the following is a person feel the necessary front-end development tools:

• Text Editor: Recommended sublime text, support a variety of plugins, themes, settings, easy to use
• Browser: Recommended Google Chrome, update fast, the front end of a variety of standards provide very good support
• Debugging tools: Recommended chrome develop tools, you can easily view the DOM structure, style, output debugging information through the console, debug JavaScript, view the network, etc.
• Accessibility: Photoshop edit pictures, take color, fireworks volume size, alloydesigner contrast size, and previous to chrome develop tools,
• FQ tools: Lantern, Gecko Walk

Learning methods and learning goals

Method:

1. The introductory phase reads the Chinese version of the classic book, and every example in the book is implemented in a hands-on and viewing effect in the browser
2. After having a certain foundation, we can search various tutorials and demos on the Internet to understand the practical usage of various functions and how to implement common functions.
3. Reading the Html,css,javascript standard and perfecting the knowledge point comprehensively
4. Read the front-end cattle blogs, articles to promote understanding of knowledge
5. Use search Engines

Goal:

1. Memorize the important concepts of the previous knowledge points and get their own understanding with the learning experience
2. Familiar with the implementation of common features, such as common CSS layout, tab control and so on.

The way to get started

Here are some good books and materials for the entry stage

2. HTML first read "HTML & css:design and Build Websites" 1-9 chapters, then "Html5:the Missing Manual" 1-4 chapters.
4. CSS first See "Css:the Missing Manual", and then "CSS authoritative guide"
6. JavaScript first looks at JavaScript advanced programming, and then the JavaScript authoritative guide
8. HTTP See HTTP Authoritative guide
10. Throughout the learning process, HTML CSS JavaScript will need to be combined with each other, the actual work is the same, a simple function module requires three combinations to achieve.
12. Hands is an important part of learning, books focus on knowledge points, examples may not be very sufficient, it is necessary to use search engines to find some simple tutorials, follow the tutorial to implement the function. Here are some of the better tutorials URLs
    • Can search major companies front-end school recruit written test questions as exercises or others summary of the front-end questions and personal summary of the face test (with the reference answer)
    • Http://code.tutsplus.com has a variety of tutorials
    • MDN also has a lot of tutorials, and more importantly, there are detailed documents that need to find a feature in Google search:xxx site:https://developer.mozilla.org
    • http://www.html5rocks.com/zh/also has a lot of quality tutorials
    • http://www.sitepoint.com/
    • http://alistapart.com/
14. Native JavaScript is a skill that needs to be mastered, and it is recommended to master jquery on the basis of mastering native JavaScript, which is of great use in practical work, with the book "Learning jquery" or the jquery website.
16. Build a https://github.com/account to save the various codes and projects that you normally learn.
18. With a certain foundation can build a personal blog, record the learning process encountered problems and solutions, convenient for their own access to help others. can also go to http://www.cnblogs.com/or http://www.csdn.net/such a website registration account, convenient and practical
20. Often practical Google search English materials should often find high-quality answers from http://stackoverflow.com/, and problems can be directly here to search, if there is energy, register an account for others to solve the problem can also greatly improve personal ability.
22. After you have a classic book, you can open the link to the Basic Skills section above. Read the corresponding standards carefully, master the knowledge comprehensively

Continue to improve

With the foundation of the front, the front-end is basically a primer, this time everyone may have some learning direction in mind, if still not. You can refer to the two items mentioned in the previous Prerequisites section, and choose from inside to develop your studies. Here are some good things to do:

• Grunt: Front-end automation tools for increased productivity
• Less CSS: excellent CSS Preprocessor
• Bootstrap: Excellent CSS framework, good for a team without designers, perfect for use with less
• REQUIREJS:AMD Spec Module Loader, a must-have tool for front-end modularity trends
• Node.js:JavaScript can also do the backstage, the front-end engineer status is a step further
• AngularJS: A good tool to do single Page application
• Mobile Web Development: The popularity of smartphones allows mobile traffic to gradually overtake PC-side
• JavaScript Memory Management: Spa long-running requires attention to memory leak issues
• High Performance JavaScript (Build Faster Web application Interfaces)
• Best practices to speeding up Your Web Site: Important Skills

Some personal experience Lingyucoder learning experience

The great gods above are all summed up, I'm going to have some nonsense here.

Tools

• Chrome Dev Tools: The front-end development debugging tool that focuses on several features:
  • Console (nonsense)
  • Elements: Element style adjustment, very common
  • Sources: Add breakpoints in code, step through debugging, and view in-memory objects while stepping through debugging
    • Watch expression: View current in-memory values through expressions
    • Call stack: View the stack of calls, open async, and look at the asynchronous call stack (this is very useful, especially when it comes to Ajax debugging)
    • Scope variables: Variable on the scope chain, very useful
  • Network: Grab the package to see each request, very important, front-end and pre-union prerequisites
  • Timeline: Analysis rendering, JS execution and so on each stage, performance optimization weapon
  • Emulation: Analog mobile environment, mobile page Development essentials
  • Some plugins:
    • Liveload: Automatically refresh after modifying the page, do not press F5
    • Dimensions: A sharp weapon to measure directly on the page
    • Livestyle:css style modified automatically after the effect, do not need to refresh, elements can also be synchronized to the code after modification
    • Image tool: Measuring, taking color
    • UC QR code: the Mobile debugging code must be scanned
    • Pagespeed,yslow: Page performance analysis and optimization plug-ins
    • Mark Fei Elephant: Excellent online markdown editor, quick write weekly, record
• Sublime Text2: Easy coding, multi-plug, fast speed, good performance
  • Emmet: Increasing HTML Encoding speed prerequisites
  • Sublimelinter + lint and hint in various languages: code correction
  • Some snippets: auto-complete, improve development efficiency
• Intellij idea and Webstorm: integrated development environment, integrated with a variety of functions, development than sublime to be convenient, but will compare eating performance
• Mark men: The first software to be opened after the vision is measured, color-coded and marked with a sharp weapon
• GFW Fucker: I use red apricot, I can buy a virtual server as a ladder
• Ihosts: Very good hosts management software, easy to modify the hosts, development and debugging necessary
• The best clutch analysis tool for the CHARLES:MAC platform
• Rythem:alloyteam produced by the agent grab package software, very light, easy to install, mobile (real machine) development debugging is very useful
• Wunderlist: A very good todo List, it's easy to manage when you need more tasks.

Skills

The front-end skills are a lot more than JavaScript (including Nodejs), HTML, and CSS. In fact, the front-end of the skill tree is very large, here can only be listed in my development to see the said

Language Basics

Javascript:

• Scope chain, closure, run-time context, this
• Prototype chain, inheritance
• Nodejs Basics and Common APIs

Css:

• Selector Selector
• browser compatibility and common hack processing
• The way and principle of CSS layout (box model, BFC, IFC, etc.)
• CSS 3, such as animation, gradient, etc.

Html:

• Semantic tags

Advanced

Javascript:

• Asynchronous control (Promise, ES6 generator, async)
• Modular approach to development (AMD, CMD, KMD, etc.)
• Some knowledge about JavaScript interpreter
  • Asynchronous IO implementations
  • Garbage collection
  • Event queue
• The use of common frame and its principle
  • JQuery: Based on the selector framework, but personally think that can not be called framework, should be counted as a tool library, because there is no module loading mechanism, where the source is very suitable for reading
  • Angularjs/avalon, such as the MVVM Framework: focus on understanding the concept of the MVVM pattern itself and the implementation of two-way binding, how to decouple
  • Underscore: Excellent tool library, easy to understand the implementation of common tool code snippets
  • Polymer/react: Component development, future-oriented, understanding the principles of modular development

CSS and HTML: mainly CSS3 features and HTML5 features, as well as the process and drawing principles of browser processing

• The process of constructing the DOM tree, Cssom tree, rendering tree, and page rendering
• Blocking caused by parsing HTML, CSS, and JavaScript
• HTML5 related
  • SVG and Vector diagram principles
  • Canvas Development and animation principles (frame animation)
  • Video and Audio
• Flex Box Layout method
• Use of icon fonts

Common Nodejs Package:

• Koa
• Express
• Underscore
• Async
• Gulp
• Grunt
• Connect
• Request

Some ideas:

• Responsive web
• Graceful downgrade, progressive enhancement
• Don ' t make me think
• Web accessibility, accessibility, meaning
• SEO Search Engine Optimization, understand the principle of search engine
• The benefits and problems of spa

Performance optimization:

• Reduce the number of requests (Sprite, combo)
• Use cache (application cache, HTTP cache, CDN, Localstorage, Sessionstorage, Memo mode)
• Reduced selector consumption (right-to-left), reduced DOM operations (separation of DOM and JavaScript interpreter)
• Reflow and redraw of CSS

Project

• Versioning: Git is the most used, and git doesn't want to use SVN.
  • Git: A mechanism for local version management
  • SVN: Version management mechanism for remote centers
• Automated builds: Primarily the pre-processing of less, templates, coffee, and compression and merging of code
  • Gulp: Based on flow construction, fast and good module quality
  • Grunt: Standalone task build, slow, configure egg pain, high flexibility
• Preprocessing and templating engines
  • Less: simple syntax, but limited functionality
  • Jade, Ejs, velocity and other template engines, each has its own strengths
  • Coffee:python engineers Love it, I didn't use it.
• Environment: The main is to map the online code to the local, and start a demo server locally, as for the mock data, a matter of opinion
  • Local agent: Ihosts
• Automated testing: In the case of a more stable business, automated testing can be used to reduce the number of test events, but when there is more demand, the cost of maintaining test cases is high and may be reversed with automated testing
  • Jasmine
  • Mocha
• Eco-System
  • Npm
  • Bower
  • Spm
• Build a blog that belongs to you
  • git pages
  • Hexo
  • Jekyll

Future

• Web componets: A future-oriented approach to modular development
  • HTML templates
  • Shadow DOM
  • Custom Elements
  • HTML Import
• Mobile Native development: This is also needed to understand, the front-end engineers will often deal with WebView, but also to understand native development

Other

Some things are not test knock code can be done, I participated in the internship when I feel a lot of these are I met is also I feel I do bad place

• Thinking about the business: I am very deficient in this area, so put it in front of you and think more about business before you hit the code.
• Communication and communication skills: this is very important, front end also need to work with Project manager, product, interaction, backstage, poor communication will lead to a lot of useless, delaying the project
• Knowledge management, TIME management: input and output balance, output is the best input. How to share, participate in the community, communicate well, make good records
• The desire for new technology, and the courage to try

Introductory book

Getting started can be done by eating books, but many of the books are outdated, and while chewing on books, keep an eye on new developments in technology. Here are some of the books I think are good:

• JavaScript Advanced Programming: Can be used as an introductory book, but also a high-level book, can quickly absorb the foundation, wait until the ascension comes back to see again
• JavaScript authoritative guide: Not very suitable for getting started, but necessary, do not understand the place to consult, very helpful
• "Writing maintainable JavaScript" and:
• The node. JS Development Guide: Good Nodejs Introductory books
• "In the Nodejs" node. JS: Advanced Books, essential
• JavaScript Asynchronous Programming: Understanding the programming concept of JS Async
• JavaScript patterns and JavaScript Design patterns: JavaScript code patterns and design patterns that transform development thinking into JavaScript, very good books
• "JavaScript Framework Design": In the use of the wheel at the same time, you should know how the wheel is turned up, the explanation is very detailed, from the source level to explain the framework of the implementation of the various parts, with an existing framework to read, you can learn a lot of things
• Don ' t make me think: the concept of Web design, understanding user behavior, very good
• "CSS Zen Garden": A timeless book that also conveys the idea of web design and the issues that need attention in design
• High-performance JavaScript and high-performance HTML5: A book that emphasizes performance, not just performance optimizations, but also a lot of principles that are worth learning.
• HTML5 Canvas Core Technology: I'm reading a book that is very helpful for the use of canvas, the implementation of animations, and the development of animation frameworks.
• HTTP Authoritative guide: HTTP protocol-related prerequisites, front-end development debugging will often involve the knowledge of the
• Responsive Web Design: Technology itself is not difficult, it is important that the design of responsive web pages, as well as the concept of mobile first
• The best of javascript: sophisticated books and a good book for the development of JavaScript, ideal for getting started

Some nice websites.

• GitHub: Nothing to say, read more people's source code, upload their own source code, to learn from the world's big Daniel
• Codepen: A must-see for the beauty of the front end, with a lot of cool effects and excellent plugins
• Echojs: A quick look at JS new information website
• StackOverflow and Segmentfault: Basically all kinds of problems can be answered above
• Google Web Fundamentals: Each article is suitable for reading carefully
• Static files: An open CDN, very useful
• Iconfont: Ali's vector icon Library, very good, support CDN and Support project
• HTML5 rocks: A good website, a lot of new browser features and cutting-edge technology, can find articles on this
• CSS tricks: How to make the most of CSS, and learn about the new features of CSS, here to meet your
• JavaScript Secret Garden JavaScript beginner must see, very good
• W3cplus: A front-end learning site, the quality of the article is very good
• Node School: A nice node learning site
• Learn git branch: A git learning site with great interaction
• Front-end stew: A front-end article sharing community, with many excellent articles
• Regular Expressions: A regular expression starter tutorial, well worth a look
• Nanyi's blog and Zhang Xin's blog: A quick way to get some knowledge, but if you need to dig deep, you need other resources.
• All the way Daniel's blog: This is too much, do not post, know that there is a very full
• Various specifications of the official website, do not know when to read the specification

Course

Used to do Java ssh, halfway decent do the front end, so the level is weaker, encountered problems are more. Basically get started by reading books and school on the tutorials, as well as some front-end blogs, such as Uncle Tom's blog. Previously also just use jquery, native JS also did not have much study, later gradually read a lot of animal books, such as the sophisticated language essence and so on. From these books learned a lot of language level knowledge. But this is obviously not enough, so I often go to the community to see what people are talking about, then go to see the relevant information, interested will find more information to see, or write a demo. Learning CSS is mainly done in this way. Later began to pay more attention to the blog and some of the more deep books, and focus on some new knowledge and framework, and constantly practiced hand to submit code to GitHub, so that also learned a lot of knowledge. In the process of internship, to participate in the actual project development, can learn a lot of ideas and thinking in school, this also has a great help. No, I'm going to move the bricks and ask for an offer ...

Mrraindrop's learning Experience

Should Qiu God's invitation to share the front-end learning experience, here on the front-end knowledge architecture does not summarize, the great God of the summary has been quite in place, I will contribute to a few individuals think that also more useful links to research and research on the good, Then the main share of my experience in the front-end learning problems and summed up the lessons, if you can help the beginners want to get started (I would like to assume that the reader audience type), let them take a little detour, every step to know their next direction, this is the best. The summary and share of the great God are detailed in the fe-learning of Qiu God.

First of all, the front end of this thing everyone can have a suitable way of learning, this article for reference only, write a little messy, you do look.

Origin

I belong to a mistake into the front-end, has been to do the direction of the game to go to, made the game site, played the game engine, such as unity,unreal this commercial engine, tinkering with a few game prototypes, but since the research into the laboratory, directly by the tutor sent to write JS, The tutor gave me half a month to let me write a data display page based on the Baidu Map API, although this time is still quite well-off, but did not write before JS, and will not use the Map API, so I chewed the "JavaScript authoritative guide" (Rhino book) on the side of the reference lab left Behind " Code ", and finally the function is written out. That page count My JS introduction, is also my front-end learning route start.

Now want to think, although assigned to do the front end, but always do it and do a good job still depends on the interest to maintain, of course, the front end is a fun and full of technical areas, and the community is very "lively" every day.

Project, next project

I personally think that the front-end learning, beginner stage you can completely out of the open books to project-driven. Although I have personally started to chew from the Rhino book, but if you do not have enough time, or feel a lot of tired and tasteless, do not like me. Of course, if you decide to chew a book, it's best to follow the example in the book. I did not contact before the js,4 month before the beginning of the school is directly by the tutor dumped a Baidu Map API project to the face, followed by a variety of ERP, map data display, although changing the pattern to a point not repeating, but basically is the front-end of the live, SSH and Android development has also played soy sauce, The entire lab, I'm the one who writes the front end. Rich Client Spa ERA backend is a restful interface, the code is basically in the front-end ah, write me a person how a good word ... In the course of the teacher felt a business, every day from 7 to 10 o'clock in the evening, but also experienced a period of rapid growth.

Master a technology first grasp its general framework, think of a can realize the idea, do a can run the demo, and then to improve its details, until the demo completed, the technology has a perceptual understanding, and then to eat books, harvest will be much larger. I start from the original JS write to jquery, and then to ExtJS, and then to Angularjs, from the mentor to specify the technology, to do their own technology selection, a project followed by a project to practice, and playing strange upgrade like. Of course, no project to create their own projects, the implementation of their own ideas is a fun and fulfilling things.

Collection Addiction and knowledge management

Front-end learning has a feature, a lot of things are very fragmented, scattered, you need to organize, summarize and summarize. In Weibo, the follow of the Great gods, you are not only to listen to gossip, the words of the great God sometimes leave an endless aftertaste, it is possible that a casual mention of a word will become your next learning goal. Collect this information, use Google, ask questions, think. Just like the collection elements in the game, the front-end learning is a "game" full of collecting elements, but you need a knowledge management tool to act as inventory and warehouse, and I know that Daniel is not a heavy user of knowledge management tools. Previously used OneNote, which was not yet tied to cloud storage, is now largely evernote, with notes accumulating into 1200+. Bookmarks have always been intended to use delicious, because it is based on tag management, but has been useless. Of course the focus is not on these tools, but the tools of the hand can improve your learning efficiency. The key, of course, is to keep a strong learning appetite at all times, and your goal is to know everything about the front end (not all of them, of course, because your energy is limited, and the reality is that it is unlikely).

With the gods.

This controllability seems to be small ... With the boss this is not much to say, to a certain extent, to see the creator. But then again, more with the experts around the king, this master is not necessarily how high, but must be enthusiastic about technology. At the time of the study, I went to the lab door 7 o'clock every day and found a guy who was earlier than me. Later found this guy left in the morning, and the afternoon came again, and the teacher is accustomed to this, originally this guy does not sleep all night writing code, the morning just run back to sleep. Later, he often discussed the problem with the God, and each time he felt the experience value rubbing against the upward. Then there was a god in the lab, described by the night God as "can only be a candle, has been chasing, never catch up", the characteristics of the two gods are all know a little, so anything can be discussed with you, I have a time to do a book plan, from C + + to Vc/mfc to UNIX network programming, The last way to see Java core Technology and the C # Programming Guide on MSDN, and God can be very high.

In short, these two gods pulled me into the pit, or jumped into another pit from one pit, although the two gods were not front-end, but there was always something in common between the two.

Reading

Reading, reading more, reading good books. In Liu Weipeng's blog, I saw a formula that your first month's salary equals the sum of the technical book prices (read the book) that you bought before (the technical books here refer to the classic, well-known books). There seems to be no point in discussing the correctness of this formula, but its rationality is beyond doubt, that is, read more classical technical books. One of the most extreme examples, Google's Xu in my university said he swept the library of the entire TP312 bookshelf ... For the front end of the classic books, a list of the front end of my collection (if there are missing front-end classic good book, please leave a message to tell me), there are conditions to try to brush these books, I am also looking for the full time to chew them out. Previously said, the front-end knowledge points loose, collect scattered knowledge points, from the blog Fast Learning, and so on, these are just one aspect of the front-end learning, if you want to deeply understand a knowledge system, understand its ins and outs, to it to establish a systematic understanding, read the classic book is still essential.

I began to chew the Rhino book from the beginning, and then went to see some other and front-end involved in the classic technical books, and then through the laboratory project and some of their own small projects gradually on the front-end areas of the road, and saw the "JavaScript mode", "JavaScript design mode", " Write maintainable JavaScript, and later learned node and began to use node to do some gadgets, and read this "NodeJS Up and Run" and "MongoDB authoritative guide", but felt the former slightly pit. At that moment Pauling that the book is not out of the way, and then went out to the library to borrow to read, so look down feel good, but the feeling is still less, still need to continue to brush (refer to the above book column).

Positioning of the front end

The positioning of the front-end is about what knowledge and skills you need to absorb and decide what you need to be sensitive to in the technical world. If you think that the front end is just stuck in the cut page, to achieve the interaction and visual requirements, then your understanding of the front end is still in the initial stage. Ali end of the time I asked the examiner such a problem: the front-end technology, the wider the wider, the standard is more and more rich, it seems that any one tentacles can reach out very far. How to give the front end a proper positioning? The examiner gave me a half-day analysis, and then summed up into a sentence, is the user and the site of the coupling, the creator of user experience (the exact words are not, but the general meaning). In other words, the ultimate goal of the front end is to create user experience, improve user experience, and focus on user experience. Whether you're working from an interaction design up or down, or from performance optimization, or improving your workflow to improve workflow efficiency, it's ultimately about creating and improving the user experience that ultimately comes to the user experience. I think this summary is very reasonable (of course, "user experience" is too broad, and not only the front-end engineers, such as the development of the background of a data processing process optimization, improve the overall performance, which is an improvement of the user experience).

Now the front-end engineers to achieve a certain stage will inevitably come into contact with a lot more than cutting pages, to achieve visual requirements, interactive and other more in-depth problems, such as front-end automation, image programming, performance optimization, and so on, and then push a little bit is Php/jsp/asp/nodejs, the past back-end template is generally the category of the backend , now with the evolution of the front-end architecture, you may be able to write back-end template code, need to use the backend language (php/java/c#, etc.), this is the so-called large front end (but this is not the same as the front-end positioning is not the same, the large front-end processing is still in contact with the user, still is the Probably the most common or the most talked about is node, in fact, these kinds of technology selection can be, bat three is said to be more than Baidu with PHP, Ali with node more.

Yuber in his blog that the so-called full-end is horizontal, the whole stack is vertical. All terminals are the front end of all, because it is all about the user experience, direct and user contact. Adapting to multi-terminal development requires you to extend the knowledge of Android development and iOS development on a web front-end basis, but thanks to the popularity of the hybrid development approach, the skills that are developed with the native language will not be so deep.

The whole stack can be said to be the most suitable for the start-up of a type of development, the broad sense is from the front end to the back end, from the development of dry to operational dimensions, this does not say that the general people should not want to go in this direction, want to become the sense of Full-stack Dev, may not need to come to my article While the narrow-sense full stack refers to using the JS language from the front end to the back end of the Nodejs, the unified language, the unified programming model, and even the common set of code. Learn more about the full stack development can see Yuber This article says full stack engineer.

These are some of my superficial understandings of the front end and the derived technical route, and it is important to learn the direction and trend of the whole in a field. In addition, if you want to the front-end learning direction, career growth path has a holistic understanding, recommended to see the summary of the extraction of the front-end development of the 10th talk.

At last

Contribute several links to front-end learning and interviewing:

• Front-end Interview problem Collection (front-end-developer-interview-questions)
• Front-end Skills Summary (Jacksontian)
• Another front-end Skill Summary chart
• The front-end thing (book row)

Byr Forum Yiyizym's recommendations

Compared with grunt, learning Gulp will be relatively simple

If you are a spa, backbone.js and Backbone.marionette.js are recommended.

Fq do not toss, spend 10 yuan to buy one months of red apricot.

It's no problem to have a solid foundation and learn these things.

HTML There is nothing to say, have time to learn HTML5.

CSS as far as possible to read the document, because a lot of Chinese materials are a word, see more will be confused.

There is a Web site to find Html/css tags, properties in each browser support situation, very useful.

JavaScript is looking at high-level programming for JavaScript. However, such a thick book will be forgotten when you read it. Explanation of the core JavaScript concept: Object/prototype Chain/constructor/execution context/scope chain/closure/this, here's a good article.

There are leisure to see ECMAScript 6, scheduled to be released next June. Nanyi's website has access to information.

jquery has a lot of APIs, and this site can be easily found. Have time to figure out the use of jquery deferred.

More to Sublimetext plug-ins, such as checking code errors, new directory files, sorting code.

Web front-Section learning methods