面向前端开发人员的 Docker

2025-05-24

面向前端开发人员的 Docker

这是 docker 的简短指南，对前端开发人员很有用。

为什么要使用docker？

很久以前，当业务需要其他应用程序时，DevOps 团队会去购买服务器，却不知道新应用程序的性能要求。这会涉及大量的猜测，并浪费本可用于其他应用程序的资金和资源。

虚拟机（VM）的出现，让我们能够在同一台服务器上运行多个应用程序。但这也有一个缺点。每个虚拟机都需要完整的操作系统才能运行。每个操作系统都需要 CPU、内存等资源才能运行，还需要补丁和许可，这反过来又增加了成本和弹性。

谷歌很早就开始使用容器模型来解决虚拟机模型的缺点。容器模型的本质是，同一主机上的多个容器共享同一主机资源，从而释放 CPU 和 RAM 资源，供其他用途使用。

但它如何帮助我们开发人员？

它确保所有开发人员和所有服务器的工作环境都是相同的，即生产、准备和测试

任何人都可以在几秒钟内设置项目，无需混乱配置、安装库、设置依赖项等。

简单来说，docker 是一个使我们能够使用容器开发、部署和运行应用程序的平台。

让我们退一步来看，容器系统在物理上是什么样子的，以及它与虚拟机有何不同。

1.1 VM与docker的区别

1.1 VM和docker的区别。

如您所见，主机及其资源在容器中共享，但不在虚拟机中共享。

解决了这个问题之后，我们就开始吧。

如何使用docker？

为此，我们需要熟悉某些术语。

1.2 Docker 镜像和 Docker 容器的可视化

1.2 Docker 镜像和 Docker 容器的可视化

Docker 镜像：它是一个可执行文件，包含精简的操作系统以及运行应用程序所需的所有库和配置。它由多个层级结构堆叠而成，并以单个对象的形式呈现。Docker 镜像是使用docker file创建的，我们稍后会讲到。

Docker 容器：它是 docker 镜像的一个运行实例。同一个 docker 镜像可以运行多个容器。

将简单的 Node.js 应用容器化

我们将尝试将非常简单的 node.js 应用程序容器化，并创建一个图像：

您的 Node.js 应用

让我们从创建文件夹开始my-node-app ，

mkdir my-node-app  
cd my-node-app
Enter fullscreen mode Exit fullscreen mode

让我们创建一个简单的节点服务器index.js并在其中添加以下代码：

//Load express module with `require` directive

var express = require('express')

var app = express()

//Define request response in root URL (/)  
app.get('/', function (req, res) {  
 res.send('Hello World!')  
})

//Launch listening server on port 8081  
app.listen(8081, function () {  
  console.log('app listening on port 8081!')  
})
Enter fullscreen mode Exit fullscreen mode

并将此文件保存到您的my-node-app文件夹中。

现在我们创建一个package.json文件并在其中添加以下代码：

 {

    "name": "helloworld",  
    "version": "1.0.0",  
    "description": "Dockerized node.js app",  
    "main": "index.js",  
    "author": "",  
    "license": "ISC",  
    "dependencies": {  
      "express": "^4.16.4"  
    }

 }
Enter fullscreen mode Exit fullscreen mode

此时，您不需要在主机中安装 express 或 npm，因为记住 dockerfile 会处理设置所有依赖项、lib 和配置。

DockerFile

让我们创建 dockerfile 并将其保存在我们的 中my-node-app folder。此文件没有扩展名，名为Dockerfile 。让我们继续将以下代码添加到我们的 dockerfile 中。

    # Dockerfile  
    FROM node:8  
    WORKDIR /app  
    COPY package.json /app  
    RUN npm install  
    COPY . /app  
    EXPOSE 8081  
    CMD node index.js
Enter fullscreen mode Exit fullscreen mode

现在我们在这里做的事情是：

FROM node:8 — 从 docker hub 拉取 node.js docker 镜像，可在此处找到https://hub.docker.com/_/node/

WORKDIR /app-这为我们在图像中的代码设置了工作目录，它被所有后续命令使用，例如COPY ，RUN和CMD

COPY package.json /app-这会将我们的 package.json 从主机my-node-app文件夹复制到文件夹中的图像/app。

RUN npm install — 我们在镜像中运行此命令来为我们的应用程序安装依赖项（node_modules）。

COPY . /app — 我们告诉 docker 从 my-node-app 文件夹复制我们的文件并将其粘贴到/appdocker 镜像中。

EXPOSE 8081 — 我们使用此命令在容器上公开一个端口。为什么是这个端口？因为我们在 index.js 中的服务器监听的是 8081 端口。默认情况下，从此镜像创建的容器将忽略所有对它的请求。

构建 Docker 镜像

显示时间。打开终端，转到您的文件夹my-node-app并输入以下命令：

     # Build a image docker build -t <image-name> <relative-path-to-your-dockerfile>

    docker build -t hello-world .
Enter fullscreen mode Exit fullscreen mode

此命令在我们的主机上创建一个hello-world图像。

-t用于给我们的图像命名，这里是hello-world。

.是 docker 文件的相对路径，因为我们在文件夹中，所以my-node-app我们使用点来表示 docker 文件的路径。

您将在命令行上看到类似这样的输出：

    Sending build context to Docker daemon  4.096kB  
    Step 1/7 : FROM node:8  
     ---> 4f01e5319662  
    Step 2/7 : WORKDIR /app  
     ---> Using cache  
     ---> 5c173b2c7b76  
    Step 3/7 : COPY package.json /app  
     ---> Using cache  
     ---> ceb27a57f18e  
    Step 4/7 : RUN npm install  
     ---> Using cache  
     ---> c1baaf16812a  
    Step 5/7 : COPY . /app  
     ---> 4a770927e8e8  
    Step 6/7 : EXPOSE 8081  
     ---> Running in 2b3f11daff5e  
    Removing intermediate container 2b3f11daff5e  
     ---> 81a7ce14340a  
    Step 7/7 : CMD node index.js  
     ---> Running in 3791dd7f5149  
    Removing intermediate container 3791dd7f5149  
     ---> c80301fa07b2  
    Successfully built c80301fa07b2  
    Successfully tagged hello-world:latest
Enter fullscreen mode Exit fullscreen mode

如你所见，它运行了 Docker 文件中的步骤并输出了一个 Docker 镜像。第一次尝试时可能需要几分钟，但下次使用时它将开始使用缓存，构建速度会更快，输出结果将如上所示。现在，在终端中尝试以下命令，看看你的镜像是否存在：

    # Get a list of images on your host 
    docker images
Enter fullscreen mode Exit fullscreen mode

它应该有一个主机中的图像列表。像这样

    REPOSITORY    TAG      IMAGE ID      CREATED         SIZE  
    hello-world   latest   c80301fa07b2  22 minutes ago  896MB
Enter fullscreen mode Exit fullscreen mode

运行 Docker 容器

创建图像后，我们可以从该图像启动一个容器。

    # Default command for this is docker container run <image-name>  
    docker container run -p 4000:8081  hello-world
Enter fullscreen mode Exit fullscreen mode

该命令用于创建并运行docker容器。

-p 4000:8081— 这是发布标志，它将主机端口 4000 映射到容器端口 8081，该端口是我们通过 dockerfile 中的 Expose 命令打开的。现在，所有对主机端口 4000 的请求都将被容器端口 8081 监听。

hello-world — 这是我们之前运行 docker-build 命令时为图像指定的名称。

您将收到如下输出：

    app listening on port 8081!
Enter fullscreen mode Exit fullscreen mode

如果你想进入你的容器并在其中安装一个 bash 终端，你可以运行

    # Enter the container
    docker exec -ti <container id> /bin/bash
Enter fullscreen mode Exit fullscreen mode

为了检查容器是否正在运行，请打开另一个终端并输入

    docker ps
Enter fullscreen mode Exit fullscreen mode

您应该看到正在运行的容器如下所示

     CONTAINER ID    IMAGE        COMMAND                  CREATED    
    `<container id>`  hello-world  "/bin/sh -c 'node in…"   11 seconds ago

    STATUS              PORTS                    NAMES  
    Up 11 seconds       0.0.0.0:4000->8081/tcp   some-random-name
Enter fullscreen mode Exit fullscreen mode

这意味着我们的容器（其 id 是<container id>从 hello-world 镜像创建的）已启动并运行，并且正在监听端口 8081。

现在，我们的小型 Node.js 应用已经完全容器化了。你可以在浏览器上运行http://localhost:4000/ ，应该会看到类似这样的内容：

1.3 容器化的 Node.js 应用

1.3 容器化的 Node.js 应用

瞧，您已经将您的第一个应用程序容器化了。

文章来源：https://dev.to/akanksha_9560/docker-for-frontend-developers-1dk5
Devto 翻译
PREV
一行代码 - 使用 CSS 的暗黑模式
NEXT
🚀 设置 Ollama 并在本地运行 DeepSeek R1，构建强大的 RAG 系统