我连代码都没写，却做出JSON格式化工具

什么是 Vibe Coding

Vibe Coding（中文常译作“氛围编程”或“沉浸式编程”）这一术语的提出者是 OpenAI 联合创始人、计算机科学家安德烈·卡帕西（Andrej Karpathy）。其来源可追溯至他在2025年2月于社交媒体平台X上发布的一条动态，这条动态目前累计阅读已经超过500万。

译文：有一种我称之为“氛围编程”（vibe coding）的新式编程方式，你完全沉浸在氛围中，拥抱技术的指数级进步，甚至忘记代码的存在。这之所以成为可能，是因为大语言模型（比如Cursor Composer搭配Sonnet）已经变得太强大了。而且我直接用SuperWhisper和Composer对话，几乎不用碰键盘。我会提出最懒的要求，比如“把侧边栏的内边距减半”，因为我懒得自己去找。我总是“全部接受”，不再看代码差异。遇到报错时，我直接原封不动地复制粘贴进去，通常问题就解决了。代码逐渐超出我平时的理解范围，真要搞懂得花时间仔细阅读。有时候大语言模型修不好某个bug，我就绕过去或者随便改点东西直到问题消失。对于临时性的周末小项目来说还行，但也挺有趣的。我在构建一个项目或网页应用，但这其实不算真正的编程——我只是看看东西、说说需求、运行一下、复制粘贴，然后它大多就能跑起来。

今天我们就用一个例子完全体验一下 Vibe Coding 带来的乐趣，作为开发者最常用的工具之一 JSON 格式化，今天我们就用 Vibe Coding 的方式开发一个 JSON 格式化工具。

工具选择

IDE：Cursor模型：Claude 3.7 Sonnet技术栈：Next.js

项目初始化

初始化成功

package.json

{  "name": "vibe_coding",  "version": "0.1.0",  "private": true,  "scripts": {    "dev": "next dev",    "build": "next build",    "start": "next start",    "lint": "next lint"  },  "dependencies": {    "react": "^19.0.0",    "react-dom": "^19.0.0",    "next": "15.3.3"  },  "devDependencies": {    "typescript": "^5",    "@types/node": "^20",    "@types/react": "^19",    "@types/react-dom": "^19",    "@tailwindcss/postcss": "^4",    "tailwindcss": "^4",    "eslint": "^9",    "eslint-config-next": "15.3.3",    "@eslint/eslintrc": "^3"  }}