豆包Marscode体验官 - 这样看源码实在太爽了

830 阅读4分钟

字节终于发布自己的 AI 编程辅助工具,惊喜的是,还发布了对应的在线 MarsCode IDE,最重要的是,它是免费,免费,免费的!可以创建十个项目。对于我这种喜欢白嫖的人来说,太赞了,下面来看一下如何使用它提高我的效率,

了解 mascode IDE

虽然官方文档:docs.marscode.cn/get-started…,写的很清楚,但是还是要强调一下,可以把 marscode IDE 看成你买了一台不错的服务器,然后部署了在线 VSCode (但是自带 AI 服务编程能力的) 服务在你买的服务器,你可以通过游览器访问服务器地址,来使用你部署的在线 VSCode。我们系统看下它的优点

  1. 原生 AI 能力,也是我们原生 VSCode 没有的能力
  2. 随时随地,快速开始项目开发
  3. 提供的服务性能还不错,而且还是免费

登录 + 配置

我们打开:www.marscode.cn/login,然后使用 掘金或者手机号登录 image.png 登录成功后,我们参考官方文档:docs.marscode.cn/tutorials/d…,通过 URL来导入如下两个 Next.js 模版项目

  1. 博客入门模板:github.com/timlrx/tail…
  2. Next.js 14+ 模板:github.com/ixartz/Next…

进入正题,我们来通过 MarsCode IED 快速学习这两个项目

使用原生 AI 来辅助学习项目

通过 URL 创建项目后,我就立马问了 AI 这个项目是干什么的,结果真的大跌眼睛 image.png 怎么说呢,我只能说期望多大,失望多大,那没办法,只能使用魔法,将 cn 改为了 com,我们继续 对了,如果你的英文比较差,可以通过右上角,切换语言为 中文 image.png

tailwind-nextjs-starter-blog 学习

同样的问题,MarsCode 变聪明了 image.png 介绍的非常全,我们现在基本上了解了这个项目,让我们继续询问一个问题: image.png 回答的也是很好,其实我们还有很多问题需要问,例如

  1. 项目如何存储博客数据
  2. 项目如何支持代码高亮
  3. 项目如何实现 MDX 能力的 等等就不一一演示了。

ok,当我们初步了解项目后,我们现在让它帮我们启动一下项目,我们直接点击 run。如果弹出 launch.json 文件,那么我们就使用 AI 来帮我们解决启动不了的问题 image.png 我们会发现启动,终端报错,然后,我们鼠标移入终端,我们看到一个 AI fix ,点击一下,我们在右边可以看到 AI 分析,发现 没有安装依赖,我们 npm i 安装一下 image.png 然后,启动,我们能正常启动了,我们会得到一个地址,我们可以新开标签页面打开它,我们也可以在右边点击 web view image.png ok 项目启动成功了,现在我们通过几个需求来更加深入使用 MarsCode 的能力

1)修改页面底部footer 的媒体信息

我们询问 AI ,AI 直接帮我们找到了对应的文件和要修改的内容 image.png 我们在写 tailwind css 代码的时候可以右边进行插件安装 image.png 我们可以点击左上角搜索进行快速搜索文件夹,和VSCode 的 crtl + p 一样 ,很实用 image.png 我们使用同样的提问,然后找到 header 和 latest 等等地方,进行修改对应的代码为中文,改完后,我们刷新页面 image.png

2)通过 AI 快速理解项目 next.config.js

image.png 这里我们通过选中内容,然后在编辑器内进行提问,然后在右边会有对应的回答,解释的也是相当的全面

3)部署项目

我们可以直接点击部署,告诉它我们是前端项目 file_1720278665642_228.png

总结

对于 MarsCode IDE 的功能我就不总结了,大家看官方文档:docs.marscode.com/introductio…

优点,(基于 .com 服务)

1) 可以免费在线编写代码,如果网络好,体验就不错,如果网络不好,就难受了

2)AI 能力很强,能够读取全部代码,基本上问题都能准确回复

3)UI 不错,看起来不错

缺点:

1)文件操作很慢,可能是我的网络问题

2)AI fix 有时候报错的时候没有自动显示

3)下载后,有的项目会自动安装依赖,有的不会,运行文件改变,没有热更新,不知道是不是项目的问题

4)构建鸡肋,无法终止部署,而且支持最大的就是 200多兆,太少了

其实,综合看下来,我觉得优点大于缺点,它更适合需要 AI 能力的场景,如果想要更好的开发体验,对 AI 能力需求不大,还是本地编辑器更好一点

未来,我也会更多的使用,在真正的工作中尝试它,看看能不能提高我的效率,听说字节内部开发都使用了,那肯定是能提高效率的,需要更多的尝试,今天看下来,通过 AI 能力,快速上手开源项目,学习开源项目,是一个不错的场景

哦 对了是两个项目,还有一个项目,可以参考这个项目的流程,来快速上手,拜拜,下次见!