How to build your own website (2)

One, ubuntu installation database

1. Install

Installation: sudo apt-get install mysql-server
View version: mysql -V
View running status:sudo netstat -tap | grep mysql

2. Find the initial password

cd /etc/mysql
sudo vim debian.cnf

 

3. Login

mysql -u debian-sys-maint -p
Enter password: xxxxxxxxxxxxxxxx

4. Change password

ALTER USER 'root'@'%' IDENTIFIED WITH mysql_native_password BY 'xxxxxx';

5. Modify the remote connection

use mysql;
select host,user from user;
update user set host = '%' where user = 'root';
flush privileges;

Two, mybatis connects to the database

1. Create a new demoMybatis project

Check mybatis, jdbc and other dependencies.

2. Modify the application.properties configuration file

This file can be split into three, one is the application.yml that selects the startup file, one is the development environment application-dev.yml, and the other is the production environment application-prod.yml, and the url of the production environment replaces localhost with the remote database address , the details are as follows:

spring:
  profiles:
    active: prod

server:
  port: 8080
spring:
  datasource:
    username: root
    password: 123456
    url: jdbc:mysql://82.157.160.30:3306/ache?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC
    driver-class-name: com.mysql.cj.jdbc.Driver
mybatis:
  mapper-locations: classpath:mapping/*Mapper.xml
  type-aliases-package: com.example.demoMybatis.entity
#showSql
logging:
  level:
    com:
      example:
        mapper: debug

3. Interface for writing queries

mapper

database:

have a test:

Regular packaging mvn clean package、Regular upload, find container docker ps, find image docker images, kill container docker kill CONTAINERID, remove container docker rm CONTAINERID, remove image docker rmi IMAGEID, 构建镜像docker build -t my/demo .,运行容器docker run -d --name demo -p 8080:8080 my/demo 

3. Vue search keyword highlighting

const highLight = (allText, keyword) => {
  let Reg = new RegExp(keyword, "ig");
  if (allText) {
    let execRes = Reg.exec(allText.toString()); //得到一个匹配结果的集合，包含关键字出现的索引
    if (execRes) {
      let realword = allText.substr(execRes.index, keyword.length); //根据索引和关键字长度获取原本的真实大小写关键词
      let res = allText.replace(
        Reg,
        `<span style="color: red;">${realword}</span>`
      );
      return res;
    } else return allText;
  } else return allText;
};

<h3 v-html="highLight(item.title, filter.search)"></h3>
<p v-html="highLight(item.detail, filter.search)"></p>

Four, success