Vue.js Getting Started

This paper introduces the concepts of progressive framework and MVVM, and makes use of vue.js (a set of progressive framework to build user interface) to construct the background management system of API project.

What is MVVM

Model–view–viewmodel (MVVM) is a software architecture design pattern that creates a user interface, where model is the data model, and view is our views, and ViewModel is a view model that binds the DOM elements above the data model and view.

MVVM originates from the classic Model–view–controller (MVC) pattern, which also evolves the Model-view-presenter (MVP) pattern, which is negligible. The advent of MVVM facilitates the separation of GUI front-end development from back-end business logic and greatly improves the efficiency of front-end development. The core of MVVM is the ViewModel layer, which is like a transit point (value Converter) that transforms the data objects in the Model to make the data easier to manage and use, with two-way data binding to the view layer up and down with the Model Layer through the interface request for data interaction, play the role of the start.

MVVM Model:

The various components of MVVM:

--Quote from front and back end break master--MVVM mode

What is an incremental framework

Progressive-in the original project, you can first try to introduce one or two components, can be used when the plug-in .... You can even use it to develop the entire project! In other words, standing in the user's word: "Give you an empty house, as for what you need to add a piece of your own, rather than the kind of household appliances all-in-one, I do not like a piece of the throw, even required must use and cost space!" ”

--what is an incremental framework? React virtual dom understanding?

It gives you enough optional, but does not advocate a lot of required, do not do more than the responsibility of things! This is the progressive type.

--What are the two concepts cited from the Vue2.0, the progressive framework and the bottom-up incremental development design? 》

What is Vue.js

Vue.js is a set of progressive frameworks for building user interfaces that focus on the ViewModel layer of the MVVM model.

Vue.js is not only simple, easy to get started, equipped with complete facilities, but also has Chinese documents.

For developers using vue.js, we can still write code using familiar HTML and CSS. And, Vue.js also uses Virtual DOM, reactive, and modular thinking, allowing us to focus on writing applications rather than application performance.

--Quote from "My career is the front-end engineer" Four ": How to choose the right front-end frame, say goodbye to fear of choice

Vue.js is a set of progressive frameworks for building user interfaces. It is an open source framework, the latest version has been updated to 2.0 and is a standalone JavaScript framework that does not depend on any other frameworks (such as jquery).

Vue.js Open Source Address: Https://github.com/vuejs/vue

Vue.js English Document: https://vuejs.org/

Vue.js Chinese Document: https://vuefe.cn/

Vue.js Various resources: https://github.com/vuejs/awesome-vue#official-resources

Vue.js Simple Example

Existing. NET API projects, need to establish a simple back-office management system to manage background users and application authorization information. The original back-office management system, which is more complete and bulky, is too cumbersome for the project, so try a small background front-end framework that is simpler and faster based on the existing. NET API Project Framework. Vue.js is a good choice.

The implementation can refer to Vue.js Chinese document and JS component series--Another MVVM component: Vue (one: 30 minutes to fix the front end add and delete changes)

Vue.js Getting Started