2021/1/2
一、今日所学内容
宠物类别
1、添加宠物类别
2、删除宠物类别
3、修改宠物类别
4、查询宠物类别〔列表)
5、查询单条宠物信息的接口
流程：
1.创建一个springboot项目
2.设计分层，controller、service、dao、entity（实体类）
controller里面定义一个方法，启动项目
会报错 url （因为没有配置数据源）需要提前建好数据库
在这里插入图片描述
3.需要提前创建实体类在这里插入图片描述
4.需要在dao包里创建对应的接口，需要添加注解@Repository在这里插入图片描述
5.需要在service包中创建service接口和service接口的实现类并添加注解@Service在这里插入图片描述
6.添加mapper文件夹及文件夹下的mapper.xml文件在这里插入图片描述
7.在xml文件中添加mybatis的相关信息
8.启动项目，可能会报错
在这里插入图片描述
需要添加扫描包的注解
9 .重新启动项目，项目日志提示dao.方法not found错误
在这里插入图片描述
解决方法是在application.yml中添加上面的配置
在指定路径下创建项目
1.命令行打开 npm
输入【npm start】
2.进入f盘
输入【f:】 进入某个文件夹 【cd react】
接着进入文件夹 【cd reactPropect】
创建项目：
即在指定路径下创建项目
node 版本：v6.11.2
npm 版本：3.10.10
开发（在UI目录下）
# 安装依赖
npm install
## 若上述不行则采取下面命令
npm install --registry=https://registry.npm.taobao.org
# 本地开发 开启服务
npm run dev
1
2
3
4
5
6
7
8
浏览器访问 http://localhost:8082
发布
# 构建生成环境
npm run build:prod
npm install -g cnpm --registry=https://registry.npm.taobao.org
cd litemall/litemall-admin
cnpm install
cnpm run dev
把components重命名为views，在此目录下新建Login.vue、Home.vue
Login.vue
<template>
<div class="page">
<h2>Login Page</h2>
</div>
</template>
<script>
export default {
name: 'Login'
}
</script>
Home.vue
<template>
<div class="page">
<h2>Home Page</h2>
</div>
</template>
<script>
export default {
name: 'Home'
}
</script>
添加路由：在router下的index.js中配置Login和Home页面
index.js
import Vue from 'vue'
import Router from 'vue-router'
import Login from '../views/Login'
import Home from '../views/Home'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/Login',
name: 'Login',
component: Login
}
]
})
分别访问http://localhost:8081/#/和http://localhost:8081/#/login
首页：http://localhost:8081/#/
登录页面：http://localhost:8081/#/login
我们把V这个logo给去掉：在App.vue中注释掉img
二、感受及收获
今天学习了springboot建立和前端，spring在昨天的以及讲的很详细了，今天重点讲了一下前端，说到前端就要知道node和vue，Vue.js是什么？
Vue.js是一款流行的JavaScript前端框架，一个用于创建用户界面的开源JavaScript框架，旨在更好地组织与简化Web开发。Vue所关注的核心是MVC模式中的视图层，同时，它也能方便地获取数据更新，并通过组件内部特定的方法实现视图与模型的交互。
Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 也能完美地驱动复杂的单页应用。
node.js是什么？
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型。
Node 是一个让 JavaScript 运行在服务端的开发平台，它让 JavaScript 成为与PHP、Python、Perl、Ruby 等服务端语言平起平坐的脚本语言。
Node对一些特殊用例进行优化，提供替代的API，使得V8在非浏览器环境下运行得更好。V8引擎执行Javascript的速度非常快，性能非常好。Node是一个基于Chrome JavaScript运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node 使用事件驱动， 非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。
