打游戏了!解锁编程学习新姿势,极空间部署『CodeCombat』
myzbx 2025-05-15 20:02 63 浏览
打游戏了!解锁编程学习新姿势,极空间部署『CodeCombat』
哈喽小伙伴们好,我是Stark-C~
这几年的AI大火,让大家再次看到了互联网科技的神奇与魅力。考虑到今后各大行业的发展方向,编程已成为许多行业的基本技能。不管是从软件开发到数据分析,再到人工智能,掌握编程能够打开更多职业机会。
很多家长也是看中了这一点,所以在孩子很小的时候就会有意的将孩子往这方面培养,比如学习编程课程,报编程补习班。
然而对于对于绝大多数人来说,编程里的代码抽象、复杂且枯燥,看着就有一种莫名的抗拒感。
而我今天为大家分享的这个项目可谓是这部分人的救星了!它通过游戏的方式教会大家如何编程,并且通过游戏来提升开发者的技能水平。
话不多说,安排!
关于CodeCombat
CodeCombat是GitHub上最大的开源CoffeeScript(一种脚本语言,类似JavaScript)项目,构筑在几十个开源项目之上的,有上千程序员和玩家为其编写程序、测试游戏。
简单来说,它是一款闯关游戏,该款游戏的任务就是通过游戏化的方式教授编程技能。用户在游戏中扮演角色,通过编写代码来解决问题、完成任务和击败敌人,从而逐步学习编程语言。
这个项目特别适合初学者和学生,因为它结合了互动性和趣味性,使得学习编程变得更加有趣。玩家在游戏中不仅可以学习编程基础,还能面对算法、数据结构等更高级的概念。
CodeCombat部署
打开极空间的文件管理器(个人空间),在Docker目录下新建“codecombat”文件夹,然后在“codecombat”文件夹下闯将mongo,data两个子文件夹。
然后在极空间的Docker镜像仓库中搜索镜像operepo/ope-codecombat”并“下载”。
PS:因为众所周知的原因,目前国内的Docker镜像拉取已经抽风...,这个是和极空间设备无关的。如果遇到Docker镜像拉取问题,可以百度“国内可用Docker镜像加速器”获取最新加速镜像站,或者一劳永逸的搞定网络问题。
完成后在“本地镜像”中找到它,直接双击镜像开始部署容器。
【基本设置】这里,容器名称自己可以随意修改,取消勾选“启用性能限制”。
【文件夹路径】这里,手动添加以下映射关系:
- ./Docker/codecombat/data:/home/coco/codecombat/data # 冒号前面映射新建的“data”子文件夹
- ./Docker/codecombat/mongo:/home/coco/codecombat/mongo # 冒号前面映射新建的“mongo”子文件夹
【端口】这里保证本地端口不冲突即可。其它就没什么设置了,点击“应用”完成容器的创建。
完成以上之后会看到容器显示“运行中”,但是工作还未完成。
接着我们打开网址“
https://github.com/wei134102/CodeCombat”,根据提示下载dump.tar.gz这个文件。
这里给到的是迅雷云盘。这里有一个下载的小技巧,我们直接将这个文件“转存到云盘”。
然后打开极空间的“迅雷”下载,在“云盘取回”中找到我们转存的文件直接下载即可,实测可以满速,10s左右就能下载到NAS硬盘中了。
接着我们打开前面创建的“codecombat”文件夹中的“data”子文件夹,可以看到里面也有一个dump.tar.gz文件,我们直接将它删除。
然后将我们迅雷中下载的dump.tar.gz文件移动或复制到该文件夹(data)内即可。
完成以上步骤之后,我们还要点击codecombat容器下面的“SSH”进入终端。
命令选择“/bin/bash”,用户默认“root”,点“连接”。
来到SSH终端界面,依次输入以下命令:
- cd /home/coco/codecombat/data/ # 进入容器内部data文件夹
- tar -zxvf dump.tar.gz # 解压dump.tar.gz文件
接着同样是依次输入以下命令:
- cd /home/coco/codecombat/data # 进入容器内部data文件夹
- cd /home/coco # 进入容器内部coco文件夹
- ./codecombat/bin/coco-mongodb && sh start.sh # 运行mongodb数据库,然后执行start.sh脚本
等到出现上图所示的“done”标识的时候,我们就可以关闭SSH终端,这个项目才算是正式部署完成了。
CodeCombat体验
现在我们就可以通过浏览器打开【极空间本地IP:端口号】打开CodeCombat了。项目原生支持简体中文,进来之后我们先点击“注册”。
注册页面选择“注册独立账号”。
生日这里一定记得选择成人日期,建议直接1990年以前。
然后输入账号需要的邮箱、用户名,以及密码。用户名需记住,稍后会用到。
当进入这个界面的时候,就可以直接点“开玩”玩游戏了。
进来之后可以看到它其实就是解锁闯关的游戏,据说解锁貌似还要收费,我没验证,详情不明~。但是我们可以直接通过特殊操作直接免费解锁全部。
和前面一样,也是进入容器的SSH终端,依次输入以下命令:
- mongo # 打开mongo数据库
- use coco # 使用coco数据库
最后输入以下命令并回车:
- db.users.update({'name':'你设置的用户名'},{$set:{'earned.gems':9999999, permissions:["godmode","admin"]}},true,false);
再次进入游戏,可以看到所有地图均以解锁,且左下角的蓝宝石直接加到最满。
随便点击一个地图就能直接开始玩了,还有声音哈~
具体的玩法我目前刚开始,基本啥也不会。以下是我摘录的玩法,仅供参考:
- CodeCombat是一款即时战略游戏。每关都会有对话讲解如何操作(遗憾没有中文)左侧是游戏界面,右侧是代码界面,通过在右侧输入关键语句代码,控制左侧角色的移动和攻击等动作。
- 前几关非常简单,几行“上下左右”和“攻击”的代码即可完成通关。每关结束后都有个回顾,告诉你在上一关学到了什么。当输入错误,比如大小写错误,在代码下方会提示具体的出错信息,玩家可以据此Debug。
- 第二关中,你要先去右边吃蘑菇变强,再去击杀怪物。(点击图片查看具体代码,其实向右移动一步即可迟到蘑菇,代码中是两步)
- 第三关,在击杀第一个怪物后,角色的血也不多了,所以要先去下方喝药瓶。下去喝药瓶,输入代码按回车,角色就会照做。
- 第四关前N关都是编程中最基本的顺序语句,随着关数的提升,像“if…else,then”等判断、循环语句也会逐渐加入,可玩性越来越高。玩家在不知不觉也就具备了编程思维。
最后
今天的这个项目还是非常不错的,整体来看,它通过寓教于乐的方式,大大降低了编程学习的门槛,鼓励更多人参与到编程的世界中来。项目部署步骤还是挺多的,主要是因为考虑到很多新手小伙伴,我并没有落下任何一步。只要大家对着抄作业,基本就能一次成功。
随着极空间不久前正式发布高性能四盘位NAS私有云Q4与随身智能魔盒T2S两款新品,极空间的产品线也是再次扩大,继续为用户带来更易用、更智能、更安全、更强大的私有云产品与智能存储解决方案。如果你近期有入手NAS的计划,不妨关注下极空间。
好了,以上就是今天给大家分享的内容,我是爱分享的Stark-C,如果今天的内容对你有帮助请记得收藏,顺便点点关注,咱们下期再见!谢谢大家~
相关推荐
- vue3和web网页直接操作微信小程序云开发数据库
-
我们开发好小程序以后,有时候需要编写一个管理后台网页对数据库进行管理,之前我们只能借助云开发自带的cms网页,但是cms网页设计的比较丑,工作量和代码量也不够,所以我们今天就来带大家实现用vue3编写...
- WebCurl:极致轻量的跨平台 HTTP 请求调试工具
-
在接口开发与测试领域,工具的轻量化、兼容性与安全性往往直接影响工作效率。WebCurl作为一款纯原生、无依赖的网页版API测试与调试工具,凭借极简架构与全场景适配能力,重新定义了接口调试工具的使...
- webapi 全流程_webapi项目
-
C#中的WebAPIMinimalApi没有控制器,普通api有控制器,MinimalApi是直达型,精简了很多中间代码,广泛适用于微服务架构MinimalApi一切都在组控制台应用程序类【Progr...
- Nodejs之MEAN栈开发(四)-- form验证及图片上传
-
这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能。开始之前需要源码同学可以先在git上fork:https://github.com/stoneniqiu/R...
- CodeSpirit.Amis.AiForm 智能表单使用指南
-
概述AiForm是CodeSpirit.Amis框架的智能表单功能,专为AI驱动的长时间处理任务设计。它自动生成一个多步骤的用户界面,包含表单输入、进度监控、日志显示和结果展示等功能。功能特点...
- 初级、中级、高级前端工程师,对于form表单实现的区别
-
在React项目中使用AntDesign(Antd)的Form组件能快速构建标准化表单,特别适合中后台系统开发。以下是结合Antd的最佳实践和分层实现方案:一、基础用法:快速搭...
- Bun v0.7 大版本发布,与 Vite 牵手来破局?
-
大家好,很高兴又见面了,我是"高级前端进阶",由我带着大家一起关注前端前沿、深入前端底层技术,大家一起进步,也欢迎大家关注、点赞、收藏、转发,您的支持是我不断创作的动力。今天给大家带来...
- 「前端」界面可视化开发框架formio.js
-
简介formio是一个前端可视化开发框架,无需写css/js就可以开发一套前端界面。直接在界面内拖拽就可以完成界面的布局及开发。数据交互也是固定的,表单校验也可以配置,功能非常强大。特性使用ES6...
- 小伙给同事爬取数据竟获取不到,竟要使用这种请求方式才能获取?
-
Http请求中FormData和RequestPayload两种参数的区别?AjaxPost请求中常用的两种的形式:formdata和requestpayload一、默认的表单方式...
- WinForm + Win32 API 自定义无边框窗口实战(工业软件必备)
-
前言随着.NET9.0AOT(Ahead-of-Time)的发布,便萌生了用代码测试AOT编译效果的想法,同时评估未来是否为NanUI开发支持AOT编译的新版本。关于NanUI项目,若大家尚未了...
- DeepSeek从入门到精通(11)——网页版、APP、API使用方式比较
-
DeepSeek提供了三种主要的使用方法:网页版、手机APP和API调用。这三种方式各有特点,适用于不同的使用场景。下面从使用方法和主要特点两方面进行比较:一、网页版使用方法:直接通过浏览器访问De...
- 初略Web API Notification 桌面通知
-
HTML5WebNotificationsAPI通知接口用于向用户配置和显示桌面通知弹窗。例如,Email邮件通知、来电提醒、聊天信息提醒或任务提醒等。关于Web开发技术中Notificat...
- 什么是API网关?——驱动数字化转型的“隐形冠军”
-
什么是API网关API网关(APIGateway)是一个服务器,位于应用程序和后端服务之间,提供了一种集中式的方式来管理API的访问。它是系统的入口点,负责接收并处理来自客户端的请求,然后将请求路由...
- .NET 7使用 Entity Framework Core 制作增删改查(CRUD) Web API 教程
-
在本文中,我们将使用EntityFrameworkCore(EFCore)实现一个.NET7WebAPICRUD示例。WebAPI是一个构建HTTP服务的框架,可以从浏览器、移动设备和...
- C# ASP.NET Core Web Api 与 MVC 模式下 body 参数传递,post 参数方式
-
在ASP.NETCore中,WebAPI和MVC模式在处理HTTP请求时,特别是POST请求,使用body参数来传递数据的方式非常相似。两者都使用模型绑定来自动将请求体中的数据映射到C#对象上。下...
- 一周热门
- 最近发表
- 标签列表
-
- HTML 简介 (30)
- HTML 响应式设计 (31)
- HTML URL 编码 (32)
- HTML Web 服务器 (31)
- HTML 表单属性 (32)
- HTML 音频 (31)
- HTML5 支持 (33)
- HTML API (36)
- HTML 总结 (32)
- HTML 全局属性 (32)
- HTML 事件 (31)
- HTML 画布 (32)
- HTTP 方法 (30)
- 键盘快捷键 (30)
- CSS 语法 (35)
- CSS 轮廓宽度 (31)
- CSS 谷歌字体 (33)
- CSS 链接 (31)
- CSS 定位 (31)
- CSS 图片库 (32)
- CSS 图像精灵 (31)
- SVG 文本 (32)
- 时钟启动 (33)
- HTML 游戏 (34)
- JS Loop For (32)