字节MarsCode支持DeepSeek啦，深度思考过程教我学编程，AI做到了授人以渔

推荐语

AI辅助编程时代来临，字节跳动MarsCode携手DeepSeek，让你的编程更高效。

核心内容：
1. MarsCode集成DeepSeek，编程工具新升级
2. 详细安装指南，快速上手MarsCode
3. 利用AI挑战Canvas动画，3D魔方项目实操演示

杨芳贤

53A创始人/腾讯云(TVP)最具价值专家

现在各个应用都在接入DeepSeek，编程工具中也不能漏掉，MarsCode在2月20号已经接入了DeepSeek，是时候体验一把了。

安装MarsCode

如果你还没有使用MarsCode，安装过程也介绍下，以Visual Studio Code中为例，打开VSCode扩展窗口，在搜索窗口搜索MarsCode，找到MarsCode 插件单击「install」，完成安装，登录即可使用MarsCode 编程助手，点击侧边栏MarsCode图标即可打开跟MarsCode的聊天窗口进行AI对话。

VSCode下载地址：https://code.visualstudio.com/Download　

JetBrains 下载地址：https://www.jetbrains.com.cn/　

挑战生成Canvas动画

之前看到过很多网站有很漂亮的动画，发现是通过Canvas来写的，不过一直没时间仔细研究，现在有了AI辅助编程，感觉可以挑战起来。　

本次挑战的是使用Canvas画一个转动的3D魔方，因为魔方有6个面可以代表很多不同的属性，可以和最近研究的AI应用卓越架构框架搭配起来，因为也正好是6个维度。我们使用MarsCode接入的DeepSeek R1看看能带来哪些惊艳的效果。　

先来看下最终效果吧，我们再一步步实现出来。　

生成代码之前先写需求文档

打开Visual Studio Code，如果已经安装了MarsCode插件可以在右下角切换支持的模型，已经覆盖了DeepSeek R1和V3两个版本。　

还是老样子，先把自己的需求写到r.md文档中，方便MarsCode理解完整需求来编写代码。　

// r.md
## 页面说明
1. 借鉴AWS Well-Architected Framework，整理成了企业级AI应用中的卓越架构框架，生成一个动态介绍网站。
2. 页面使用Canvas来绘制一个三阶魔方，魔方6个面分别代表不同的架构维度，并且可交互展示信息。
3. 3D魔方需要能转动扭转，并且每个面点开后有详细信息。
4. 6个架构维度为：合理部署、业务持续、性能效率、安全合规、成本优化、持续运营。

## 技术栈
1. 使用HTML+JQuery。
2. 数据保存在本地即可，暂时不需要数据库。

## 风格说明
1. 使用tailwind CSS样式。
2. 增强互动交互能力。

指定上下文，MarsCode支持这3种

在Visual Studio Code中可以选择根据不同文档来生成代码，这是一个很贴心的小细节，这样我们可以选择Code、Files、Workspace等多种上下文数据了，自行选择代码片段或者多个文件，也可以把整个工作空间丢过来作为上下文，不需要移动鼠标就直接选择文件，太方便了。　

深度思考过程，AI做到了授人以渔

这个思考过程很不错，很多时候除了想要最终代码，我还想要了解大模型是如何思考的。DeepSeek-R1可以输出代码的同时也提供解题思路。　

也就是说，我们除了让AI帮我们写代码，AI还可以成为我们的老师，教我们思路，把AI强大的思考能力用于编程逻辑思考，这比很多付费课程要有用的多。　

第一版Canvas效果

我又怎么会用Canvas呢？都不一定看得懂，更别提一点点写出来了。之前不敢想的内容，现在也敢尝试了，丢给MarsCode，不一会生成出来。　

接下来我们看看效果，哈哈，还真生成了一个魔方，每个面都配了文字，丑不丑吧，先有了再说，能看到页面对我来说已经有很大作用了。　

小步快跑方式让MarsCode继续修改

继续让MarsCode修改代码，我们把魔方和具体架构维度左右分开展示。　

// 向MarsCode发送需求
左边为魔方，右边为6个模块，并且魔方自动可以旋转

很快，左右两栏效果都改好了。这个时候发现魔方可以继续优化下，于是再提出自己的需求。还可以继续修改，增加透明质感、增加多个维度，并且鼠标点击魔方的一个面时右侧显示选中状态。当然左侧魔方是自动旋转的，也支持通过鼠标进行拖拽，拖拽旋转的功能可是MarsCode自动帮忙添加的哦，我只需要Accept就行了。　

// 向MarsCode发送需求
魔方颜色实现部分透明，实现质感、冰块感，鼠标点击魔方不显示文字、改为鼠标移动到魔方上显示文字

不务正业？让MarsCode写代码

让MarsCode帮着写写文章，哈哈，自己生成代码、自己写文章，就差配图了。不，配图也可以用上面Cavas运行的魔方图。我们只需要提需求就行了，需求详细说明也可以由MarsCode来补充完整。　

又让MarsCode使用Canvas生成了一个手绘风的架构图，画流程图也不在话下。　

更多玩法，网页版MarsCode

MarsCode支持网页版，对于企业/团队来说，也可以通过网页版IDE嵌入现有业务系统中，比如打包一个开源项目、实验环境，真正做到开箱即用，并且是支持DeepSeek模型，后续也可能会接入其他模型哦。　

使用MarsCode还可以来写文档，将自己的文档转成Markdown格式，让MarsCode来读取上下文并帮你修改、优化、评估、再反复修改。　

除了写代码、修bug、生成Canvas动画、画流程图、写文档，使用MarsCode还有哪些好玩的呢？等你来解锁。