what is Vue
Vue (pronounced /vjuː/, similar to view) is a progressive framework for building user interfaces (with specific functionality on demand). Unlike other large frameworks, Vue is designed to be applied layer by layer from the bottom up. Vue's core library only focuses on the view layer, which is not only easy to use, but also easy to integrate with third-party libraries or existing projects. On the other hand, when combined with modern toolchains and various supporting libraries, Vue is also fully capable of powering complex single-page applications.
Preliminary work/technical reserve about learning Vue
1.GitBatch
GitBatch is a tool that can write shell scripts. What we learned today is not supported under cmd. you want
Either choose gitbatch, or you choose a Linux system
2 Advanced Notepad
UltraEdit UE
NodePad ++
EditPlus
SublimeText
3.Node-----npm command
Node.js is a JavaScript runtime environment based on the Chrome V8 engine.
Node.js uses an event-driven, non-blocking I/O model, making it lightweight and efficient.
npm, the package manager for Node.js, is the world's largest ecosystem of open source libraries.
Download URL:
http://nodejs.cn/download/
single page application
Single Page Application (SinglePage Web Application, SPA)
An application with only one web page is a rich client loaded from a web server. A single page jump only refreshes local resources.
Public resources (js, css, etc.) only need to be loaded once, and are often used in PC-side official websites, shopping and other websites
multi-page application
MultiPage Application (MPA)
Multi-page jump to refresh all resources, each common resource (js, css, etc.) needs to be selectively reloaded, often used in app or client
Wait.
Vue and React
Both Vue and React currently use VirtualDom
lightweight
responsive components
Server-side rendering
Easy to integrate routing tools, packaging tools and state management tools
Excellent support and community
A few simple examples of Vue
HTML
<div id="app">
{{ message }}
</div>
JS
var app = new Vue ({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
result:
Hello View!
HTML
<div id="app-2">
<span v-bind:title="message">
Hover for a few seconds to see hints for dynamic binding here!
</span>
</div>
JS
app2 = new Vue({
el: '# app-2',
data: {
message: 'Page loaded at' + new Date().toLocaleString()
}
})
HTML
<div id="app-3">
<p v-if="seen">Now you see me</p>
</div>
JS
Result: now you see me
HTML
JS
|
var app4 = new Vue({
el: '# app-4',
data: {
everyone: [
{ text: 'Learn JavaScript' },
{ text: 'Learn Vue' },
{ text: 'The whole cow project' }
]
}
})
|
result:
Learn JavaScript
Learn Vue
learn the whole project
Node.js
Node can only be used in the shell, that is to say, if you want to run the node command, you need to be in the system shell, such as the cmd of windows. The one that comes with node is called repl, you can't run npm commands in it, you can only run js statements
Open GitBash >>> enter the command line >>> npm install -g cnpm --registry=https://registry.npm.taobao.org
>>>>> Before using the vue command, you need to install the cnpm i -g vue-cli scaffolding >>> vue list test >>> vue init webpack-simple + name (lowercase) (set something) >>> >cd+filename>>>npm install>>npm run dev