docker是什么?

Docker是世界上最常用的平台之一。使用Docker，开发人员可以通过将应用程序源代码与运行应用程序所需的操作系统和库相结合，将其应用程序(后端或前端)容器化，从而使容器化的image文件可以在任何环境中运行。正因为如此，开发人员不需要拘泥于单一的云平台。如果任何平台都支持docker，那么他们可以在需要时轻松更改平台。

先决条件

在本指南中，你需要一个react项目。最好对docker image和容器之类的东西有一个简单的理解。但是我们也会讨论这些。

另一件事是Docker桌面。这不是必须的。你不需要docker桌面应用来运行docker命令。但是拥有它很好。

什么是docker镜像?

简单地说，docker镜像是一个包含应用程序的模板，以及在docker上运行该应用程序所需的所有依赖项。图像是最重的内容。Docker镜像有多个层。

Base image——这是我们使用docker build命令从头构建的层

Parent image——父镜像可以是Docker镜像的第一层。它是一个可重用的image，可作为所有其他层的基础。

Layers——使用代码将图层添加到基本image中，使其能够在容器中运行。Docker的默认状态是显示所有顶层图像，包括存储库、标签和文件大小。

Container layer——Docker镜像不仅创建了一个新的容器，还创建了一个可写层或容器层。该层承载对正在运行的容器所做的更改，并存储新写入和删除的文件，以及对现有文件的更改

Docker manifest——Docker镜像的这一部分是一个附加文件。它使用JSON格式来描述图像，使用图像标签和数字签名等信息。

什么是docker容器?

容器是一个标准的软件单元，它将代码及其所有依赖项打包，以便应用程序从一个计算环境快速可靠地运行到另一个计算环境。

docker镜像在docker引擎上运行时就变成了容器。容器化软件可用于Linux和基于windows的应用程序，无论基础设施如何，都将始终以相同的方式运行

现在我们知道我们要做什么了。我们开始吧。

步骤

步骤1 -创建一个ReactJS项目

这对你来说应该很容易。要创建一个ReactJS项目，只需要运行下面的命令。

npx create-react-app react-docker-training

步骤2 -创建.dockerignore文件

所以下一步是创建一个.dockerignore文件。它有点像。gitignore文件。这样做的目的是告诉docker在构建docker image时避免使用这些文件。

有两种创建文件的方法。最简单的方法是手动创建它，并命名为“。dockerignore”。

或者您可以使用下面的命令来完成

touch .dockerignore

由于这是一个简单的项目，我们没有太多可以忽略的。但是我们必须忽略的是node_modules文件夹。因此，让我们将其添加到.dockerignore文件中。

步骤3 -创建Dockerfile

要从ReactJS项目创建docker镜像，我们需要告诉docker该做什么。换句话说，我们需要给出构建指令。这就是我们要放在Dockerfile中的内容。

就像第一步一样，您可以手动创建文件，也可以使用下面的命令

touch Dockerfile

现在让我们添加构建指令。

# Stage 1FROM node:18-alpine as builder // 注意版本与创建create-react-app时的node版本一致WORKDIR /appCOPY package*.json .COPY yarn*.lock .RUN yarn installCOPY . .RUN yarn build# Stage 2FROM nginx:1.19.0WORKDIR /usr/share/nginx/htmlRUN rm -rf ./*COPY --from=builder /app/build .ENTRYPOINT ["nginx", "-g", "daemon off;"]

正如您所看到的，这是一个多级构建。在第1阶段，我们使用node:17-alpine创建一个image。在阶段2中，我们创建另一个image。但这次使用的是之前的图片和Nginx。

Nginx主要用于生产构建。它减小了图像的大小。

步骤4 -构建docker镜像

既然我们有了所有的文件，让我们继续创建一个图像。有两种方法可以做到这一点。如果你正在使用VS Code，有一个扩展docker。安装完成后，您可以右键单击Dockerfile并构建镜像。

但这不是一个好方法。因此，在本文中，我将使用docker命令来实现这一点。

在VS Code中打开一个终端。让我们运行下面的命令

docker build -t docker-react-image:1.0 .

Docker-react-image是镜像的名称。你可以给任何你喜欢的名字。1.0是图像的标签。

构建完成后，让我们运行

docker image ls

列出所有的图像。您应该能够看到新创建的image。

步骤5 -创建并运行带有image的容器

现在我们有了图像，让我们创建一个容器。这样我们才能访问应用程序。

为此，需要执行docker run命令。在终端中执行如下命令。

docker run -d -p 4000:80 --name react-container docker-react-image:1.0

让我们稍微讨论一下这个命令。

-d表示在后台运行容器并打印容器ID。-p用于端口映射。端口映射用于访问运行在Docker容器内的服务。我们打开一个主机端口来访问Docker容器中相应的开放端口。上面的命令启动一个httpd容器，并将主机的端口4000映射到该容器内的端口80。默认情况下，httpd服务器监听端口80。现在，我们可以使用主机上的端口4000访问应用程序-name表示容器名称。在这里你可以用任何你喜欢的名字。

最后是我们之前创建的image的名称。记住，在docker run命令中，最后一个参数必须是镜像名称。因此，当您准备好时，请继续运行该命令。创建容器后，您应该获得一个ID。

步骤6 -运行应用程序

现在我们已经创建了一个image，以及一个使用该image的容器。所以我们应该能够看到我们的应用程序正在运行。我们去localhost:4000查看一下。

Bingo 这里我们的React应用运行在docker容器上。

最终结果