「豆包Marscode体验官」我用MarsCode IDE学Next.js

417 阅读4分钟

测试

我正在参加「豆包MarsCode初体验」征文活动。活动链接

🤐不啰嗦,先上结论:

基本合格的AI能力搭配卓越的远程开发功能,使得MarsCode IDE在特定开发环境下成为首选工具,推荐给所有开发者体验,你可能只有亲自尝试之后,才能发现它适用于哪些特定场景。

前言

本文将基于Next.js官方提供的《Learn Next.js》教程,利用MarsCode IDE构建一个简易的Dashboard,并对MarsCode IDE的关键功能进行深入探讨。

项目创建

首先,在MarsCode IDE中新建一个项目,根据教程推荐,采用命令行方式,故选择All in One模板,项目命名为nextjs-dashboard。

接着,打开并进入到该项目。

根据教程的系统要求

  • Node.js 18.17.0或更高版本。
  • 支持的操作系统:macOS、Windows(包括WSL)或Linux。

首先确认环境是否符合以上要求。

3631720585332_.pic.jpg

3641720591261_.pic.jpg

因为要求使用命令创建项目,所以要先使用终端将当前目录删除

cd ..
rm -rf nextjs-dashboard

然后,在终端中输入以下命令创建项目:

npx create-next-app@latest nextjs-dashboard --example "https://github.com/vercel/next-learn/tree/main/dashboard/starter-example" --use-pnpm

开发过程

经过一整天的努力,我终于完成了这个教程的学习,共十六章内容,前半部分在PC上操作,后半部分则通过iPad加外置键盘完成。整个学习过程相当流畅,MarsCode IDE集成的AI和远程开发功能极大地丰富了我的开发体验,给人留下了深刻的印象。

主观评价

接下来,我将从AI能力和远程开发能力两个维度,对MarsCode IDE进行详细评价。

AI能力

代码补全

在教程的第三章中,有一个练习涉及到代码补全。

3711720707274_.pic.jpg

我们通过动图来观察MarsCode的表现:

增加字体.gif

虽然看似完成了代码补全,但这是否每次都能如此表现呢?我们不妨多试几次。

补全失败.gif

显然,补全功能的触发依赖于用户的键盘操作,仅仅移动光标并不能激活补全选项,这一点还有待改进。

接下来,让我们看一个更复杂的例子:

3671720600326_.pic.jpg

如图,目前无法点击的刷新图标,我们尝试将其转换为一个按钮。 增加刷新按钮.gif

结果显示,正确的补全选项并未出现。

代码生成

我们再次回到增加字体的例子,这次关注代码生成的表现。

代码生成成功.gif

尽管出现了错误,但生成的代码基本正确。然而,一次成功并不代表总是如此,我们需要进一步测试,上点强度。

测试视频

在连续50次测试中,有6次生成的代码无法使用,2次完全正确,其余次数的表现与之前的动图类似。这说明在代码生成的准确性上还有提升的空间。

此外,我们还发现,如果用户没有在文件中选择任何代码段直接生成代码,那么生成的代码很可能是错误的,目前看来,MarsCode IDE似乎只支持对空文件或选中的代码段进行操作。

远程开发能力

开箱即用

MarsCode IDE的开箱即用功能表现出色,多种语言模板的试用体验非常好,IDE运行稳定。这一功能对新手尤其有用,可以帮助他们快速入门。想当年,不少同学因为jdk环境变量的配置问题,在大学的第一学期就选择了放弃计算机专业。

随时随地

在学习《Learn Next.js》教程的后8章时,我使用了iPad 9和外置键盘,体验相当不错,尤其是将IDE添加到桌面后,全屏显示带来了近乎原生APP的体验。

3721720708431_.pic.jpg

传统的本地开发不仅需要配置环境,还常常面临内存不足的问题。当前,16GB的内存已显不足,而MarsCode IDE仅需几百MB的内存即可运行。

总结

MarsCode IDE拥有流畅的界面和迅速增强的AI功能,为我们打开了广阔的想象空间,使得平板电脑级别的轻客户端乃至头戴式设备都可能成为开发工具。我相信,在这样的远程开发能力加持下,虽然碎片时间难以完成复杂任务,但软件开发将变得更加“敏捷”。

MarsCode IDE无疑是目前最优秀的IDE之一,非常值得尝试。