拉取镜像

docker pull mysql:latest
想要比较稳定的版本可以用5.7或者8.0 (或者8.4?) 比如mysql:5.7 或mysql:8.0

部署镜像

docker run -p 3306:3306 --name mymysql -v $PWD/conf:/etc/mysql/conf.d -v $PWD/logs:/logs -v $PWD/data:/var/lib/mysql -e MYSQL_ROOT_PASSWORD=123456 -d mysql:latest  

docker run
启动一个新的 Docker 容器。

-p 端口映射
--name 为这个容器指定一个名称

-v 将当前工作目录挂载到容器内的目录 $PWD表示当前目录,可以根据需要自行修改

-e 设置环境变量

-d 以后台模式运行容器(detached mode),容器启动后不会阻塞当前的终端,会在后台运行。

mysql:latest 指定使用最新版本的 MySQL 官方镜像。如果没有本地镜像,Docker 会从 Docker Hub 拉取最新的 MySQL 镜像。

使用

由于 mysql 的安全策略,现在还不能使用 root/123456 来访问数据库
运行下面命令来进入容器

docker exec -it mymysql /bin/bash

这条命令的作用是在已经运行的容器内启动一个交互式 Bash Shell,让你直接进入容器内部进行操作。

docker exec exec 命令用于在一个已经处于运行状态的容器中执行新的命令。
-it

-i:交互式(interactive),让命令在前台保持对键盘输入的监听。
-t:伪终端(pseudo-TTY),为容器内的进程分配一个伪终端,方便进行命令行操作。

/bin/bash 指定要在容器中执行的命令,这里是 Bash Shell。执行后会打开一个终端会话环境,可以在容器内输入各种 Shell 命令。

之后运行以下命令进去mysql

mysql -uroot -p123456

-u 表示用户
-p 表示密码

创建root用户和权限授予

步骤 1:创建用户或修改用户密码

如果用户不存在,使用 CREATE USER 创建用户并设置密码

CREATE USER 'root'@'%' IDENTIFIED BY 'root';
CREATE USER 'root'@'127.0.0.1' IDENTIFIED BY 'root';
CREATE USER 'root'@'localhost' IDENTIFIED BY 'root';

如果用户已存在,使用 ALTER USER 修改用户密码

ALTER USER 'root'@'%' IDENTIFIED BY 'root';
ALTER USER 'root'@'127.0.0.1' IDENTIFIED BY 'root';
ALTER USER 'root'@'localhost' IDENTIFIED BY 'root';

步骤 2:授予权限

GRANT ALL PRIVILEGES ON *.* TO 'root'@'%' WITH GRANT OPTION;
GRANT ALL PRIVILEGES ON *.* TO 'root'@'127.0.0.1' WITH GRANT OPTION;
GRANT ALL PRIVILEGES ON *.* TO 'root'@'localhost' WITH GRANT OPTION;

步骤 3:刷新权限(可选)

在 MySQL 8.0 及更高版本中,GRANT 语句会自动刷新权限,因此通常不需要手动执行 FLUSH PRIVILEGES;。但如果你进行了其他权限表的直接修改,可以使用:

FLUSH PRIVILEGES;

安装VMware

使用直链下载然后使用激活码的形式:
https://github.com/201853910/VMwareWorkstation
或者选择使用免费的个人授权:
https://www.cnblogs.com/EthanS/p/18211302

安装ubuntu

下载镜像:

https://ubuntu.com/download/desktop

安装

vmware新建虚拟机,选择使用下载的镜像
然后根据提示输入信息后会自动安装

使用

ping测试

ubuntu打开终端 安装 net-tools

sudo -i #切换到root用户
sudo apt update 
sudo apt install net-tools

安装完成之后运行:

ifconfig

找到网卡(第一串内容)找到inet的标识,后面跟着的就是ip地址
在windows下ping一下这个ip地址,如果可以ping通就表示成功了。

安装 SSH 服务

OpenSSH 是 Ubuntu 默认的 SSH 服务实现,可以使用以下命令安装:

sudo apt install openssh-server -y

安装完之后就可以通过ip来ssh连接虚拟机了

安装docker

curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun

设置开机自启

systemctl start docker
systemctl enable docker

配置镜像

https://cmd2.openbase.store/

(ps:太惨了,找个镜像需要找挺久)

安装docker-compose

sudo apt install docker-compose

安装jquery

npm i jquery

使用

引入

import $ from 'jquery';

GET方法:

$.ajax({  
    url: url,  
    type: "GET",  
    data: {  
    },  
    dataType: "json",  
    success: function (resp) {  
    },  
});

POST方法:

$.ajax({  
    url: url,  
    type: "POST",  
    data: {  
    },  
    dataType: "json",  
    success: function (resp) {  
      
    },  
});

安装

安装Route组件:

npm i react-router-dom

Route组件介绍

  • BrowserRouter:所有需要路由的组件,都要包裹在BrowserRouter组件内
  • Link:跳转到某个链接,to属性表示跳转到的链接
  • Routes:类似于C++中的switch,匹配第一个路径
  • Route:路由,path属性表示路径,element属性表示路由到的内容
  • useParamsuseSearchParams 获取路径参数
  • Navigate:和Route组件组合使用来实现重定向

使用

BrowserRouter

引入

import { BrowserRouter } from 'react-router-dom';

使用BrowserRouter

在root.render()中用<BrowserRouter></BrowserRouter>将App组件(或者自己定义的其他有使用路由的组件)括起来。

例如

<BrowserRouter>
    <App />
</BrowserRouter>

Link

引入

import { Link } from 'react-router-dom';

使用

将页面内部跳转所用到的<a href="..."></a> 改为 <Link to="..."></Link>,其他保持不变

Routes和Route

引入

import {Routes, Route} from 'react-router-dom';

使用

先写一个<Routes></Routes>标签,然后在里面写<Route />标签
其中<Route /> 标签中有两个参数一个是path另外一个是element,path中放匹配的路径,element中放要渲染的标签

例如

<Routes>
    <Route path='/' element={<Home />}/>
    <Route path='like' element={<Like />}/>
    <Route path='about' element={<About />}/>
    <Route path='issues' element={<Issues />}/>
</Routes>

element中不仅可以放组件的标签,正常的html标签也可以放
例如:

<Routes>
    <Route path='/' element={<h1>Hello world</h1>}/>
</Routes>

嵌套路由

<Route path="/web" element={<Web />}>
    <Route index path="a" element={<h1>a</h1>} />
    <Route index path="b" element={<h1>b</h1>} />
    <Route index path="c" element={<h1>c</h1>} />
</Route>

注意:需要在父组件中添加<Outlet />组件,用来填充子组件的内容。(即<Outlet />会根据路由的不同动态的渲染不同的子标签,假如当前的路由为/web/a<Outlet />等效于<h1>a</h1>

useParams 和 useSearchParams

URL中传递参数

解析URL:

<Route path="/linux/:chapter_id/:section_id/" element={<Linux />} />

获取参数,类组件写法:

import React, { Component } from 'react';
import { useParams } from 'react-router-dom';

class Linux extends Component {
    state = {  } 
    render() {
        console.log(this.props.params);
        return <h1>Linux</h1>;
    }
}

export default (props) => (
    <Linux
        {...props}
        params={useParams()}
    />
)

函数组件写法:

import React, { Component } from 'react';
import { useParams } from 'react-router-dom';

const Linux = () => {
    console.log(useParams());
    return (<h1>Linux</h1>);
}

export default Linux;

Search Params传递参数

类组件写法:

import React, { Component } from 'react';
import { useSearchParams } from 'react-router-dom';

class Django extends Component {
    state = {
        searchParams: this.props.params[0],  // 获取某个参数
        setSearchParams: this.props.params[1],  // 设置链接中的参数,然后重新渲染当前页面
    }
    
    handleClick = () => {
        this.state.setSearchParams({
            name: "abc",
            age: 20,
        })
    }

    render() {
        console.log(this.state.searchParams.get('age'));
        return <h1 onClick={this.handleClick}>Django</h1>;
    }
}

export default (props) => (
    <Django
        {...props}
        params={useSearchParams()}
    />
);

函数组件写法:

import React, { Component } from 'react';
import { useSearchParams } from 'react-router-dom';

const Django = () => {
    let [searchParams, setSearchParams] = useSearchParams();
    console.log(searchParams.get('age'));
    return (<h1>Django</h1>);
}

export default Django;

Navigate

引入

import {Routes, Route, Navigate} from 'react-router-dom';

使用

<Route path="*" element={ <Navigate replace to="/404" /> } />