游戏开发教育前端后端【免费下载链接】codecombatGame for learning how to code.项目地址https://gitcode.com/gh_mirrors/co/codecombat点击查看免费下载CodeCombat 是一个以游戏化编程学习为核心的多人在线编程游戏开源项目——玩家通过编写真实代码Python、JavaScript 等操控游戏角色闯关在战斗与解谜中掌握编程技能。本文以仓库根目录 README.md 为主体脉络结合 package.json、server_config.js、webpack.base.config.js、LICENSE-LEVELS.md 等仓库内源码与配置文件系统讲解 CodeCombat 的项目定位、仓库结构、本地开发环境搭建、双产品构建架构、代码执行引擎 Aether、开源许可边界以及 Partner API 数据集成方式帮助开发者快速上手这套教学游戏 社区开源的完整工程。项目定位一个同时是创业公司与社区项目的开源编程游戏README 对 CodeCombat 的官方定义是A multiplayer programming game for learning how to code一款用于学习编程的多人在线编程游戏。它的独特之处在于双重身份游戏产品玩家不是在抽象编辑器里做练习题而是在真实游戏场景中编写代码驱动角色行动游戏内积木块Blockly与代码模式Ace 编辑器并存适合从零基础到进阶的各类学习者开源社区项目代码完全开源任何人都可以 fork、本地运行、参与开发。项目方在 README 中号召开发者加入教会全世界编程的使命称贡献者的工作将展示给数以百万计的玩家此为 README 中的项目方表述。仓库中还保留了完整的本地化体系app/locale 下 60 余种语言的*.js文件、课程内容app/views/courses、app/templates/courses、AI 相关模块app/views/ai以及另一条产品线 Ozariaozaria 目录是一个工程规模相当可观的真实生产级项目。仓库顶层结构与技术栈速览从仓库根目录可以快速建立对工程的整体认知路径作用app前端主应用app.js为 webpack 入口core/为框架核心Router、application、constants 等views/、templates/、styles/分别存放视图、Pug 模板与 Sass 样式ozaria第二个产品线 Ozaria面向低龄用户的剧情化编程课程的独立站点与引擎代码scripts各类辅助脚本i18n 同步copy-i18n-tags.js、关卡生成generateLevels.js、产品差异分析find-coco-ozar-diffs.mjs等test应用级测试collections、components、core、views 等目录的 Jasmine/Karma 测试specAether 代码执行引擎的专项测试aether_spec.js、python_spec.js、java_spec.js 等server.js / server_config.jsExpress 服务端入口与集中配置webpack.base.config.js前端构建主配置dev/production 配置的父级Makefile常用开发/构建/i18n 任务的快捷入口从 package.json 的依赖清单可以推断前端技术栈以Backbone Vue 22.7.10 CoffeeScript为主体backbone ~1.1.1、vue 2.7.10、coffee-script 1.9.3同时大量使用 webpack 5 处理.coffee、.pug、.sass、.vue等混合资源游戏渲染采用 Phaserphaser ^3.90.0代码编辑采用 Aceace-builds与 Blocklyblockly 10.3.0双编辑器。服务端为 Express并声明了明确的运行环境要求engines: { node: 22.22.1, npm: 10.9.4 }入口文件 index.js 在启动时会先检查 Node 主版本号低于 v14 直接报错退出低于 v14 打印升级警告随后注册coffee-script加载器根据COCO_PRODUCT环境变量选择产品后缀coco或ozar最终调用 server.js 中的startServer()创建 Express 应用并监听端口。本地开发环境搭建与常用脚本README 将完整的开发环境搭建教程指向项目维护的Archmage开发者wiki仓库侧则以 package.json 的scripts字段和 Makefile 提供了可直接执行的任务入口。以下命令均以仓库根目录为工作目录执行。环境准备Node.js版本要求见上文engines建议 22.xnpm 10.9.4 或以上依赖安装npm install会触发postinstall中的patch-package应用仓库内 patches 目录的补丁如 Blockly 相关补丁此外项目还依赖 Bower 组件bower install由npm run build与npm run pre-build编排。常用 npm 脚本命令作用npm start以node ./index.js启动生产/常规服务器npm run devwebpack watch 模式持续构建前端CodeCombat 产品配合代理服务器热开发npm run dev:ozaria以COCO_PRODUCTozaria运行 Ozaria 产品的 watch 构建npm run proxy以COCO_PROXYtrue运行 nodemon 代理开发服务器默认端口 3000npm run proxy:ozariaOzaria 代理开发服务器COCO_PRODUCTozaria COCO_PORT3001npm run build完整生产构建bower install 构建 Aethersetup-aether.js webpack 打包npm run build-aether单独构建 Aether 代码执行引擎node setup-aether.jsnpm test先 webpack 构建再跑 Karma 单测--single-runnpm run lintESLint 全量检查--max-warnings 0Makefile 快捷目标Makefile 将上述任务收敛为记忆成本更低的入口执行make help可列出全部目标make dev/make dev-ozariawebpack watch 构建make proxy/make proxy-ozaria本地代理开发服务器CodeCombat 端口 3000Ozaria 端口 3001make build完整生产构建bower aether webpackmake copy-i18n/make check-i18n/make generate-rot13i18n 结构同步、超长翻译检查、ROT13 调试语言生成make generate-levels测试关卡生成算法可传ARGS--dry --debugmake build-aether构建 Aether 引擎。服务端配置要点server_config.js 是服务端所有可调参数的集中地开发时常用环境变量包括COCO_PRODUCT产品选择codecombat或ozaria决定productName与productMainDomainCOCO_PORT或COCO_NODE_PORT、PORT监听端口默认3000单测模式下自动 1COCO_MAIN_HOSTNAME/COCO_UNSAFE_CONTENT_HOSTNAME主站与不安全 web-dev iframe 内容的主机名默认localhost:3000COCO_COOKIE_SECRETCookie 签名密钥默认chips ahoy仅开发环境COCO_CHINA_INFRASTRUCTURE中国区基础设施开关与config.chinaDomain配合COCO_FORCE_COMPRESSION开启服务端 gzip 压缩生产环境由 CloudFlare 负责压缩因此该开关仅用于开发环境测量响应体积COCO_SECRETS_JSON_BUNDLE以 JSON 批量注入环境变量用于密钥分发。从 server.js 源码可见服务启动流程为createAndConfigureApp()创建 Express 实例 → 若开启压缩则挂载compression()→ 调用 server_setup.js 的setExpressConfigurationOptions与setupMiddleware配置中间件 →http.createServer(app).listen(app.get(port))。双产品构建架构CodeCombat 与 Ozaria 共用一套工程这是本仓库最具特色的工程实践之一同一个代码仓库同时构建 CodeCombat 与 Ozaria 两个产品。机制核心是COCO_PRODUCT环境变量development/utils.js 将产品映射为后缀codecombat → coco、ozaria → ozar并据此推导输出目录public_coco/public_ozarindex.js 与 webpack.base.config.js 均注册require.extensions[.coco.coffee]/.ozar.coffee之类的扩展名映射使得foo.coco.bar、foo.ozar.bar形式的文件能被正确加载webpack 配置中的ProductResolverPlugin在解析阶段把.import.sass等资源按产品后缀重写实现一套源码按产品差异化编译入口 app/app.js 与 app/vendor.js 在 webpackentry中被声明输出到javascripts/[name].jsworld入口则聚合 app/lib/world 下的全部文件用于 Worker 线程执行游戏世界逻辑webpack.config.js 会根据环境自动选择子配置COCO_TRAVIS_TEST→ karma 配置、BRUNCH_ENVproduction→ 生产配置、COCO_ANALYZER_BUNDLE→ 包体积分析配置、DEV_CONTAINER→ 容器开发配置否则默认开发配置。前端还通过DefinePlugin注入COCO_PRODUCT与SHA_TAG来自GIT_SHA或devCompileStaticTemplatesPlugincompile-static-templates.js负责把静态 Pug 模板预编译Sass 编译时注入$is-codecombat变量以区分产品的样式变量。核心执行引擎Aether游戏代码即玩法的核心在于一个名为Aether的代码执行引擎app/lib/aether/aether.coffee。它负责把玩家提交的代码在安全沙箱中解析、校验并执行基于 Esprima 解析器对 JavaScript 代码做静态分析Aether 类通过optionsValidatorapp/lib/aether/validators/options.coffee校验构造参数参数非法会直接抛出错误支持多语言app/lib/aether/languages/下包含 9 个语言插件结合 setup-aether.js 中从esper.js拷贝的lua、python、coffeescript含-modern变体语言插件以及 Java/C 插件实现跨语言代码的沙箱执行构建方式独立setup-aether.js以独立的 webpack 配置把aether与html两个入口打包到bower_components/aether/build/再将语言插件拷贝到public_*/javascripts/app/vendor/aether-*.js由浏览器与 Service Worker 在运行时动态加载测试覆盖仓库 spec/aether 下含javascript_spec.js、python_spec.js、java_spec.js、lua_spec.js、cs_spec.js、es6_spec.js、problem_spec.js等覆盖多语言解析、报错、执行流与代码问题检测等维度。开源许可与关卡授权边界README 明确了项目的开源属性与边界这在自托管时至关重要代码采用 MIT 协议美术与音乐素材采用 Creative Commons 4.0 BY署名协议关卡Levels不开放源码。仓库内的 LICENSE-LEVELS.md 是一份中英双语的正式声明CodeCombat Inc. 保留关卡的全部权利关卡不公开、不允许在其它服务器上使用若想运营公开的 CodeCombat 服务器必须自己创建关卡同时还应更换品牌、地址、团队与法律页面等配置并对 CC-BY 素材署名。因此自托管 / 二次开发时的合规要点是网站代码可以基于 MIT 协议自由修改分发美术音效需按 CC-BY 署名但千万不要打包或转载 codecombat.com 的关卡内容。参与贡献六种角色与 CLACONTRIBUTING.md 将贡献者分为六种角色分别对应不同的协作方式Archmage法师代码贡献者负责修 Bug、加功能Artisan工匠关卡搭建者使用编辑器制作游戏关卡Adventurer冒险者关卡试玩测试者反馈玩法体验Scribe书记官文章/文档编辑者Diplomat外交官翻译者参与 app/locale 的多语言本地化Ambassador大使社区支持与推广。提交 Pull Request 前所有贡献者都必须签署贡献者许可协议CLAREADME 与 CONTRIBUTING.md 均有强调。该协议仅授予项目方非独占的使用许可并确认贡献者有权提交其代码用于保护双方权益。社区沟通渠道在 README 中有明确说明包括 Reddit 上的 CodeCombat 社区、项目的 issue tracker问题追踪以及官方开发者聊天室Slack团队欢迎从新手到专家的各类开发者参与。Partner API 与用户数据集成README 提供了两类数据接入方式适合教育机构、集成方与个人开发者Partner API面向有正式合作需求的机构提供SSO 单点登录、用户管理、学习进度数据等能力的完整 API需要向项目方申请 client credentials 客户端凭据并配套官方 SDK。极简公开端点最简单的数据集成方式是直接请求用户进度接口例如访问形如https://codecombat.com/db/user/{用户名或ID}的端点即可获得指定用户的进度统计 JSON 数据。README 提到外部工具 Beeminder 正是利用该接口帮助用户把学习编程绑定为可跟踪的目标如每日坚持打卡。这类公开只读进度接口 需要凭据的 Partner API的分层设计让社区小工具可以低成本接入同时为深度集成的机构保留完整的账户与数据管理能力。小结从 README.md 出发可以清晰看到 CodeCombat 的三条主线游戏化编程学习产品多人在线、真实代码驱动、社区开源工程MIT CC-BY、双产品单仓库、Aether 沙箱执行引擎、覆盖 60 余种语言的本地化以及开放数据接口Partner API 与公开用户进度端点。无论是想体验用代码玩游戏的玩家、希望本地搭建或二次开发的工程师还是计划接入学习数据的集成方都能在这套开源工程中找到明确的切入点——动手前请务必确认 LICENSE-LEVELS.md 关于关卡内容的授权边界。赞分享游戏开发教育前端后端【免费下载链接】codecombatGame for learning how to code.项目地址https://gitcode.com/gh_mirrors/co/codecombat点击查看免费下载相关推荐如何快速开发HTML5多人游戏BrowserQuest开源项目实战指南如何快速开发HTML5多人游戏BrowserQuest开源项目实战指南 BrowserQuest是一个基于HTML5和JavaScript的多人游戏实验项目游戏开发后端前端BrowserQuest开源贡献完全指南如何快速参与HTML5多人游戏开发BrowserQuest开源贡献完全指南如何快速参与HTML5多人游戏开发 BrowserQuest是一款基于HTML5和JavaScript的多人在线游戏实游戏开发后端前端CodeCombat开源游戏编程学习平台完全指南CodeCombat开源游戏编程学习平台完全指南 CodeCombat是一个革命性的多人在线编程学习游戏通过游戏化的方式让编程学习变得简单有趣。这个完全开源的游戏开发教育前端后端上一篇体验WordPress中最完美的Markdown编辑器WP-Editor.md下一篇终极AI图像修复工具IOPaint Windows快速上手完整指南创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
