Copyright belongs to the author.
Commercial reprint please contact the author for authorization, non-commercial reprint please specify the source.
Shing
Links: https://www.zhihu.com/question/19862294/answer/44311692
Source: Know
- CSS Coding specification/ HTTP/cssguidelin.es/
- 24 ways to optimize front-end Performance http/browserdiet.com/en/
- Learn JS the correct method js:the right way
- Very interesting JS programming textbook (Just out of) eloquent JavaScript
- The designer wrote the JS Starter tutorial, the page is very good http:/rachelnabors.com/javasc ript-for-designers/#slide-0
- CSS Goddess developed Regular Expression tool, excellent: REGEXP playground
Copyright belongs to the author.
Commercial reprint please contact the author for authorization, non-commercial reprint please specify the source.
Chen Bing
Links: https://www.zhihu.com/question/19862294/answer/47926672
Source: Know
I used to study for a period of time web front-end development, organized some I have seen/I think better learning materials (websites, books). Do not ask why I did not advance version, I just a product Wang only, for light spray. = =
The following references are at @ Mr. Li.
In my experience, most of the technology, familiar with the following four types of books can be.
Introduction, in plain language and way to tell the right truth and method, such as head first series
Comprehensive, exhaustive to discuss each detail, encountered difficult problems can often be here to get theoretical solutions, such as definitive guide/programming XX series
To describe how to design and solve problems, such as the Cookbook series, in the context of situations often encountered in practice.
In-depth, to explain some of the culture, ideas, and even philosophy of things, really do in-depth a language to programming, such as the UNIX Programming art, Programmer's way of cultivation and so on
Inspired by Mr. Li's teacher, I combined my own information in the learning front-end process as follows:
First, the language basis (book and web-based)
1.HTML&CSS:
(1) Getting Started:
- HTML&CSS Course on Codecademy--online interactive programming platform, figuring out basic concepts and basic grammar
- W3school on the Html/css tutorial-a technical manual tutorial, more comprehensive, according to the example of knocking over
(2) Advanced:
- Proficient in CSS advanced Web Standards Solution--a more in-depth study of CSS, understanding of core technology
- The HTML5 authoritative guide-a very comprehensive book with a new content, including the Html5+css3+js DOM
(3) Actual combat:
- Bootstrap frame: Bootstrap Chinese net/"bootstrap combat"--Popular Front-end frame, focus on practical can
- The Web Developer skills+projects--on Codeademy uses its own small page/website to learn
(4) Improve:
- "CSS Zen Garden"-Improve your artistic design ability, through examples to learn how to design a beautiful page with CSS
2.Javascript:
(1) Getting Started:
- Codeademy on the JavaScript tutorial-more examples, relatively shallow, is a basic understanding of JS
- W3school on the JS tutorial--More detailed understanding of the characteristics of JS
- JavaScript DOM Programming Art--talk about JS and Dom basic knowledge and application, understand what JS and Dom can do
(2) Advanced:
- "JavaScript Advanced Programming"--js Bible, a more comprehensive, very good book, more readable than Rhino book
- "JavaScript authoritative guide"-The legendary Rhino book, a very thick book, not suitable for beginners, suitable for use as reference books
- The best of JavaScript-a very thin book, but it can help you quickly understand the essence of JS
(3) Actual combat:
- jquery Framework: W3school on the jquery tutorial/codeademy on jquery Tutorial --Learn about jquery
- The basic jquery Tutorial-a Popular Front-end framework that focuses on practical
(4) Improve:
- High-performance JavaScript--How to improve JS performance and best practices for building and deploying files to your production environment
- "Secrets of the JavaScript Ninja"--jquery author of the book, if you feel proficient in JS and then read the book
Appendix: Large Summary of front-end sites
1, the front-end knowledge System:
- Front-end knowledge system and cultivation strategy: front-end knowledge system and cultivation strategy--the front-end knowledge system is very good analysis, especially the end of the stage division, the front-end learning is very instructive, recommended!
- Front-end development knowledge Structure: JACKSONTIAN/FKS github--has a front-end knowledge framework of mind map, gave a lot of links and good books, recommended!
2, Technical information class
- W3cfuns: Front End network (w3cfuns)--the largest front-end station in the country, compared to the whole
- Big front end: Big Front End _ focus on front-end development and WordPress Theme Blog-No w3cfuns so miscellaneous, some wodpress theme, "front-end navigation" is also more useful
- W3cplus:w3cplus | CSS3 Tutorial-CSS3 Instance-CSS3 Animation--is also relatively full, there is a "foreign excellent translation", very much like
- Front-end observation: front-end observation-focus on the front-end design and development of the blog, more depth, layout clean, recommended!
- Front-end stew: front-end stew, the most professional front-end technology content community-a bit like the front end of the know, have questions and answers platform and column what
3. Technical tutorials, document classes
- Mu class Network: MU class network-study plan
--Super Practical Video tutorial website, a variety of small instances, very suitable to follow the "front-end Learning Plan" program learning
- Codecademy:http://www. codecademy.com/-English, simple and interesting interactive programming learning website, very suitable for beginners, Chinese version is http://www.fenby.com/
- W3schoo Online tutorial L:w3school online tutorial--Chinese, suitable for getting started, tutorials quite full, online instances can be knocked, unfortunately lighter, some places less accurate and in-depth
- Firefox Developer Network Mdn:mozilla Developer Network--Chinese, not only have technical documents, but also have a considerable number of references and resources, tools, recommendations!
- Standard: STANDARDS-W3C
--English, no explanation, official documents, true front end and pseudo front end. Unfortunately English, and poor readability. Very unsuitable for getting started, suitable for improvement.
- Web Platform Documentation: Your Web, documented webplatform.org--English, authoritative second only to the standard, readability than the standard, the official recognition, high-quality.
Front-end knowledge learning steps