1.
For details of common CSS layout methods, please refer to some common CSS layout methods, including Flex layout, Grid layout, Holy Grail layout, Double Flying Wing layout, etc.
2. Several JavaScript animation libraries recommended
JavaScript libraries are very useful tools for designers and developers. They can add some super powerful features to your website and give users a better experience.
3. Detailed explanation of JS naming and annotation specifications
. I have been engaged in front-end development for a period of time. I have been following standardized development. I have gradually switched from js to ts. I have also gained a lot in this process. Write down my development experience here. This article refers to the JavaScript development specifications, and makes supplements and modifications, while deleting the content related to framework development.
4. JavaScript data structures and algorithms
Data structures and algorithms have always been considered dispensable for many front-end engineers, but they are not. I personally think that front-end engineers are the ones who need to pay attention to data structures and algorithms the most, because the front-end What is done is what users see when they visit the website. Especially after the arrival of the mobile wave, the user experience is getting higher and higher, and higher requirements are put forward on the front-end. In the face of increasingly complex products, it is necessary Only a solid data structure and algorithm foundation can be controlled. If there are no programmers who have studied computer science, when we are dealing with some problems, the more familiar data structure is the array. The array is undoubtedly a good choice. But many times, for many complex problems, arrays are too crude. After learning data structures and algorithms, for many programming problems, when you think of a suitable data structure, design and implement algorithms to solve these problems. Get caught.
5. The storage of JavaScript data types is
a very basic knowledge point, how to store basic data types and reference data types in JavaScript. Since I am a wild programmer, I didn’t care about the basic knowledge of memory when I first started learning programming. As a result, when I mentioned "what is stored in the stack, there is only a reference in the stack". Face dumbfounded. . Later, I gradually learned some knowledge of memory, which is still very necessary to understand.
6, iframe and HTML5 blob to achieve JS, CSS, HTML direct current page preview,
real-time preview of front-end code effects is actually very common, such as jsbin, codepen, runjs and other sites are to meet this demand. The traditional method is like this, a new independent page will be created to receive the incoming front-end code, and the final effect will be achieved by opening a new window or embedding an iframe page, which may use communication technologies such as HTML5 postMessage. This article describes the real-time preview of front-end code with the help of iframe and blob.
7. Talking about the interface implementation in JavaScript
Interface is one of the most useful tools in the toolbox of object-oriented JavaScript programmers. One of the principles of reusable object-oriented design proposed in the design pattern is "programming for interfaces rather than implementation programming", which is what we call interface-oriented programming. The importance of this concept is evident. But the problem is that in the world of JavaScript, there is no built-in method for creating or implementing interfaces, and there is no set of methods that can determine whether an object implements the same set of methods as another object, which makes it difficult to interchange between objects. Fortunately, JavaScript has excellent flexibility, which makes it easy to simulate traditional object-oriented interfaces, and adding these features is not difficult. An interface provides a means to explain which methods an object should have. Although it can indicate the meaning of these methods, it does not contain specific implementations. With this tool, objects can be grouped according to the characteristics they provide.
8. Deeply understand the this in JavaScript.
Do you often get confused by the this keyword in JavaScript? Don't be too careful, many JavaScript beginners have been confused by it. You are not alone in the fight. Having said that, but This does not mean that you never need to understand this. Whether in JavaScript or in many tutorials, this is widely used, so it will be sooner or later to master this. Once you understand this, you will feel that it is actually better than you It is much simpler to imagine. After reading this article, you will have a deep understanding of this secret. Then you will know what it is, what it does and how to use it.
9. How to write a lightweight CSS framework.
There are many things I want to say, but I can't talk about it. Nowadays, lightweight frameworks are springing up like bamboo shoots after a rain, one after another. I think everyone should summarize the common needs in their work and write a CSS framework that suits them. (By nzbin)
10. What is the execution context and call stack in JavaScript?
For details, please see: An article takes you to understand the execution context of basic JavaScript concepts. In this article, the author will help you understand how the JavaScript interpreter executes your code.
11. The road to JavaScript refinement-the realization of asynchronous (on)
The relationship between the current running part and the future running part of the program is the core of asynchronous programming. Simply put, if there is a part of the program that needs to be run now (sequentially executed synchronously), and part of the program needs to be run in the future (maybe timeout is set or it may be a function executed after an asynchronous call of ajax), then between the two The construction of the relationship constitutes asynchronous programming.
12. In-depth article | The Ultimate Guide to JavaScript Fatigue: The Truth in Our Industry
Last week I gave a speech that was very similar to this topic at the NebraskaJS 2017 conference. I also received a lot of positive feedback, so I thought that this speech can also be done Write an article and publish it to let more people know and help them cope with JS fatigue and understand the truth of our industry. The purpose of this article is to change your general view of the software engineering industry and help you in the areas where you may work.
13. The implementation of queue
queue and stack in JavaScript is very similar, but uses a different principle instead of last in first out. A queue is an ordered set of items that follows the FIFO (First In First Out, also known as First In First Out) principle. The queue adds new elements at the end and removes elements from the top. The newly added element must be at the end of the queue. In reality, the most common example is queuing: the first person will receive the service first.
14. In-depth explanation of Web Audio Api
Web Audio API needs to handle audio operations in the audio context, and has the characteristics of modular routing. Basic audio operations are performed through audio nodes, which are connected together to form an audio routing graph. We can extract a few keywords from the above text: Audio context audio node modular audio diagram I will start with these keywords and slowly introduce what is Web Audio Api and how to use Web Audio Api to process audio and many more.
15. In August 2017, a collection of super practical dry goods for front-end developers.
In the past few years, the quality of various design and development resources circulating on the Internet has been significantly improved. Some of them have almost become essential tools for designers and developers, but most of them are not widely known due to the limitation of their application scope or the insufficient spread. To gather these materials together is to a large extent hope that their target users can understand where to find these tools when they are needed. The content of this front-end dry goods collection is also very complete. Take a closer look, and you can always find a few you need.
16. Personal summary (new features of
css3 ) I believe that everyone is familiar with css3, it is a very interesting and magical thing! With css3, js can be written a lot less! I also wrote articles about css3 before, and encapsulated some small animations of css3. I personally think that css3 is not difficult, but it is difficult to use well and handily. Recently, I have also gone through some new features of css3 (not all, they are commonly used in my work, or find useful), and some examples, Just wrote this summary! Hope, this article can help everyone know css3. Writing this article is mainly for everyone to understand some of the new features of css3, as well as basic usage, and feel the charm of css3! If you want to make good use of css3, you have to continue to study hard and find some articles or books that speak more in-depth! If you have any other features recommended, welcome to add! Let's learn together and make progress!
17. Vue plug-in writing and actual combat
This article is based on the concept of vue open source. It mainly explains the methods and steps of writing vue plug-ins for vue developers, and deepens everyone's understanding of vue plug-in writing through the combination of theory and practice.
18. A comprehensive summary of
Ajax Ajax has a pivotal position in front-end development. The use and precautions of Ajax have always been an important topic. Taking this opportunity, this article hopes to make a comprehensive summary of Ajax and completely uncover the mystery of Ajax. veil. 1. What is AjaxAjax(Asynchronous JavaScript and XM...
19. Detailed explanation of
HTTP caching mechanism Http caching mechanism is an important means of web performance optimization. For students engaged in web development, it should be a basic link in the knowledge system library, and it is also for students who aspire to become front-end architects. The necessary knowledge and skills. But for many front-end students, they just know that the browser will cache the requested static files, but why they are cached and how the cache takes effect is not very clear. Here, I will try to use simple and clear text, like your systematic introduction to the HTTP caching mechanism, and hope that it will be helpful for you to understand the front-end cache correctly.
20. Vue.js data binding principle
Vue.js is an MVVM framework, which is quick and easy to use to get started. Through data binding, the view is updated when data is modified. The data binding principle of Vue.js relies on Object.defineProperty, which has been mentioned in the Vue.js documentation. This is why Vue.js does not support E8 and lower browsers. Vue monitors data changes by setting the setter/getter methods of object properties, and performs dependent collection through getters. Each setter method is an observer, which notifies subscribers to update the view when the data changes.