我见过数百种人工智能工具，其中许多正在改变世界。
作为开发人员，总是有很多东西需要学习，因此集中精力节省时间来处理重要的事情非常重要。
我将介绍 21 种可以让您的生活更轻松的开发人员工具，特别是在开发人员体验方面。
相信我，这个清单一定会让您大吃一惊！
我们开始做吧。
1. Taipy – 将数据和 AI 算法融入可投入生产的 Web 应用程序中。
Taipy 是一个开源 Python 库，用于轻松进行端到端应用程序开发，具有假设分析、智能管道执行、内置调度和部署工具等功能。
我相信大多数人都不明白，Taipy 是用来为基于 Python 的应用程序创建 GUI 界面并改善数据流管理的。
关键在于性能，而 Taipy 是完美的选择。
Streamlit 虽然是一款流行的工具，但在处理大型数据集时其性能会显著下降，因此不适合用于生产级用途。
而 Taipy 则简单易用，且性能丝毫不受影响。通过试用 Taipy，您将亲身体验其用户友好的界面和高效的数据处理能力。
Taipy 有很多集成选项，可以轻松与领先的数据平台连接。
使用以下命令开始。
pip install taipy
让我们来谈谈最新的Taipy v3.1 版本。
最新版本使 Taipy 多功能部件对象内的任何 HTML 或 Python 对象可视化成为可能。
这意味着Folium、Bokeh、Vega-Altair和Matplotlib等库现在可用于可视化。
这还带来了对Plotly python的原生支持，使得绘制图表变得更加容易。
他们还使用分布式计算提高了性能，但最好的部分是 Taipy，它的所有依赖项现在与 Python 3.12 完全兼容，因此您在使用 Taipy 进行项目时可以使用最新的工具和库。
您可以阅读文档。
另外一个很有用的地方是，Taipy 团队提供了一个名为Taipy Studio 的VSCode 扩展，以加速 Taipy 应用程序的构建。
您还可以使用 Taipy 云部署您的应用程序。
如果您想通过博客了解代码库结构，可以阅读HuggingFace 撰写的使用 Taipy 为您的 Python 中的 LLM 创建 Web 界面。
尝试新技术通常很困难，但 Taipy 提供了10 多个带有代码和适当文档的演示教程供您跟随。
例如一些演示示例和项目想法：
使用传感器测量工厂周围的空气质量的用例，展示了 Taipy 仪表板流数据的能力。查看GitHub Repo。
Taipy 应用程序可分析信用卡交易以检测欺诈行为。查看GitHub Repo。
这使用了 2020 年的 Covid 数据集。页面显示了有关 Covid 的不同图表和信息。还有一个预测页面来预测伤亡人数。查看GitHub Repo。
此演示展示了 Taipy 使最终用户能够使用 LLM 运行推理的能力。在这里，我们使用 GPT-3 创建聊天机器人并在交互式聊天界面中显示对话。您可以轻松更改代码以使用任何其他 API 或模型。查看GitHub Repo。
此演示将人脸识别无缝集成到我们的平台中，使用您的网络摄像头提供用户友好的实时人脸检测体验。查看GitHub Repo。
用例非常令人惊奇所以一定要检查一下。
Taipy 在 GitHub 上拥有 8.2k+ 颗星，并且正在发布，v3.1因此它们在不断改进。
2. DevToys – 开发人员的瑞士军刀。
DevToys 可帮助完成日常开发任务，例如格式化 JSON、比较文本和测试 RegExp。
有了它，您就无需使用不可信的网站来处理您的数据。借助智能检测，DevToys 可以检测出最适合用于复制到 Windows 剪贴板的数据的工具。
紧凑的覆盖层可让您将应用程序保持在较小尺寸并位于其他窗口之上。最好的部分是可以同时使用该应用程序的多个实例。
我可以肯定地说，开发人员甚至不知道这个很棒的项目。
终于有一款专为 Windows 生态系统设计的软件了。哈哈！
他们提供的一些工具包括：
转换器
JSON <> YAML
时间戳
数基
Cron解析器
编码器/解码器
HTML
网址
Base64 文本和图像
压缩
JWT 解码器
格式化程序
JSON
SQL
XML
生成器
哈希（MD5、SHA1、SHA256、SHA512）
UUID 1 和 4
乱数
校验和
文本
逃脱/非逃脱
检查员和案件转换器
正则表达式测试器
文本比较器
XML 验证器
Markdown 预览
形象的
色盲模拟器
颜色选择器和对比度
PNG / JPEG 压缩器
图像转换器
我不知道你怎么样，但我不会错过这个！
您可以阅读如何运行 DevToys。
关于许可证的说明。DevToys
使用的许可证允许将应用程序作为试用软件或共享软件重新分发而无需进行任何更改。但是，作者 Etienne BAUDOUX 和 BenjaminT 不希望您这样做。如果您认为您有充分的理由这样做，请先与我们联系以进行讨论。
他们在 GitHub 上有 23k 个星，并且使用 C#。
3. Pieces——您的工作流程副驾驶。
Pieces 是一款支持人工智能的生产力工具，旨在通过智能代码片段管理、情境化副驾驶交互和有用材料的主动呈现来帮助开发人员管理工作流程的混乱。
它最大限度地减少了上下文切换，简化了您的工作流程，并提升了您的整体开发体验，同时通过完全离线的 AI 方法维护了您工作的隐私和安全。太棒了 :D
它与您最喜欢的工具无缝集成，以简化、理解和提升您的编码流程。
它具有比我们看到的更多令人兴奋的功能。
它能以闪电般的搜索速度找到您需要的资料，让您可以根据自己的喜好通过自然语言、代码、标签和其他语义进行查询。可以说它是“您的个人离线谷歌”。
Pieces 使用 OCR 和 edge-ML 升级屏幕截图，以提取代码并修复无效字符。因此，您可以获得极其准确的代码提取和深度元数据丰富。
您可以查看Pieces 提供的完整功能列表。
他们为 Pieces OS 客户端提供了大量 SDK 选项，其中包括TypeScript、Kotlin、Python和Dart。
从开源普及度来看，他们还很新，但他们的社区是我迄今为止见过的最好的社区之一。加入他们，成为 Pieces 的一员！
4.Infisical——秘密管理平台。
Infisical 是一个开源秘密管理平台，团队使用它来集中管理他们的秘密，如 API 密钥、数据库凭证和配置。
他们让秘密管理对每个人都更容易实现，而不仅仅是安全团队，这意味着从头开始重新设计整个开发人员体验。
就我个人而言，我不介意使用 .env 文件，因为我不是特别谨慎。不过，你可以阅读Gregory 的《立即停止使用 .env 文件！》来了解。
他们提供了四个 SDK，分别用于Node.js、Python、Java和.Net。你可以自行托管或使用他们的云。
从以下 npm 命令开始。
npm install @infisical/sdk
这就是您如何开始使用（Node.js SDK）。
import { InfisicalClient, LogLevel } from "@infisical/sdk";
const client = new InfisicalClient({
clientId: "YOUR_CLIENT_ID",
clientSecret: "YOUR_CLIENT_SECRET",
logLevel: LogLevel.Error
});
const secrets = await client.listSecrets({
environment: "dev",
projectId: "PROJECT_ID",
path: "/foo/bar/",
includeImports: false
});
Infisical 还提供了一套工具来自动防止机密泄露到 git 历史记录中。此功能可以在 Infisical CLI 级别使用预提交钩子或通过与 GitHub 等平台直接集成来设置。
您可以阅读文档并了解如何安装 CLI，这是使用它的最佳方式。
Infisical 还可用于将机密注入 Kubernetes 集群并自动部署，以便应用程序使用最新的机密。有很多集成选项可供选择。
在使用整个源代码之前一定要检查他们的许可证，因为他们有一些受 MIT Expat 保护的企业级代码，但不用担心，大多数代码都是免费使用的。
他们在 GitHub 上有 11k+ 颗星，有 125+ 个版本，因此他们一直在不断发展。此外，Infiscial CLI 的安装次数超过 540 万次，因此非常值得信赖。
5. Mintlify——构建时出现的文档。
Mintlify 是一款人工智能文档编写器，您只需 1 秒即可编写代码文档 :D
几个月前我发现了 Mintlify，从那时起我就成了它的粉丝。我看到很多公司都在使用它，甚至我还用我的商务电子邮件生成了完整的文档，结果发现这非常简单而且不错。如果您想要详细的文档，Mintlify 就是解决方案。
主要用例是根据我们将在此讨论的代码生成文档。当您编写代码时，它将自动记录代码，以便其他人更容易跟上。
您可以安装VSCode 扩展，也可以将其安装在IntelliJ上。
您只需突出显示代码或将光标放在要记录的行上。然后单击“写入文档”按钮（或按 ⌘ + 。）
如果你更喜欢教程，那么你可以观看Mintlify 的工作原理。它支持 10 多种编程语言，并支持许多文档字符串格式，如 JSDoc、reST、NumPy 等。
顺便说一下，他们的网站链接是writer.mintlify.com；repo中的当前链接似乎是错误的。
Mintlify 是一款方便的记录代码的工具，这是每个开发人员都应该努力做到的事情。它使其他人更容易有效地理解您的代码。
它在 GitHub 上有大约 2.5k 个星，基于 TypeScript 构建，受到许多开发人员的喜爱。
6. Replexica——为 React 提供 AI 驱动的 i18n 工具包。
本地化确实存在困难，因此让人工智能来帮助解决这个问题绝对是一个很酷的概念。
Replexica 是 React 的 i18n 工具包，用于快速交付多语言应用程序。它不需要将文本提取到 JSON 文件中，并使用 AI 驱动的 API 进行内容处理。
它有以下两个部分：
Replexica Compiler - React 的开源编译器插件。
Replexica API - 一种云端 i18n API，使用 LLM 执行翻译。（基于使用情况，有免费套餐）
一些支持的 i18n 格式包括：
不含 JSON 的 Replexica 编译器格式。
Markdown 内容的 .md 文件。
传统的基于 JSON 和 YAML 的格式。
当他们获得 500 颗星时，他们还在 DEV 上发布了官方公告。我是第一批读者之一（反应不到 3 人）。
他们涵盖了很多内容，所以你应该读读Max 的《我们获得了 500 颗星，下一步该怎么做》。
为了让您大致了解 Replexica，以下是对基本 Next.js 应用程序进行多语言支持所需的唯一更改。
从以下 npm 命令开始。
// install
pnpm add replexica @replexica/react @replexica/compiler
// login to Replexica API.
pnpm replexica auth --login
您可以这样使用它。
// next.config.mjs
// Import Replexica Compiler
import replexica from '@replexica/compiler';
/** @type {import('next').NextConfig} */
const nextConfig = {};
// Define Replexica configuration
/** @type {import('@replexica/compiler').ReplexicaConfig} */
const replexicaConfig = {
locale: {
source: 'en',
targets: ['es'],
},
};
// Wrap Next.js config with Replexica Compiler
export default replexica.next(
replexicaConfig,
nextConfig,
);
Replexica Compiler 支持 Next.js App Router，Replexica API 支持英语🇺🇸和西班牙语🇪🇸。他们计划接下来发布 Next.js Pages Router + 法语🇫🇷 语言支持！
他们在 GitHub 上有 740 多个星标，并且基于 TypeScript 构建。您应该密切关注该项目的进一步进展！
7. Flowise – 拖放 UI 来构建您的定制 LLM 流程。
Flowise 是一个开源 UI 可视化工具，用于构建您的定制 LLM 编排流程和 AI 代理。
从以下 npm 命令开始。
npm install -g flowise
npx flowise start
OR
npx flowise start --FLOWISE_USERNAME=user --FLOWISE_PASSWORD=1234
这就是您集成 API 的方式。
import requests
url = "/api/v1/prediction/:id"
def query(payload):
response = requests.post(
url,
json = payload
)
return response.json()
output = query({
question: "hello!"
)}
您可以阅读文档。
云主机不可用，因此您必须按照这些说明自行托管。
让我们探讨一些用例：
假设您有一个网站（可能是商店、电子商务网站或博客），并且您想删除该网站的所有相关链接，并让 LLM 回答您网站上的任何问题。您可以按照此分步教程了解如何实现相同目标。
您还可以创建一个自定义工具，该工具将能够调用 webhook 端点并将必要的参数传递到 webhook 主体中。请按照本指南使用 Make.com 创建 webhook 工作流。
还有许多其他用例，例如构建 SQL QnA 或与 API 交互。
FlowiseAI 在 GitHub 上有 27.5k+ 个星星，并且有超过 10k 个 fork，因此整体比例很好。
8. Hexo – 一个快速、简单且功能强大的博客框架。
大多数开发者都喜欢自己的博客，如果你也是这样，Hexo 可能是你不知道的工具。
Hexo 支持许多功能，例如极快的生成速度，支持 GitHub Flavored Markdown 和大多数 Octopress 插件，提供到 GitHub Pages、Heroku 等的单命令部署，以及用于无限扩展的强大 API 和数百个主题和插件。
这意味着您可以用 Markdown（或其他标记语言）撰写帖子，Hexo 会在几秒钟内生成具有漂亮主题的静态文件。
从以下 npm 命令开始。
npm install hexo-cli -g
您可以这样使用它。
// Setup your blog
hexo init blog
// Start the server
hexo server
// Create a new post
hexo new "Hello Hexo"
您可以阅读文档，查看 Hexo 提供的所有400 多个插件和主题。据我所知，这些插件支持各种用例，例如 Hexo 的 Ansible 部署器插件。
您可以观看有关在 Hexo 上编写和组织内容的 YouTube 教程。
Hexo 在 GitHub 上有 38k+ 颗星，GitHub 上有 125k+ 开发人员在使用。它们的发布v7版本解压后大小为629 kB。
9.截图转代码——放入截图并将其转换为干净的代码。
这个开源项目非常受欢迎，但许多开发人员仍然不知道它。它可以帮助您以 10 倍的速度构建用户界面。
它是一个简单的工具，可以使用 AI 将屏幕截图、模型和 Figma 设计转换为干净、实用的代码。
该应用程序有一个 React/Vite 前端和一个 FastAPI 后端。如果你想使用 Claude Sonnet 或实验性视频支持，你将需要一个可以访问 GPT-4 Vision API 的 OpenAI API 密钥或一个 Anthropic 密钥。你可以阅读指南以开始使用。
您可以在托管版本上实时尝试它，并观看wiki 上提供的一系列演示视频。
他们在 GitHub 上拥有 47k+ 颗星，并支持许多技术栈，例如 React 和 Vue，以及不错的 AI 模型，例如 GPT-4 Vision、Claude 3 Sonnet 和 DALL-E 3。
10. Appsmith——构建管理面板、内部工具和仪表板的平台。
管理面板和仪表板是任何软件理念的一些常见部分（在大多数情况下），我尝试从头开始构建它，但这会带来很多痛苦和不必要的辛苦。
您可能已经看到组织构建内部应用程序，例如仪表板、数据库 GUI、管理面板、批准应用程序、客户支持仪表板等，以帮助其团队执行日常操作。正如我所说，Appsmith 是一个开源工具，可以快速开发这些内部应用程序。
首先，请观看这个YouTube 视频，其中 100 秒解释了 Appsmith。
它们提供拖放式小部件来构建 UI。
您可以使用 45 多个可自定义的小部件在几分钟内创建漂亮的响应式 UI，而无需编写一行 HTML/CSS。查找小部件的完整列表。
Appsmith 支持在 GUI 上的小部件属性、事件侦听器、查询和其他设置中的几乎任何地方编写 JavaScript 代码。Appsmith 支持在其中编写单行代码，{{ }}并将括号内的任何内容解释为 JavaScript 表达式。
/*Filter the data array received from a query*/
{{ QueryName.data.filter((row) => row.id > 5 ) }}
or
{{
storeValue("userID", 42);
console.log(appsmith.store.userID);
showAlert("userID saved");
}}
您需要使用立即调用函数表达式（IIFE）来编写多行。
例如无效代码和有效代码。
// invalid code
/*Call a query to fetch the results and filter the data*/
{{
const array = QueryName.data;
const filterArray = array.filter((row) => row.id > 5);
return filterArray;
}}
/* Check the selected option and return the value*/
{{
if (Dropdown.selectedOptionValue === "1") {
return "Option 1";
} else {
return "Option 2";
}
}}
// valid code
/* Call a query and then manipulate its result */
{{
(function() {
const array = QueryName.data;
const filterArray = array.filter((row) => row.id > 5);
return filterArray;
})()
}}
/* Verify the selected option and return the value*/
{{
(function() {
if (Dropdown.selectedOptionValue === "1") {
return "Option 1";
} else {
return "Option 2";
}
})()
}}
只需几个简单的步骤，您就可以创建任何内容，从简单的 CRUD 应用程序到复杂的多步骤工作流程：
与数据库或 API 集成。Appsmith 支持最流行的数据库和 REST API。
使用内置小部件来构建您的应用程序布局。
在编辑器中的任何位置使用查询和 JavaScript 表达您的业务逻辑。
Appsmith 支持使用 Git 进行版本控制，以便使用分支来跟踪和回滚更改，从而协作构建应用程序。部署应用程序并共享它 :)
您可以阅读文档和操作指南，例如如何将其连接到本地数据源或如何与第三方工具集成。
您可以自行托管或使用云。他们还提供20 多个模板，以便您可以快速上手。其中一些有用的模板是：
Appsmith 在 GitHub 上拥有 31k+ 颗星，发布版本超过 200 个。
11. BlockNote - 基于块（Notion 风格）且可扩展的富文本编辑器。
人们常说，除非你正在学习新东西，否则不要重新发明轮子。
Blocknote 是一款开源的基于 Block 的 React 富文本编辑器。您可以轻松地为您的应用添加现代文本编辑体验。
Blocknote 建立在 Prosemirror 和 Tiptap 之上。
它们具有很多特点，如下所示。
您可以轻松自定义内置 UI 组件，或创建自定义块、内联内容和样式。如果您想要更进一步，可以使用其他 Prosemirror 或 TipTap 插件扩展核心编辑器。
其他库功能强大，但学习难度较高，需要自定义编辑器的每一个细节。这可能需要数月的专业工作。
相反，BlockNote 只需最少的设置就能提供出色的体验，包括现成的动画 UI。
从以下 npm 命令开始。
npm install @blocknote/core @blocknote/react
这就是你可以使用它的方法。通过useCreateBlockNote钩子，我们可以创建一个新的编辑器实例，然后使用该theBlockNoteView组件来渲染它。
@blocknote/react/style.css也被导入以添加编辑器的默认样式和 BlockNote 导出的 Inter 字体（可选）。
import "@blocknote/core/fonts/inter.css";
import { BlockNoteView, useCreateBlockNote } from "@blocknote/react";
import "@blocknote/react/style.css";
export default function App() {
// Creates a new editor instance.
const editor = useCreateBlockNote();
// Renders the editor instance using a React component.
return <BlockNoteView editor={editor} />;
}
您应该尝试一下，特别是因为它包含了广泛的功能，如“斜线”菜单、流畅的动画以及创建实时协作应用程序的潜力。
斜线菜单
实时协作
格式菜单
他们还提供了20 多个示例以及可用于快速跟进的预览和代码。
Blocknote 在 GitHub 上拥有 5k+ 颗星，并被 1.5k+ 名开发人员使用。
12. CopilotKit——数小时内为您的产品提供 AI Copilots。
在 React 中集成 AI 功能非常困难，而这正是 Copilot 发挥作用的地方。这是一种简单而快速的解决方案，可将可用于生产的 Copilot 集成到任何产品中！
您可以使用两个 React 组件将关键 AI 功能集成到 React 应用中。它们还提供内置（完全可定制）Copilot 原生 UX 组件，例如<CopilotKit />、、、。<CopilotPopup /><CopilotSidebar /><CopilotTextarea />
从以下 npm 命令开始。
npm i @copilotkit/react-core @copilotkit/react-ui
Copilot Portal 是 CopilotKit 提供的组件之一，CopilotKit 是一个应用内 AI 聊天机器人，可以查看当前应用状态并在应用内采取行动。它通过插件与应用前端和后端以及第三方服务进行通信。
这就是您集成聊天机器人的方式。
必须CopilotKit包装与 CopilotKit 交互的所有组件。建议您也从这里开始CopilotSidebar（稍后您可以切换到不同的 UI 提供程序）。
"use client";
import { CopilotKit } from "@copilotkit/react-core";
import { CopilotSidebar } from "@copilotkit/react-ui";
import "@copilotkit/react-ui/styles.css";
export default function RootLayout({children}) {
return (
<CopilotKit url="/path_to_copilotkit_endpoint/see_below">
<CopilotSidebar>
{children}
</CopilotSidebar>
</CopilotKit>
);
}
您可以使用此快速入门指南设置 Copilot Backend 端点。
此后，您可以让 Copilot 采取行动。您可以阅读如何提供外部上下文。您可以使用useMakeCopilotReadable和useMakeCopilotDocumentReadablereact hooks 来实现这一点。
"use client";
import { useMakeCopilotActionable } from '@copilotkit/react-core';
// Let the copilot take action on behalf of the user.
useMakeCopilotActionable(
{
name: "setEmployeesAsSelected", // no spaces allowed in the function name
description: "Set the given employees as 'selected'",
argumentAnnotations: [
{
name: "employeeIds",
type: "array", items: { type: "string" }
description: "The IDs of employees to set as selected",
required: true
}
],
implementation: async (employeeIds) => setEmployeesAsSelected(employeeIds),
},
[]
);
您可以轻松集成 Vercel AI SDK、OpenAI API、Langchain 和其他 LLM 提供程序。您可以按照本指南将聊天机器人集成到您的应用程序中。
其基本思想是在几分钟内构建可用于基于 LLM 的应用程序的 AI 聊天机器人。
用例非常广泛，作为开发人员，我们绝对应该在下一个项目中尝试使用 CopilotKit。
CopilotKit 在 GitHub 上有 4.2k+ 颗星，并且有 200 多个版本，这意味着它们在不断改进。
13.自动完成- 为您现有的终端和 shell 提供 IDE 风格的自动完成功能。
Fig使个人的命令行更加简单，并且使团队的协作更加轻松。
他们最受欢迎的产品是 Autocomplete。输入时，Fig 会在您现有的终端中弹出子命令、选项和上下文相关参数。
最好的部分是，您也可以将 Fig 的自动完成功能用于您自己的工具。以下是如何创建私人完成：
import { ai } from "@fig/autocomplete-generators"
...
generators: [
ai({
// the prompt
prompt: "Generate a git commit message",
// Send any relevant local context.
message: async ({ executeShellCommand }) => {
return executeShellCommand("git diff")
},
//Turn each newline into a suggestion (can specify instead a `postProcess1 function if more flexibility is required)
splitOn: "\n",
})
]
您可以阅读fig.io/docs以了解如何开始。
他们在 GitHub 上有 24k+ 个星，这对于经常使用 shell 或终端的开发人员非常有用。
14. Tooljet——用于构建商业应用程序的低代码平台。
我们都构建前端，但它通常非常复杂，涉及很多因素。这可以省去很多麻烦。
ToolJet 是一个开源低代码框架，可以用最少的工程工作来构建和部署内部工具。
ToolJet 的拖放式前端构建器允许您在几分钟内创建复杂、响应迅速的前端。
您可以集成各种数据源，包括 PostgreSQL、MongoDB 和 Elasticsearch 等数据库；具有 OpenAPI 规范和 OAuth2 支持的 API 端点；Stripe、Slack、Google Sheets、Airtable 和 Notion 等 SaaS 工具；以及 S3、GCS 和 Minio 等对象存储服务，以获取和写入数据。一切 :)
这就是 Tooljet 的工作原理。
您可以在 ToolJet 中开发多步骤工作流以自动化业务流程。除了构建和自动化工作流之外，ToolJet 还允许将这些工作流轻松集成到您的应用程序中。
您可以阅读此快速入门指南，其中向您展示了如何使用 ToolJet 在几分钟内创建员工目录应用程序。此应用程序将允许您使用漂亮的用户界面跟踪和更新员工信息。
查看可用的功能列表，包括 45 多个内置响应组件、50 多个数据源等等。
他们在 GitHub 上有 26k+ 颗星，并且是基于 JavaScript 构建的。他们还获得了 GitHub 的资助，因此建立了巨大的信任。
15. Apitable——面向 API 的构建协作应用程序的低代码平台。
APITable 是一个面向 API 的构建协作应用程序的低代码平台，据称它比所有其他 Airtable 开源替代品都要好。
它有很多很酷的功能，例如：
实时协作。
您可以生成自动表格。
无限制的跨表链接。
动态图片
API 第一个面板。
强大的行/列功能。
您可以阅读完整的功能列表。
您可以尝试apitable并在 apitable 的现场 Gitpod 演示中查看该项目的演示。
您还可以阅读安装指南，在本地或云计算环境中安装 APITable。
16. n8n——工作流自动化工具。
n8n 是一款可扩展的工作流自动化工具。借助公平代码分发模型，n8n 将始终拥有可见的源代码，可供自行托管，并允许您添加自定义函数、逻辑和应用程序。
每个开发人员都想使用的工具。自动化是提高生产力和简化工作的关键。
n8n 基于节点的方法使其具有高度的灵活性，使您能够将任何事物连接到任何事物。
有400 多个集成选项，这简直太疯狂了！
您可以看到所有安装选项，包括 Docker、npm 和 self-host。
使用以下命令开始。
npx n8n
此命令将下载启动 n8n 所需的一切。然后，您可以访问 n8n 并通过打开 开始构建工作流程http://localhost:5678。
在 YouTube 上观看此快速入门视频！
他们还提供初级和中级课程，以便轻松跟进。
他们在 GitHub 上有 39k+ 个 Star，并为整体使用提供了两个包。
17. DOMPurify – 一个仅适用于 DOM、速度超快、耐受性极强的 HTML XSS 清理器。
DOMPurify 是一款仅适用于 DOM、速度超快、耐受性极强的 XSS 清理程序，适用于 HTML、MathML 和 SVG。作为开发人员，我们需要它来确保应用程序足够安全。
DOMPurify 可净化 HTML 并防止 XSS 攻击。
您可以向 DOMPurify 提供一串充满脏 HTML 的字符串，它将返回一串干净的 HTML 字符串（除非另有配置）。
DOMPurify 将删除所有包含危险 HTML 的内容，从而防止 XSS 攻击和其他恶意行为。而且速度非常快。
它们利用浏览器提供的技术并将其转化为 XSS 过滤器。浏览器越快，DOMPurify 就越快。
DOMPurify 用 JavaScript 编写，适用于所有现代浏览器（Safari（10+）、Opera（15+）、Edge、Firefox 和 Chrome - 以及几乎所有使用 Blink、Gecko 或 WebKit 的其他浏览器）。它不会在 MSIE 或其他旧版浏览器上崩溃。它只是什么也不做。
从以下 npm 命令开始。
npm install dompurify
npm install jsdom
// or use the unminified development version
<script type="text/javascript" src="src/purify.js"></script>
您可以这样使用它。
const createDOMPurify = require('dompurify');
const { JSDOM } = require('jsdom');
const window = new JSDOM('').window;
const DOMPurify = createDOMPurify(window);
const clean = DOMPurify.sanitize('<b>hello there</b>');
如果遇到问题，请参阅文档。他们已记录了使用脚本或在服务器端运行它。
使用起来也非常简单。DOMPurify 于 2014 年 2 月启动，目前已达到 v3.1.0 版本。
这涉及很多概念，我非常想探索它们。如果您有任何与此相关的令人兴奋的事情，请告诉我。
我发现的另一个有用的替代方案是validator.js。
他们在 GitHub 上有 12k+ 颗星，被 300k+ 开发人员使用，每周下载量达 5,475k+，这使得他们极度可信。
18. OpenDevin——少写代码，多做事。
这是一个开源项目，旨在复制 Devin，一个能够执行复杂工程任务并与用户积极合作进行软件开发项目的自主 AI 软件工程师。该项目希望通过开源社区的力量复制、增强和创新 Devin。
只是想让你知道，这是在 Devin 被介绍之前发生的。
您可以阅读包含要求的安装说明。
他们使用 LiteLLM，因此您可以使用任何基础模型运行 OpenDevin，包括 OpenAI、Claude 和 Gemini。
如果您想为 OpenDevin 做出贡献，可以查看演示和贡献指南。
它在 GitHub 上拥有 10.7k+ 颗星，并且正在快速增长。
19.Amplification——后端开发平台。
我想我们都同意，如果要达到标准，设置后端并从头开始做是很困难的。
我知道 Appwrite 和 Supabase 在功能方面要好得多，但每个案例都是独一无二的，这可能比那些更受欢迎。
Amplication 旨在彻底改变可扩展且安全的 Node.js 应用程序的创建方式。
它们消除了重复的编码任务，并提供了可用于生产的基础设施代码，这些代码经过精心定制，符合您的规范并遵循行业最佳实践。
其用户友好的界面促进了 API、数据模型、数据库、身份验证和授权的无缝集成。
Amplication 基于灵活的插件架构，可以轻松定制代码并提供大量集成选项。
他们还提供了分步教程，帮助您使用 Angular 或 React 构建应用程序。
Amplification 在 GitHub 上拥有 13k+ 颗星，并且发布了 170 多个版本，因此它们在不断发展。
20. Embla Carousel - 具有极佳流畅动作的简易旋转木马库。
我们都在应用程序中使用轮播，有时会切换到网格布局，因为轮播并不总是好看，但这会改变您对轮播的看法。
我了解 Embla Carousel 是因为 Shadcn/ui 在他们的 UI 系统中使用了它。
Embla Carousel 是一个基本的轮播库，具有流畅的动作和出色的滑动精度。它与库无关、无依赖性，并且 100% 开源。
如果您不确定，我建议您查看基本的实时示例。
我最喜欢的是视差，它能带来非常酷且平滑的过渡。
它们支持 CDN、react、Vue、Svelte 和 Solid。
使用以下 npm 命令 (react) 开始。
npm install embla-carousel-react --save
您可以这样使用它。
Embla Carousel 提供了方便的 useEmblaCarousel 钩子，可与 React 无缝集成。 最小设置需要一个溢出包装器和一个滚动容器。
该useEmblaCarousel钩子将 Embla Carousel 选项作为第一个参数。您还需要使用 useEffect 访问 API
import React, { useEffect } from 'react'
import useEmblaCarousel from 'embla-carousel-react'
export function EmblaCarousel() {
const [emblaRef, emblaApi] = useEmblaCarousel({ loop: false })
useEffect(() => {
if (emblaApi) {
console.log(emblaApi.slideNodes()) // Access API
}
}, [emblaApi])
return (
<div className="embla" ref={emblaRef}>
<div className="embla__container">
<div className="embla__slide">Slide 1</div>
<div className="embla__slide">Slide 2</div>
<div className="embla__slide">Slide 3</div>
</div>
</div>
)
}
他们还提供了一组插件，您可以添加这些插件来实现自动播放等额外功能。
npm install embla-carousel-autoplay --save
import React, { useEffect } from 'react'
import useEmblaCarousel from 'embla-carousel-react'
import Autoplay from 'embla-carousel-autoplay'
export function EmblaCarousel() {
const [emblaRef] = useEmblaCarousel({ loop: false }, [Autoplay()])
return (
<div className="embla" ref={emblaRef}>
<div className="embla__container">
<div className="embla__slide">Slide 1</div>
<div className="embla__slide">Slide 2</div>
<div className="embla__slide">Slide 3</div>
</div>
</div>
)
}
查找完整的插件列表，包括自动滚动和滚轮手势。
您可以阅读文档和指南，了解如何实现不同部分，例如断点或上一个/下一个按钮。
最让我惊讶的是，您可以使用他们的生成器，使用您自己的一组选项来生成自定义轮播。
他们在 GitHub 上有 4.9K 个星，有 26000 多名开发人员在使用。如果我必须使用一个，我肯定会使用这个。
21. Documenso - 开源 DocuSign 替代品。
动态图片
如果您从事自由职业并需要签署协议，那么这是最佳选择。我们不应该浪费时间，而应该专注于重要的事情。
数字签署文件应该快速、简单，并且应该成为全球签署的每份文件的最佳做法。
今天从技术上讲这相当容易，但它也为每个签名引入了一个新的参与方：签名工具提供商。
该项目的技术栈包括 TypeScript、Next.js、Prisma、Tailwind CSS、shadcn/ui、NextAuth.js、react-email、tRPC、@documenso/pdf-sign、React-PDF、PDF-Lib、Stripe 和 Vercel。
免费套餐允许您每月签署 10 份文件，这已经足够了。
您可以阅读本文来了解如何设置项目。
您可以阅读文档。
我知道这不是一个非常广泛的用例，但你仍然可以从代码中学习，所以这始终是一个加分点。
它们在 GitHub 上有 5.8k+ 颗星，并且即将v1.5发布。
虽然不是很受欢迎，但非常有用。
呼！
我花了很长时间才写完。希望你喜欢。
我明白人工智能工具有时有点过头了，但我们应该利用它们来简化我们的工作。我的意思是，我们做的对，就是让生活变得更轻松。
我尝试涵盖各种工具。
无论如何，请告诉我们您的想法，您是否计划在工作流程中使用这些工具？
祝您度过愉快的一天！下次再见。