Vue.js learning record one: learning planning and understanding Vue.js-Vue.js-php.cn

Home

Web Front-end

Vue.js

Vue.js learning record one: learning planning and understanding Vue.js

coldplay.xixi

Oct 12, 2020 pm 05:15 PM

vue.js

Vue.js Tutorial column introduces learning planning and understanding Vue.js, you can learn together.

Vue.js learning record one: learning planning and understanding Vue.js

This study note will record some of the program codes and learning experiences I personally wrote when learning the Vue.js framework. To do this, I will create a directory named vuejs under the ProgrammingLanguage/JavaScript directory, and set up the following two subdirectories under this directory:

#note directory is used to store notes in markdown format. The
code directory is used to store the program code recorded in the notes.

Learning plan

- master the basic usage of npm package manager.
- Understand the basic principles of B/S application architecture.
- Online documentation: Vue.js official tutorial
- Reference book: "Vue.js in simple terms"

Part 1: Understanding the Vue.js Framework

This part of the notes will record my conceptual understanding of the Vue.js framework, as well as my experience in the project Introduce the specific methods of the framework and write a "Hello World" program.

Vue.js Introduction

Vue.js is a progressive framework for building user interfaces. The framework is designed to be applied layer by layer from the bottom up. Its core library only focuses on the view layer, which is not only easy to get started, but also easy to integrate with third-party libraries or existing projects. On the other hand, when combined with a modern tool chain and various supporting libraries, Vue.js is fully capable of driving complex single-page applications. In short, Vue.js has the following characteristics:

Uses a virtual DOM model to simplify the operation of page elements.
The use of responsive view components helps improve the user experience of the program interface.
The page rendering speed is extremely fast, which can give the application good execution performance.
It can provide routing interfaces for building complex large-scale applications like React.
It can also provide a simple-to-use and well-encapsulated operation interface like jQuery.

Of course, since the author of Vue.js is a Chinese, the Chinese information of the Vue.js community is also richer than that of other JavaScript framework communities. This is for many users who are accustomed to reading in Chinese. This may be the reason for choosing to use this framework.

Introducing the Vue.js framework

Like most JavaScript front-end libraries and application frameworks, there are two main ways to introduce the Vue.js framework into your own project: CDN reference and local reference. Let’s learn about them separately below.

CDN Quote

CDN is the abbreviation of Content Delivery Network or Content Distribution Network, which is a server that uses the existing Internet system closest to the target user. A faster and more reliable way to distribute music, pictures, videos, applications and other data materials, aiming to provide high performance, scalability and low-cost network content delivery to users. In other words, when using the CDN reference method, the Vue.js framework file will be stored on a server node in the designated CDN service network, and the service will be responsible for the access load and maintenance of the framework file. version of the framework, and we only need to reference the URL of the corresponding CDN service in the