如何使用 Docker Compose 运行 OSS Wordle 克隆

了解如何使用 Docker Compose 在五分钟内运行您自己的流行 Wordle 克隆实例。您将如何部署 Wordle?

Wordle在 2021 年底发布后席卷了互联网。对于许多人来说,这仍然是一种早晨的仪式,与一杯咖啡和一天的开始完美搭配。作为一名 DevOps 工程师,除了琢磨Docker Compose文件然后沉迷于世界上最受欢迎的文字游戏之外,还有什么更好的方法来让你的头脑热起来呢?好吧,这个问题还没有定论,但本教程可以让您亲眼目睹。

为什么要编写 Docker Compose 文件?

即使在具有单个 Dockerfile 的应用程序中,Docker Compose 文件也可能是有用的资产。使用 Dockerfile 通常需要冗长的build命令run,可以将其迁移到 Compose 文件中。这样,您就不必在每个新版本上复制和粘贴复杂的命令。相反,您的整个应用程序仅使用docker compose up. 当使用具有多个 Dockerfile 的应用程序时,这甚至更有价值:您不再需要单独构建和运行每个 Dockerfile。

仍有无数应用程序已 Docker 化,但缺少 Compose 文件。在研究 Shipyard 的Docker Compose 社区聚焦系列时,我专门寻找使用 Compose 文件预打包的应用程序。这是为了强调使用 Docker Compose 可以做的一些很酷的事情,并展示 Compose 使应用程序开发变得多么容易。然而,当从头开始编写 Compose 文件时,很容易被容器网络、卷安装或正确的服务定义等方面吓倒。如果您是 Docker Compose 新手,则无需担心:您的第一个 Compose 文件的大部分内容将类似于您的 Dockerbuild和run命令。

使用 Compose 运行 Docker 化的 Wordle 克隆

GitHub 上有一个优秀的基于 React 的开源 Wordle 克隆。它有大约一百名贡献者,超过两千名用户已经分叉了它,以便在现代经典网页游戏中融入自己的风格。该存储库配备了 Dockerfile,允许您在本地计算机上的容器中运行它。

我们只需几分钟即可使用 Docker Compose 启动并运行它。

第 1 步:从 GitHub 分叉 React-Wordle

首先将React-wordle 存储库从 GitHub 分叉到本地计算机。我基于main创建了一个名为add-docker-compose 的分支,这样我就可以进行多次提交,而不会弄乱主分支的 git 日志。

该存储库提供了以下 Docker 命令来构建和运行映像:

docker build -t reactle:dev -f docker/Dockerfile .
docker run -d -p 3000:3000 --name reactle-dev reactle:dev

我们将在下一步中使用这些命令来填充 Docker Compose 文件。

第 2 步:制作撰写文件

我们可以通过添加一个简单的单服务 Docker Compose 文件来部署此存储库。打开您选择的文本编辑器或 IDE,并docker-compose.yaml在分叉应用程序的根目录中创建一个文件。

首先,让我们设置 Compose 版本并基于单个 Dockerfile 定义一个服务,我们将其称为**"reactle"**:

version: '3.8'
services:
    reactle: 

现在我们要从现有的 Dockerfile 进行构建。在此存储库中,它存储在docker 目录中,因此我们将在 Compose 定义中包含此路径。由于此应用程序所需的所有文件都立即存储在根目录中,因此我们将构建上下文设置为应用程序的根目录。

我将容器的端口设置为3000,这是开发的标准。

version: '3.8'
services:
    reactle:
        build:
            context: .
            dockerfile: docker/Dockerfile
        ports:
            - '3000:3000'

该应用程序的资源位于 Dockerfile 指定的几个目录和文件中。我们可以在 标签下列出它们的路径,以便容器可以访问它们。每个卷的格式为存储库 ( ) 内的路径,./src后跟冒号,然后是容器内相应的安装点 ( /app/src)。

version: '3.8'
services:
    reactle:
        build:
            context: .
            dockerfile: docker/Dockerfile
        ports:
            - '3000:3000'
        volumes:
            - './src:/app/src'
            - './public:/app/public'
            - './package-lock.json:/app/package-lock.json'
            - './package.json:/app/package.json'

如果我们想让这个应用程序与 Shipyard 兼容,我们只需要在 Compose 文件中再添加一个标签:

version: '3.8'
services:
    reactle:
        build:
            context: .
            dockerfile: docker/Dockerfile
        labels:
            shipyard.route: `/`
        ports:
            - '3000:3000'
        volumes:
            - './src:/app/src'
            - './public:/app/public'
            - './package-lock.json:/app/package-lock.json'
            - './package.json:/app/package.json'

现在我们已经有了:一个完整的 Docker Compose 文件,可以运行我们的 Wordle 克隆!我将使用这个新文件在react-wordle 存储库上打开一个PR。

第 3 步:运行我们的应用程序

现在我们已经完成了所有艰苦的工作,我们可以转到终端,导航到应用程序的根目录,然后运行命令docker compose up。Compose 将提供正在运行的应用程序的链接,我们可以从浏览器访问该链接。

...享受!

现在您可以利用 Docker Compose 的强大功能来管理功能齐全的 Wordle 克隆!

可能性是无限的 - 您可以根据自己的喜好自定义 Wordle,为 React-wordle 存储库做出贡献,在线托管您自己的 Wordle 变体,以及与朋友和同事分享您的创作链接。现在,您也许可以坐下来,放松一下,解决今天的 Wordle。

相关推荐
大霞上仙24 分钟前
Ubuntu系统电脑没有WiFi适配器
linux·运维·电脑
Karoku0661 小时前
【企业级分布式系统】Zabbix监控系统与部署安装
运维·服务器·数据库·redis·mysql·zabbix
为什么这亚子1 小时前
九、Go语言快速入门之map
运维·开发语言·后端·算法·云原生·golang·云计算
布值倒区什么name1 小时前
bug日常记录responded with a status of 413 (Request Entity Too Large)
运维·服务器·bug
阿尔帕兹1 小时前
构建 HTTP 服务端与 Docker 镜像:从开发到测试
网络协议·http·docker
。puppy2 小时前
HCIP--3实验- 链路聚合,VLAN间通讯,Super VLAN,MSTP,VRRPip配置,OSPF(静态路由,环回,缺省,空接口),NAT
运维·服务器
颇有几分姿色2 小时前
深入理解 Linux 内存管理:free 命令详解
linux·运维·服务器
光芒再现dev3 小时前
已解决,部署GPTSoVITS报错‘AsyncRequest‘ object has no attribute ‘_json_response_data‘
运维·python·gpt·语言模型·自然语言处理
AndyFrank3 小时前
mac crontab 不能使用问题简记
linux·运维·macos
ZHOU西口3 小时前
微服务实战系列之玩转Docker(十八)
分布式·docker·云原生·架构·数据安全·etcd·rbac