注意，这篇文章需要加入等候名单才可阅读。
起因#
有人说 2023 是 waitlist 元年，因为各种项目（主要是 AI）亮相在用户前的第一面都是要求用户干一件事情：加入等待名单（join the waitlist）。
Waitlist 是一种常见的策略，用于管理用户的访问和使用。它通常用于新产品或服务的推出，以便控制用户流量并确保系统的稳定性。这个概念更早见于大学申请中，指的是学生提交入学申请给大学，学校再在一众排队等候名单中挑选学生来录取。
Waitlist 的好处有：
但我实在很受不了这么多产品在还没准备好的情况下就急于发布，并且都让大家加入 waitlist。这可以理解，但非常滑稽。
所以「我」随手做了一个嘲讽网站：JoinTheWaitlist。
没错，整个网站就一个按钮：JOIN THE WAITLIST。这是一个「等候名单」的网站，加入等候名单，你就可以排队等候以加入等候名单了。
然后「我」发了一条推文：
不难看出，推文内容本身（如哗众取宠的 emoji 和文风）也非常经典和嘲讽。这归功于 GPT-4：
而写这条推文是 GPT-4 为我的这个项目做的最后一件事。在此之前，它只花了一个小时，就帮我完成了几乎整个项目的代码编写。
什么！？几乎全是 GPT-4 帮忙写的？是的。因为这个想法在我填了又一个 waitlist 后冲上了我的脑子，但我实在懒得花时间写代码。这时，我突然想起推特上大家总是说 GPT-4 强到直接给你写项目。我便疑惑真的有这么神奇吗？于是抱着实验性的目的，拿这个项目试试 GPT。
结果非常成功。
这就是为什么我刚刚说「我」的时候要加引号。
那这一切是怎么完成的呢？
第零步：创建项目#
我使用了 Next.js (React) 来开发项目，直接用了一个脚手架。耗时十秒。此部分略过。
如果你是编程零基础，你可以问问 GPT 如何创建一个前端项目，相信也是小菜一碟。
第一步：打字口号（Typing Slogans）#
想几个口号#
面对空白项目，我大概在脑海中想了一下布局。最上面首先需要一个大大的 slogan 区域来不断打字，说「Waitlist can help you....」。
有哪些 slogans 呢？问问 GPT 吧：
很好，十分讽刺。我只字未改，复制过来放在了我的项目中。
打字效果#
接下来，询问如何在 React 中实现打字效果：
它甚至直接告诉了我可以用 typeit-react，还直接写出了使用代码。我不需要去查有什么库可以用，这个库该怎么用。
但中间的 instance 语句比较繁琐，我问了一下能不能简写：
我只轻描淡写地给了个指示，它不光写了，还解释了。它真的，我哭死。😭😭😭
停止感动。立马复制过来！
闪动光标#
接下来，我还想要在末尾加一个一直闪动的打字光标。这种小任务，我选择直接让 Copilot 帮我写：
如图所示，我所做的事情：
- 写了一句注释，告诉 Copilot 接下来的代码是做什么的（即一个有动画的闪动光标，和文字高度一样）。
- 换行。Copilot 提示这一行可以这样写。
- 回车确认。
- 换行。Copilot 提示这一行可以这样写。
- 回车确认。
- 换行。Copilot 提示这一行可以这样写。
- 回车确认。
- 「写」完了……
我要认罪：这真的是大部分时候我的工作日常，我就负责写注释和疯狂换行回车，Copilot 写代码。另外记得最后别忘了删掉注释，不留痕迹，破坏作案现场。
成果：
第二步：酷炫按钮#
既然是 Waitlist，那当然需要一个大大的按钮来点击加入。我希望这个按钮非常酷炫。让我问问 GPT：
现在请为我编写一个非常闪亮的按钮，具有终极动画效果，例如悬停、点击、发光、动画、过渡、渐变等。让每个人都想要点击它！展示给我 CSS 代码。
我承认我不是一个好的 prompt engineer，但它还是帮我写出来了。
需要注意的是，网页端的 ChatGPT 回复如果过长会戛然而止。不要慌，输入「continue」或者「继续」就可以了。
经过两轮 continue 后，按钮到手，效果非常出色！
但我发现按钮没有点击效果。没关系，这点小事就让 Copilot 帮忙吧 ——
看看效果：
行，差不多就这样吧！
第三步：用户评价卡片#
接下来，我希望在页面上展示一组用户评价。
现在写一些推特用户的评价，夸「JoinTheWaitlist」很棒。
再生成一些有意思的假用户名。
这时候我突然意识到，我得自己把评论和名字一句句复制起来，并且写成代码里的数据结构，太麻烦了。于是我直接问：
用以下数据结构，帮我把这些数据混合起来。
好了，这下可以直接复制了。
哦对了，忘了直接伸手要 UI 组件的代码了：
帮我写一个 Tailwind React 组件叫 UserReviews，用推特的风格展示这些评论。
复制过来，看看效果：
最终效果的形成另外还借助了一些 Copilot 的力量。以及头像使用了 Pravatar 的随机生成服务。
简直太完美了。
第四步：加上 Rick Roll#
其他的一些实现这里就略过不讨论了，因为大相径庭 —— 问它，它给你，你复制粘贴。
这里想提一个比较有意思是：我想实现的一个效果是，点击 JOIN THE WAITLIST 按钮后，会跳转到 YouTube 的 Rick Roll 视频。
我抱着试一试的心态，打下了 https://yout，然后：
Copilot 提示了一个视频链接。
我心想不会吧……
接着我把视频链接打开一看 —— https://youtu.be/dQw4w9WgXcQ。
这个 moment 让我觉得非常欢乐。
第五步：部署上线#
最后小手一点，代码推送到了 GitHub，并借助 Vercel 的自动部署服务。JoinTheWaitlist 花了一分钟部署上线了。
第六步：发条推特#
如开头所示，我还让 GPT 帮我做了一下 marketing。
收尾的话#
除了中间我出去吃了个饭的时间，整个过程耗时不到一小时，没有超过目前 GPT-4 网页版的 25 条 / 3 小时限制。很多问题的回答基本是一击就中，不需要额外修改和追问！而且我并没有非常仔细地斟酌我的 prompt，而是简单随意地跟它对话。
做完之后，我回想了一下整件事情，我在其中的参与主要有以下部分
- 提出想法
- 写 prompts 给 GPT
- 复制粘贴
- 让 Copilot 帮润色修改，帮写一些小功能 / 模板代码
- 保存代码，推送代码，部署代码
我在其中原创了任何东西吗？🤔
我这么多年代码经验给我带来的除了经验还有什么？🤔
以后的产品开发又会是怎样的？🤔
……
合上电脑，我思绪万千，愁断了肠。
正在感叹之时，我突然猛然一惊 ——
Oh shit！