Tutorials on stackzeng

我把所有出海文章，都变成了一个可以随时提问的知识库

Sat, 07 Feb 2026 00:00:00 +0000

前段时间，飞书上线了「问问知识库」功能，核心能力是：

基于已有知识库内容进行问答，整体体验上有点类似 NotebookLM。

在看到这个功能时，我第一反应是：

这对长期做内容沉淀的人来说，实在太合适了。

在此之前，我已经在飞书中创建了AI 出海星球知识库，主要用于将我过往写过的出海相关文章进行系统化归档和沉淀。

这些内容分散在不同时间节点，有的是方法论，有的是工具介绍，也有的是阶段性判断。

但问题也逐渐暴露：

文章一多，时间一久，知识只是存储，却很少再被真正使用。

尤其是一些几个月、甚至一年前写的内容，如果不是刚好碰到相关场景，很多细节连我自己都会慢慢遗忘。

想要重新找某个观点，往往要翻半天目录，效率并不高。

而「问问知识库」的出现，刚好解决了这个问题。

通过自然语言提问，就可以直接基于已有文章进行快速检索和总结，相当于把原本静态存档的内容，变成了一个可以随时对话的知识助手。

比如：

想快速回顾某个出海方向的核心判断
想查某篇旧文章里提到过的工具或方法
想在写新内容时，快速调取过去的思路

都可以直接问，而不是再去翻资料。

对我来说，这个功能最大的价值在于提效。

它让长期积累下来的内容，变成了：

👉 随时可被调用、可被复用、可被激活的能力。

这也是为什么我个人非常喜欢这个功能的原因。

它真正放大了长期写作 + 知识沉淀的复利效应。

下面是 AI 出海星球知识库的问答界面示例👇

如果你也对 AI 出海、工具、趋势和实践经验感兴趣，可以直接体验这个知识库，手机浏览器貌似无法正常访问，只能在电脑端访问。

👉 知识库问答地址：问问知识库

Claude 频繁封号？一种更稳定的使用方式分享

Tue, 24 Mar 2026 00:00:00 +0000

目前使用 Claude Code 存在一个较为普遍的问题：账号容易被封禁，即使付费订阅，也无法完全避免这一风险。

一种更稳定的方式是：通过 Google 的 Antigravity IDE 使用 Claude 模型。

Antigravity IDE 内置了 Sonnet 4.6 Thinking 和 Opus 4.6 Thinking，并且目前提供一定的免费额度。

同时，Claude 与 Google Gemini 的额度是分开的，当 Claude 配额用完后，可以无缝切换到 Gemini 继续使用，提高整体可用性。

在模型选择上：

Sonnet 适合作为日常默认模型，具备较强的推理能力、稳定的编程表现，以及更快的响应速度和更高的性价比。

Opus 更适合复杂任务，例如大型代码库重构、高复杂度分析、长上下文处理，以及深度链式推理。

两者均属于当前较新的推理模型，覆盖从日常到高阶的大部分使用场景。

在稳定性方面，Antigravity 中的 Claude 服务是通过 Google 作为企业代理提供的 API 接入。

相比个人直接使用 Claude，依托 Google 账号体系（如 Gmail、Google Docs、Google Play 等），整体账号稳定性通常更高，风险相对更低。

原因在于，Google 账号本身承载了邮箱、文档、应用分发等多项核心服务。

一旦账号被封，影响的不只是单一产品，而是整个账号生态。

因此，这类封禁操作的决策成本更高，平台在处理时通常会更加审慎。

一个平台接入图片、视频、音乐、对话模型：KIE AI 体验与接入指南

Sat, 21 Mar 2026 00:00:00 +0000

如果你最近在做 AI 产品，应该会很快发现一个现实问题：模型越来越多，但接入也越来越碎片化。

做图片要找一个平台，做视频要接另一个平台，音乐、对话、计费、回调、鉴权又各有一套。

接入各家模型很费精力。

KIE AI 做的事情，就是把这些常见的 AI 能力聚合到一个平台里，让接入变得更简单。

提供了哪些模型

KIE 提供了 Video、Image、Music、Chat 对应的 API，基本覆盖了日常项目开发需要。

不管你是做图片生成、视频生成，还是聊天类、内容类工具，都可以在一个平台里统一接入，省去分别寻找和对接多个模型平台的成本。

价格

KIE 采用积分计价模式，1 积分 = 0.005 USD。

以图片生成为例，Nano Banana 2 生成一张 1K 图片，大概花费 0.04 USD。

这种按量付费的方式，对前期测试产品、估算成本会更方便一些，也更适合独立开发者小步试错。

如何接入？

注册

访问官网并注册用户：

KIE AI

生成密钥

进入后台后，先创建 API Key。

创建完成后，可以针对密钥增加一些风控限制，比如：

每小时调用上限
每日调用上限
总积分限制

这样可以避免密钥泄露后被滥用，也能更好控制成本。

调用接口

接下来可以直接用 Postman 测试接口。

请求地址：

https://api.kie.ai/api/v1/jobs/createTask

请求头：

Authorization: Bearer <token>

请求体示例：

{
"model": "nano-banana-2",
"callBackUrl": "https://your-domain.com/api/callback",
"input": {
"prompt": "一幅高度细致的插画：香蕉造型的未来飞船在夜晚的霓虹城市上空飞行，光影真实、具有电影感效果、4K 质量。",
"aspect_ratio": "auto",
"resolution": "2K",
"output_format": "jpg",
"image_input": []
}
}

请求成功后，会返回一个 taskId，后续可以通过它查询任务进度。

OpenClaw 很火，但我更想要权限可控：实测腾讯 OpenClaw 接入飞书全流程

Wed, 11 Mar 2026 00:00:00 +0000

最近 OpenClaw 爆火，不少人都在尝试用它让 AI 直接接管电脑执行任务。

OpenClaw 默认把整台电脑的访问权限都开放给 AI，虽然省事，但安全隐患也会随之增加。

相比之下，腾讯推出的 claw 提供了 workspace 机制，可以只授权指定文件夹，而不是直接放开整机权限。

这种方式明显更可控，用起来也更放心。

所以这次，我就实际安装体验了一下。

1. 注册 CodeBuddy

先访问 CodeBuddy 官网完成注册：

https://www.codebuddy.cn/home/

注册完成后，记得领取 5000 积分，后续体验会用到。

2. 查看积分使用情况

接着进入积分页面，查看当前积分余额和使用情况：

https://www.codebuddy.cn/profile/usage

这样可以先对后续体验成本有一个基本了解。

3. 下载并安装 WorkBuddy

然后前往 WorkBuddy 下载页面：

https://www.codebuddy.cn/work/

下载完成后，按照提示完成安装即可，整体过程比较直接。

4. 创建 Workspace

安装完成后，就可以创建一个 workspace。

相比 OpenClaw 这类直接接管整机的方式，这种权限设计会安全很多，也更容易让人放心去尝试。

5. 开始使用

Workspace 创建完成后，就可以正式下发任务，让 AI 开始执行。

6. 查看完成效果

任务执行结束后，可以直接查看最终效果。

从实际体验来看，整个流程还是比较顺畅的。

7. 接入飞书

除了在本地直接使用之外，还可以进一步接入飞书。

在接入选项中选择 Feishu 即可。

8. 配置飞书机器人

接下来按照文档完成飞书机器人的配置：

如何把 Hugging Face 模型一键嵌入自己的网站？

Sat, 07 Mar 2026 00:00:00 +0000

如果你想把 Hugging Face 上的某个 Space 直接嵌入到自己的网站中，可以按照下面的步骤操作：

首先，打开 Hugging Face 的 Spaces 页面：

https://huggingface.co/spaces

然后选择你想嵌入的网站功能或模型页面。

例如这个 OCR Space：

https://huggingface.co/spaces/FireRedTeam/FireRed-OCR

接着，点击页面右上角的三个点，在弹出的菜单中选择 Embed this Space。

随后，系统会生成一段 iframe 嵌入代码。你只需要将这段代码复制下来，然后粘贴到自己网站的 HTML 页面中即可。

这样，就可以把 Hugging Face Space 的功能直接集成到你自己的网站中。

通过这种方式，你可以将 Hugging Face 上现成的模型能力快速接入自己的网站，让用户不用跳转到其他平台，就能直接在站内体验 AI 功能。

这样不仅能够提升用户体验和网站实用性，增强用户停留时间与网站粘性，还能帮助你以更低成本、更快速度完成功能上线。

尤其对于想快速上站、吸引流量、提升传播效果的新站来说，这是一种非常高效的方法。

借助热门 AI 功能的吸引力，网站更容易获得用户关注、提升访问量，并为后续推广和转化打下基础。

Bing Webmasters 推出 AI Performance ，抢占 AI 流量先机：从 SEO 到 GEO 的全新布局策略

Sun, 15 Feb 2026 00:00:00 +0000

随着 AI 搜索和生成式引擎逐渐成为用户获取信息的重要入口，网站内容不再只面向传统搜索引擎。

如何衡量内容在 AI 场景中的表现，正在成为新的优化课题。

近期，Bing Webmasters 推出了全新的 AI Performance 功能，为站长提供了专门针对 AI 场景的数据监测能力。

这一更新，意味着搜索平台已经开始正式将AI 引用表现纳入可量化评估体系。

该功能提供多项与 AI 引用相关的数据，包括：

被引用数量
平均被引用页面数
关键词查询数据
页面点击量
曝光数据

从目前来看，功能还相对基础，但已经为评估网站在 AI 场景中的表现提供了参考指标。

尤其是在衡量内容被 AI 系统引用情况方面，可以作为 GEO（生成式引擎优化）的重要参考依据。

这也意味着，在进行网站优化时，除了传统的 SEO 之外，还应开始关注 AI 场景下的内容表现。

通过针对 AI 进行结构化优化和内容布局调整，可以让流量来源更加多元化，降低对单一搜索渠道的依赖。

未来，随着 AI 搜索能力的提升，相关数据维度可能会进一步完善。

提前布局，将有助于网站在新一轮流量分配机制中占据更有利的位置。

5 步搞定 Cloudflare 自定义域名配置全指南

Sun, 21 Dec 2025 00:00:00 +0000

在 Cloudflare 中为你的应用配置自定义域名非常简单，只需几个步骤即可完成。

第一步：进入 Works & Pages 页面

第二步：打开 Customer Domains 设置

在应用详情页中，点击菜单的 Customer domains 选项。

接着点击页面中的 Set up a custom domain 按钮，开始添加你的自定义域名。

第三步：输入自定义域名

在弹出的页面中输入你想绑定的域名，例如 example.com，然后点击 Continue。

第四步：确认 DNS 设置

Cloudflare 会自动检测域名的 DNS 配置。如果你的域名也是通过 Cloudflare 购买的，它将自动识别并填写相关信息。

确认无误后，点击 Activate 开始绑定。

第五步：等待激活

激活过程通常需要几分钟时间，稍等片刻即可看到状态变为 Active。

第六步：访问测试

一旦状态显示为 Active，你就可以通过绑定的自定义域名访问你的应用了。

Cloudflare Pages 全流程部署指南：从 GitHub 连接到运行环境配置

Thu, 04 Dec 2025 00:00:00 +0000

在将项目部署到线上时，我们往往希望整个过程既顺畅又高效。

Cloudflare Pages 提供了便捷的静态网站托管能力，只需连接 GitHub 仓库并做少量配置，就能自动构建并部署网站。

下面将带你一步步完成从创建 Pages 项目到最终成功访问页面的完整流程。

1. 创建 Cloudflare Pages 项目

打开 Cloudflare 的 Works & Pages，点击右上角 Add，选择下拉菜单中的 Pages。

连接 GitHub 仓库。

选择对应的仓库。

选择项目所使用的开发语言，其他选项保持默认即可。

点击 Deploy，稍等片刻即可看到部署成功界面。

2. 解决因未开启 Node.js 兼容而导致的访问错误

首次访问部署后的链接时，如果出现错误提示，很可能是因为没有启用 Node.js 兼容模式。

进入项目的 Settings 页面，左侧选择 Runtime，右侧找到 Compatibility flags。

输入 nodejs_compat 并启用该选项。

3. 配置 Google API 密钥

在左侧菜单选择 Variables and Secrets。

切换到 Secret 标签，填写本地项目中 .env.local 内的相关配置。

4. 访问最终部署效果

完成上述设置后，重新访问页面即可查看最终效果。

用 Antigravity IDE 创建搜索意图分析英文网站—完整详细教程

Wed, 03 Dec 2025 00:00:00 +0000

在做 SEO、选关键词、做垂直细分市场研究时，你是否常常会遇到这种情况：

明明有了一个关键词，却不知道背后真正的搜索意图？

到底是求购买、求教程、求工具，还是求比较？

如果能有个网站输入一个 Google 关键词 → 自动分析其背后的搜索意图（Markdown 排版） → 轻松找到细分市场

那将会是一个不可多得的效率工具。

接下来，我就用 Goolge Antigravity IDE 一步步把这个网站从零构建出来。

网站开发完整流程

1️⃣ Step 1：确定网站需求（Planning 模式提示词）

在 Antigravity 的 Planning 模式输入以下提示词，用于让 Gemini 规划网站文件结构、组件划分、UI 设计以及 API 逻辑：

我要创建一个英文工具网站，网站主要功能是：用户输入 Google 搜索关键词，返回关键词背后的搜索意图，以此帮助用户能够找到该关键词的垂直细分市场。
要求如下：
1. 网站界面为全英文
2. 使用 Next.js（稳定版本） + TailwindCSS 构建
3. 网站只需要一个首页
4. 页面包含：
- 一个关键词输入框
- 按全球语言使用人数排序的语言下拉框
- 一个用于展示 Markdown 的结果输出框
5. 页面底部有一个 FAQ 区域，说明网站用途与使用方式
6. API 调用 Google 的模型：gemini-2.5-flash-lite
7. 请规划文件结构、UI 布局与 API 逻辑

Gemini 会自动给出：

5 分钟掌握 Gemini API：打造你的下一款出海 AI 工具

Tue, 02 Dec 2025 00:00:00 +0000

如果你正在打造一款 AI 产品，尤其是出海工具站（AI Tools Site、AI SaaS），那么模型 API 就是你最关键的生产力引擎。

Gemini 提供了强大而灵活的 API，让文本生成、多模态分析、角色设定、多轮对话都能轻松实现。

本文将以 Java SDK 为例，带你快速上手 Gemini API 的核心功能。

在开始前，你需要先创建项目和 API Key，具体可参考上一期的教程。

项目中引入 Gemini SDK：

<dependency>
<groupId>com.google.genai</groupId>
<artifactId>google-genai</artifactId>
<version>1.28.0</version>
</dependency>

文本生成：最基础也最万能的能力

public String generateContent() {
Client client = Client.builder().apiKey(config.getGeminiKey()).build();
GenerateContentResponse response = client.models.generateContent(
"gemini-2.5-flash",
"How does AI work?",
null);
return response.text();
}

文本生成是使用频率最高的能力，用于解释、写文章、生成邮件、生成内容等各种场景。

在一个出海 AI 文案生成工具（如 blog writer、email assistant）中，用户输入一个主题，你可以直接调用文本生成接口输出完整的英文博客、邮件或社媒内容。

思考模式：让回答更像深度专家

public String thinking() {
Client client = Client.builder().apiKey(config.getGeminiKey()).build();
GenerateContentConfig config =
GenerateContentConfig.builder()
// Disables thinking
.thinkingConfig(ThinkingConfig.builder().thinkingBudget(0).build())
.build();
GenerateContentResponse response =
client.models.generateContent("gemini-2.5-flash", "How does AI work?", config);
return response.text();
}

思考模式让模型能够进行更深入的推理，从而提升回答质量，但也会增加耗时和 Token 使用。

Better Stack 使用教程

Sat, 30 Nov 2024 00:00:00 +0000

Better Stack 是什么？

Better Stack 是一个综合平台，旨在增强开发者和工程团队的可观测性和事件管理。它结合了多个功能，帮助高效监控、调试和解决技术栈中的问题。

Better Stack 能做什么？

日志管理：Better Stack可以高速集中存储和搜索日志，将日志转化为结构化数据，并使用SQL查询。

正常运行时间监控：平台可以监控从网站到服务器的一切，确保任何停机时间都能迅速检测和解决。用户可以设置轮班值班，接收可操作的警报，并有效管理事件。

可观测性仪表板：Better Stack提供精美设计的仪表板，汇总来自各种来源的指标。这些仪表板可以通过不同的图表类型进行定制，并可以使用SQL查询进行调整。

Better Stack 监控使用教程

我主要用来做网站监控，使用方式非常简单。

首先注册 Better Stack，https://uptime.betterstack.com/users/sign-up

填入网站域名和自己的邮箱。

注册成功后，进入到配置页面。

告警功能只有邮箱是免费的，短信、推送、Call 都需要收费。

手机上装一个邮箱客户端就能白嫖告警功能。

配置检查间隔。

检查间隔、恢复后检查间隔、检查区域、超时时间这些都有对应的配置，可以自行配置。

查看报表。

有了监控数据后，后台会生成报表方便查看。

邮件通知。

当网站返回非 2xx 状态码时，会出发邮件推送，推送消息如下。

Clarity 详细使用教程

Sat, 30 Nov 2024 00:00:00 +0000

Clarity 是什么？

微软的 Clarity 是一款免费的用户行为分析工具，旨在帮助网站所有者了解用户如何与他们的网站互动，完全免费。

Clarity 有什么用？

微软 Clarity 是一个强大的工具，可以帮助网站所有者和开发人员深入了解用户行为，优化用户体验，从而提升网站的性能和效果。

Clarity 最为强大的功能是将用户在网站上的行为进行录制，可以通过视频查看用户在网站上的操作和轨迹。

Clarity 详细教程

首先到官网注册，https://clarity.microsoft.com/

新建项目输入自己的网站名称和域名。

通过三方平台安装。

选择 Google Tag Manager，Google tag manager 能帮助网站和移动应用的管理员简化和管理各种分析和营销标签的部署。

有了 Google tag manger 网站想要安装分析代码就不再需要上传脚本分析代码。

如果没有账号需要注册，https://tagmanager.google.com/#/home

选择立即链接。

授予权限。

选择账户。

等待数据同步，完成连接后需要等待一段时间才能有数据，同步完成后仪表盘如下。

查看录制视频，可以针对具体的页面查看用户的操作视频，这个功能真的太强大了，可以清晰的看到用户的操作轨迹。

可以查看用户中断、退出的界面，更好地分析用户的行为。

Cloudflare R2 详细使用教程

Sat, 30 Nov 2024 00:00:00 +0000

Cloudflare R2 是 Cloudflare 推出的兼容亚马逊 S3 的存储服务。

每月 10GB 免费存储，读取数据：1000万次/月免费，操作数据：100万次/月免费。

R2 可以用来做什么？

最大的用处就是作为个人开发者刚起步时免费的图片存储应用。

如果你正在做图片存储的应用，那么 R2 非常适合。

注册

填写信用卡基本信息，带有 Visa 或者万事达标识的卡都行，提交成功后会发生一笔 0 元的交易信息，以确认信用卡的可用性。

创建 Bucket

点击 Create Bucket。

输入 Bucket name。

根据自己的业务选择对应的地区，美国、欧洲、中国。

上传文件

控制台直接上传图片。

创建 API Token

Token 主要用来做 API 调用。

权限选择读写权限。

选择刚才创建的 Bucket，TTL 选择永久。

域名配置

配置域名可以公开访问图片，不配置使用 Cloudflare 的私有域名访问速度会被限制。

SDK 调用

Cloudflare 其实是对亚马逊 S3 的封装，SDK 的使用方法和亚马逊的 S3 是一样的。

Supbase 数据库详细使用教程

Sat, 30 Nov 2024 00:00:00 +0000

Supbase 是什么？

Supabase 是一个开源的 Firebase 替代品，它提供了一系列后端服务，帮助开发者快速构建应用程序，包括以下功能。

基于 PostgreSQL 数据库：Supabase 使用 PostgreSQL 数据库作为其数据存储的基础。

认证和授权：提供用户认证和数据访问控制功能。

即时 API 和实时同步：自动生成 RESTful API，并支持数据库变更的实时订阅。

文件存储和边缘函数：允许存储文件和在边缘位置运行代码。

向量嵌入和 AI 工具：提供向量处理和 AI 功能的工具。

Supbase 能解决什么问题？

数据库方案一般有两种方案，第一种方案是购买云服务器自建数据库，第二种方式是购买云服务的数据库服务。

无论哪种方案对于刚起步的独立开发者来说，成本都比较高昂。

Subbase 则是提供了 500 MB 的免费存储空间，每月 50,000 的活跃用户的访问量。

详情可以查看 https://supabase.com/pricing

如何使用 Supbase？

注册账号后，创建 Project。

填入名称、密码，选择业务的物理区域。

创建表，以用户表为例。

连接数据库，点击创建后的 Project，左侧选择 database 菜单。

右侧界面就是连接数据库的账号和密码。

Tally 使用教程

Sat, 30 Nov 2024 00:00:00 +0000

Tally 是什么？

Tally 是一个可以在自己的应用或者网站上自助集成的表单系统。

不用编写任何代码就能集成，简单方便。

基础功能免费，且不限数量。

Tally 有什么用？

Tally 可以在自己的应用里收集用户的建议反馈、bug report 等。

Tally 使用教程

首先到官网注册，https://tally.so/signup

注册成功后，创建自己的表单，下面以创建一个 Feedback form 为例。

点击创建表单，输入标题。

Tally 提供了很多 html 组件，可以任意搭配组合。

最终的 Feedback 表单如下。

完成之后点击右上角的发布，发布后会生成一个唯一的可以公开访问的 URL。

将生成的链接放到自己的应用中，就可以收集用户的反馈。

当用户填写反馈后，登录 Tally 的后台就能看到用户反馈的内容。

如何使用 Vercel 免费创建应用？

Sat, 30 Nov 2024 00:00:00 +0000

Vercel 是一个云平台，它为开发人员提供构建和部署 Web 应用程序的工具和基础设施。

简而言之有两大优点。

第一：不需要自己搭建环境。

第二：不需要自己购买服务器，可以直接在它的平台上创建应用，直接提供服务。

下面说下详细的步骤。

Vercel 上有很多免费的模板，打开：https://vercel.com/templates。

选择一个模板，这里我挑选了：https://vercel.com/templates/next.js/ai-code-translator

这个应用的主要作用是将不同的代码进行翻译转换。

Java 转 Go、Python 转 JavaScript 等等。

这个功能在人工智能出现之前极其难实现，如今有了人工智能变得非常简单。

点击部署

授权 Github 账号的权限

点击进入新页面后，授予 Vercel 自己 Github 的账号权限。

在 Github 上创建项目

在 Vercel 的页面上点击 Create 创建项目，Vercel 会自动在 Github 上创建一个私有项目，相当于 Clone 了一份代码到自己的仓库。

配置 openAI key

等待部署

部署完成

部署完成有撒花效果。

查看效果

点击预览，查看效果。

部署域名

如果想要用自己的域名，直接在 setting 中进行设置即可。

整个过程不到 3 分钟，这就是 Vercel 的优势。

Vercel 最大的优势在于有大量的模板，且免费部署。

在此之前，个人开发者如果有一个想法，想要快速上线，需要写代码、购买服务器、搭建环境等等，最快也得一两周。

而 Vercel 可以将整个周期直接缩短到分钟级别，且免费。

海外工具站技术栈选型

Sat, 30 Nov 2024 00:00:00 +0000

到目前为止我已经上线了几个海外工具站点，对其中的技术栈选型也有所了解，梳理下用到的技术栈。

Vercel

关于 Vercel 已经在此前的文章中介绍过。

如果你会 js 技术栈那么 Vercel 是最优选择。

Vercel 提供了免费的容器部署，可以直接和 github 仓库连接。

不需要额外购买云服务，此外 Vercel 提供一定免费额度的数据存储服务。

Vercel 的最大优势在于可以快速、免费、大量地发布网站，以量取胜。

哪个网站起来了就继续投入精力优化，没有流量的直接抛弃。

如果不会 Js 技术栈就选择自己熟悉的技术栈和 SAAS 服务，千万不要去为了省服务器成本而去学一门编程语言，因为时间成本太高。

我因为不会 js 技术栈，而选择了自己熟悉的 Java 技术栈和 Amazon 的 lightsail 服务。

域名服务

我用的服务主要有两个 Namesilo 和 CloudFlare。

Namesilo 的后台比较难用，CloudFlare 能够和自家 CDN 服务无缝集成。

新域名注册现在基本使用 CloudFlare。

数据库

此前介绍过 Subbase 服务。

提供一定量的免费额度，数据库是 PostgreSql。

用户服务

网站需要接入支付就一定需要用户服务，我当时用 Sqlite 自己开发了一套简易的用户服务。

应用一旦接入用户服务就会非常耗费时间，包括数据存储、登录、注册、接口权限校验等等。

其实已经有很多现成的服务能够直接提供用户管理服务，比如 Auth0 https://auth0.com/docs/quickstarts

Auth0 提供了各种技术栈的无缝接入，Js、.Net、Java、Apache、Spring Boot、Android、iOS、Flutter 等等。

甚至各类流行的技术框架也可以直接支持，所以根本没有必要自己开发。

用户登录服务不建议使用用户名、密码登录功能，直接使用三方联合登录即可。

再来看下 Auth0 的价格，https://auth0.com/pricing

每月 7500 个活跃用户免费，支持 Google、Facebook 三方联合登录。

用 bolt 人工智能开发网站

Sat, 30 Nov 2024 00:00:00 +0000

今天介绍下用 blot 人工智能开发网站。

工作中经常遇到海外一线和我反馈线上问题，排查问题一个关键的线索是用户 ID 和时间。

运营反馈的是当地的时间，而服务器存储的是 GMT 时间，我每次都要进行换算，实在麻烦。

所以我便想到了根据不同时区换算时间的功能。

打开 https://bolt.new/

输入提示词，我的提示词如下：

技术栈：用 HTML + TailwindCSS + Jquery 实现，不需要 node 打包
核心功能：我要开发一个根据世界各城市换算时间的英文网站，界面上首先会展示当前用户所在城市的时间以及时区。

在下方有输入时间的输入框，根据 jquery 时间插件选择，输入框的下方有两个下拉框，左侧是原时区，右侧是目标时区。

下拉框支持模糊搜索功能，选择好城市之后程序自动算出对应的时间，时间显示在下拉框的下方并居中显示。

在页面的下方区域罗列出世界上最主要的 6 个世界大城市当前的时间。
功能区域：需要有常见的各种 Section，最终全部 Section 组成了 SEO 友好的 Headings。
网站文案：需要符合 seo 友好，围绕着不同时区时间转换去编写页面的内容，内容为英文文案。
网站风格：网站配色和风格需要现代化、高级，类似于苹果官网的风格，网站需要自适应各种屏幕尺寸。

生成之后经过了几次调整，最终效果如下：

bolt 的优势是按照项目生成，而不是单一的文件。

其它人工智能生成代码都是单一的文件，无法将代码整合成一个项目，包括文件拆分、文件夹拆分、函数拆分等等。

生成后自带预览和交互功能，可以直接在 Preview 界面直接运行。

生成完成后点击右上角的 download，在本地浏览器中打开 index.html 直接运行无任何错误。

有了代码后就可以部署到 Vercel 中，Vercel 的部署过程此前已经介绍过，详见如何使用 Vercel 免费创建应用？。

部署完成后可以直接线上体验：https://world-time-converter.vercel.app/