Vue和Node安装与测试---基于VScode

Node安装环境

什么是Node？

Node.js是一个服务器端的Javascript运行环境(runtime)。
Java使用JDK进行编译/运行。		> java HelloWorld
JS使用Node进行编译/运行。		> node HelloWorld.js
Node.js是一个web服务器
Java使用Tomcat提供HTML、CSS、JS等资源访问。
前端使用Node.js提供HTML、CSS、JS等资源访问。
Node.js是资源管理器
Node.js提供npm插件用于管理所有js资源。
Java使用Maven管理所有jar资源。

结论：Node.js是一款软件，支持JS基本语法，可以提供web服务器，可以通过npm插件管理资源。

环境搭建

下载

https://nodejs.org/en/

安装

• 步骤一：运行“node-v10.16.0-x64.msi”，进行向导页面
  
• 步骤二：接受需要确认页面
  
• 步骤三：确定安装位置
  
• 步骤四：确定安装组件（所有都安装）
  
• 步骤五：进行安装。（如果有“用户账户控制”提示，点击“是”）
  
  
• 步骤六：完成安装
  
  重新启动电脑

测试

在cmd中输入命令：node --version

Vue

Vue介绍

什么是SPA？

SPA(Single Page Application)：单页面应用程序，是一种前端的开发技术，是现在前、后端分离下的一种产物。

• 传统的网站
  ​ 我们传统的网站是由很 多个独立的页面 组成的，当我们点击页面中的 a 标签时，就会向服务器发送一个新的请求，然后下载另一个页面显示，跳转时是页面之间的跳转。
• SPA
  SPA（单页面应用程序），顾名思议，整个网站中只有一个页面，在这个页面中会加载很多个不同的组件，当我们点击按钮时，并不会打开一个新的页面，而是还在当前的页面中切换显示不同的组件。

SPA 的优、缺点

• 优点
  1、减轻服务器的压力：一个网站只有一个页面，只需要从服务器加载一次
  2、并且把大量操作都放到了浏览器中去完成
  3、前、后端完成分离，使服务器只需要提供同一套 JSON 数据接口，就可以同时满足WEB端、桌面端、手机端等不同的前端设备
  4、而且前端只关注前端、后端只操作数据，各司其职

• 缺点
  1、首屏加载速度可能会很长
  2、SEO（搜索引擎优化）不友好，爬虫数据时什么也抓不到
  3、页面复杂度提高、开发难度加大

Vue全家桶的技术栈

Vue全家桶有哪些技术？

我们可以使用 Vue 框架来开发 SPA，开发时使用的技术：
1、使用 Vue Cli 脚手架工具快速构建项目目录结构、开发环境、部署环境
2、使用 Vue-Router 实现路由，实现组件之间的切换
3、使用 Vuex 实现状态数据的管理
4、使用 axios 发送 AJAX 和服务器通信

项目搭建

创建项目

在VScode的终端中输入命令：vue create 项目名（切记项目名不要使用带有vue）

到此项目就创建成功了！！