20 Documents and Guides for Front-End Developers (1)

In my daily searches online, I come across a lot of interesting info-apps (applications that help you find information) and documentation, so I’ve listed them here.

It’s true that not everyone likes “list posts” or summaries, but we can’t please everyone. Regardless, we won’t always do these types of posts.

In this case, it may be a very good way to read and make some records on some evenings or weekends. I guarantee you'll find some links here that you'll want to click on and read again.

Please enjoy it!

　1.CSS Vocabulary(CSS Vocabulary)

　(You need to bring your own wall ladder to access)

Click on the application and you will learn about all the different parts of CSS syntax and their corresponding attribute names What is it.

##　 2. Liquidapsive

A simple information layout, with the help of A drop-down selection box allows you to choose between Responsive (response), Adaptive (automatic adaptation), Liquid (fluid), and Static (static). You can select these four layouts to see what is between them. different.

##　 3. Superhero.js

It is a wonderful article and video , and a collection of presentations that help maintain a large JavaScript code base.

Includes some commonly used principle types, some resources on testing, tools, performance, security, and more .

　

4. HowToCoffeeScript.com

It is a reference manual for learning and memorizing CoffeeScript syntax .

5. The HTML Landscape

It’s very interesting. It is a W3C document that describes the "obvious differences" between the three HTML specifications of WHATWG, W3C's HTML5.0 and W3C's HTML5.1.

It may be a little technical, but you might be able to find some interesting stuff here.

　

6. The Elements of HTML(HTML elements)

It only has a very beautiful one-page chart. The diagram on this page combines HTML and XHTML elements. With this diagram, you can know where each specific element belongs.

This chart is very helpful to find out which elements have been deprecated or which elements have been eliminated in HTML5.

　7. JavaScript Equality Table(JavaScript equation table)

A very beautiful three-layer structure chart , which helps you understand JavaScript’s double-equal and third-equal operators.

What is the conclusion of the above picture? "You can only use third class unless you fully understand the conversion between second class."

　

8. Web Accessibility Checklist(Web Permissions Manual)

A useful but not necessary manual that helps Allows you to check the permissions of different projects in your project.

A lot of the content in this manual is very simple. Apart from doing some permission verification, it never hurts to take a look.

　　9. Static Web Apps — A Field Guide (static web application-a handy work guide)

According to its description :"This guide will introduce you to the world of static web applications and provide solutions to the same challenges you encounter when building them."

The idea is to promote an architecture that eliminates common development problems.

##　　10. Learn regular expressions in about 55 minutes (Learn regular expressions in about 55 minutes)

A rich document or guide that introduces regular expressions.

I guess it will take longer than the "55 minutes" to get something out of this document. , but it's definitely worth a look.

　　11. Open Web CSS Reference (Open Web CSS Reference Guide)

　This is indeed a comprehensive It is a comprehensive and reference guide to CSS properties and functions that few people know about.

Based on the alphabetical order and included links in the reference guide, you can access detailed information on the content listed above.

　12. CSS Values(CSS Value value)

　This is what I did myself. It makes it easy to look up a CSS property and quickly browse possible values. For example, you forget about obscure values ​​like font-variant, which you can use to find a value that satisfies you.

In addition to looking up value, the latest version also includes browser support charts for each attribute, provided by caniuse.com.

Caniuse.com link address: http://caniuse.com/

13. ES6features(ES6 features introduction)

It comes from Microsoft developer Luke Hoban, a summary of the new things added to the ECMAScript6 specification.

The introduction states that "implementation of these features in mainstream JavaScript engines has already begun", so it is very useful for starting to become familiar with these things.

　

14. Relevant Spec Links

I usually suffer from the lack of specific information. Tell me where to search for what I want. It's a concise summary of link information from Mozilla, and it's the norm you need to know.

Mozilla introduction link address: http://baike.sogou.com/v67452.htm?fromTitle=Mozilla

　15. OverAPI.com

A large number of reference manuals, multiple series.

It seems to include all computer languages. When the icon is clicked, the reference manual will link to relevant official resources (including MDN, PHP, .net, etc.).

16. JavaScript: The Right Way## It is a guide to JavaScript, and its purpose is to put JavaScript Introduce new developers and help them gain rich programming experience through JavaScript best practices.

##　 17. The HTML5 JavaScript API Index(HTML5 JavaScript API Index)

A truly comprehensive one-stop place to search for HTML5 API information.

It is "automatically generated from the HTML5 documentation" and is easy to navigate in the three-panel area view.

　18. Zeal

　It is very elegant and neat. It is a native app with corresponding Dash document browser versions for Windows operating systems and Linux operating systems. It allows you to search more than 130 API documents offline.

Dash link address: https://kapeli.com/dash

## As long as there is a simple Using the keyboard shortcut, you can display the API browser from anywhere in your workspace.

　　19. The Ultimate Flexbox Cheat Sheet(Extensible Ultimate Reference Manual)

　It is an extensible The reference manual can help you find the flexbox (expandable layout box) syntax you need, and help you review related things that you are a little unfamiliar with.

The same person who created the awesome interactive Flexbox tutorials.

Interactive Flexbox tutorials link address: http://www.sketchingwithcss.com/flexbox-tutorial/

　 20. jsCode

It is an app that helps you create your own commonly used JavaScript coding guide.

You can also view common JavaScript programming guides made by others, or share the ones you made with your team or other partners. Common JavaScript programming guide.

Summary

Most of the things I write here are things that few people know. . If you have made something, know a certain documentation tool, or have a set of guidelines to share, you can tell us in the comment area.

The above is the detailed content of 20 Documents and Guides for Front-End Developers (1). For more information, please follow other related articles on the PHP Chinese website!