」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 使用 LangSmith Hub 改變您的工作流程:JavaScript 工程師的遊戲規則改變者

使用 LangSmith Hub 改變您的工作流程:JavaScript 工程師的遊戲規則改變者

發佈於2024-09-29
瀏覽:639

分散的人工智能提示是否会减慢您的开发进程?了解 LangChain Hub 如何彻底改变您的工作流程,为 JavaScript 工程师提供无缝且高效的即时管理。


介绍

想象一下管理一个项目,其中关键信息分散在文件中。令人沮丧,对吧?这就是处理 AI 提示的开发人员面临的现实。 LangChain Hub 集中即时管理,转变工作流程,就像 GitHub 进行代码协作一样。

LangChain Hub 提供了一个直观的界面,用于上传、浏览、拉取、协作、版本控制和组织提示。这不仅简化了工作流程,还促进了协作和创新,使其成为必不可少的工具。

主要特点和优点

LangChain Hub 是一款功能强大的工具,专为 JavaScript 开发人员设计,用于高效地集中、管理和协作 AI 提示。

社区驱动的创新

探索其他开发人员的提示,获得新的想法和解决方案。学习新技术、改进现有提示并营造协作环境。

集中及时管理

LangChain Hub 将您所有的 AI 提示集中在一个屋檐下,消除分散文件和碎片存储的混乱。将所有内容整齐地组织在一处,管理您的提示从未如此简单。

用户友好的界面

由于其直观的设计,LangChain Hub 的导航变得轻而易举。上传、浏览和管理提示非常简单,可提高您的工作效率并最大限度地减少学习该工具所花费的时间。

协作与共享

LangChain Hub 让您可以轻松地与团队共享提示并进行协作。这种无缝共享促进创新和集体解决问题,使团队合作更加高效和有效。

版本控制

使用 LangChain Hub 的版本控制,永远不会丢失对即时迭代的跟踪。您可以轻松恢复到以前的版本或监控一段时间内的更改,确保您始终可以访问提示的最佳版本。

增强的搜索和过滤

使用高级搜索和过滤选项立即找到您需要的提示。您可以按用例、类型、语言和模型过滤提示,确保您快速访问最相关的资源。这些功能可以节省您的时间并增强您的工作流程,使即时管理更加高效并根据您的特定项目需求进行定制。

定制化和灵活性

轻松根据您的具体项目要求定制提示。 LangChain Hub的定制选项确保您的提示无缝融入您的开发流程,适应您的独特需求。

在您的项目中使用

我们来建立一个项目,使用LangChain Hub中的提示模板来凸显它的价值。
我们将首先使用我为入门:LangSmith for JavaScript LLM Apps 一文创建的演示项目。虽然我鼓励您阅读该文章,但并不需要您继续阅读。

  1. 克隆仓库: git clone [email protected]:kenzic/simple-langsmith-demo.git
  2. cd simple-langsmith-demo
  3. 查看演示分支: git checkout -b langchain-hub-demo origin/langchain-hub-demo
  4. 安装依赖项yarn或npm i
  5. 注册 LangSmith 帐户
  6. 获取 LangSmith API 密钥
  7. 获取 OpenAI API 密钥
  8. 将 .env.example 移至 .env 并填写以下值:
LANGCHAIN_PROJECT="langsmith-demo" # Name of your LangSmith project
LANGCHAIN_TRACING_V2=true # Enable advanced tracing features
LANGCHAIN_API_KEY= # Your LangSmith API key

OPENAI_API_KEY= # Your OpenAI API key

演示应用程序以《辛普森一家》中伯恩斯先生的声音回答了问题“法国的首都是哪里?”。为此,我们使用以下提示:

Act as a world-class expert in the field and provide a detailed response to the inquiry using the context provided.
The tone of your response should be that of The Simpsons' Mr. Burns.


{context}

提示目前已硬编码在应用程序中,目前可以管理。然而,在实际应用中,这种方法可能变得难以管理。当我们向链中添加更多步骤和多个提示时,它很快就会变得混乱且难以维护。因此,我们将提示移至LangChain Hub。

如果您按照上述步骤操作,您应该拥有一个 LangSmith 帐户。

前往 smith.langchain.com/hub 并点击“新提示”。

Transform Your Workflow with LangSmith Hub: A Game-Changer for JavaScript Engineers

然后,您需要为提示指定名称、设置可见性(默认私有)、描述、自述文件、用例、语言和模型。注意:所有者是“@kenzic”,这对您来说会有所不同。请参阅屏幕截图了解值。

Transform Your Workflow with LangSmith Hub: A Game-Changer for JavaScript Engineers

创建提示后,您需要选择提示类型。对于此任务,我们将选择“聊天提示”。

Transform Your Workflow with LangSmith Hub: A Game-Changer for JavaScript Engineers

创建一条“系统”消息,其值为:

Act as a world-class expert in the field and provide a detailed response to the inquiry using the context provided.
The tone of your response should be that of The Simpsons' Mr. Burns.


{context}

接下来,创建一条“人类”消息,其值为:

Please address the following inquiry:\n{input}

Transform Your Workflow with LangSmith Hub: A Game-Changer for JavaScript Engineers

在我们提交之前,我们可以在操场上进行测试。在消息链的右侧,您会注意到“输入”部分,其中包含我们在消息中指定的变量。为了确认它按预期工作,我测试了以下内容:

上下文: 法国首都是斯普林菲尔德。这是巴黎,但在 2024 年发生了变化。

输入:法国的首都是哪里

定义输入后,在“设置”下,您将需要选择我们要测试的模型。选择 GPT-3.5-turbo。为此,您需要通过单击“Secrets & API Keys”按钮来添加 OpenAI API 密钥。太好了,现在我们准备测试了。单击“开始”按钮并观察它生成输出。您应该看到类似以下内容:

啊,是的,法国的首都,或者我应该说,斯普林菲尔德!巴黎可能曾经是法国的首都,但到 2024 年,斯普林菲尔德将成为法国新首都。如此巨大的变化肯定会引起质疑和质疑,但请放心,决定已经做出,斯普林菲尔德现在拥有法国首都的称号。真是太令人愉快了!

一旦我们对提示感到满意,我们就需要提交它。只需点击“提交”按钮即可!

太好了,现在我们已经完成了提示,我们需要更新代码以引用它而不是硬编码的提示模板。

Transform Your Workflow with LangSmith Hub: A Game-Changer for JavaScript Engineers

首先,我们需要导入 hub 函数以将模板拉入代码中:

import * as hub from "langchain/hub";

接下来我们把代码中的ChatPromptTemplate删除掉,替换为:

const answerGenerationChainPrompt = await hub.pull(
  "[YOURORG]/mr-burns-answer-prompt"
);

注意:您也可以删除 ANSWER_CHAIN_SYSTEM_TEMPLATE 变量

最后我们来测试一下吧!运行yarn start 来执行脚本。如果一切正常,您将看到伯恩斯先生的声音输出,告诉您法国的首都是巴黎。

如果您想更进一步,您可以通过版本锁定提示。为此,只需将冒号和版本号附加到名称末尾,如下所示:

const answerGenerationChainPrompt = await hub.pull(
  "[YOURORG]/mr-burns-answer-prompt:[YOURVERSION]"
);

// for me it looks like:
const answerGenerationChainPrompt = await hub.pull(
  "kenzic/mr-burns-answer-prompt:d123dc92"
);

就是这样!

下一步

我们探讨了 LangChain Hub 如何集中即时管理、增强协作并集成到您的工作流程中。为了提高 LangChain Hub 的效率,请考虑更深入地研究定制和集成的可能性。

总结

LangChain Hub不仅仅是一个工具;它是人工智能开发创新与协作的催化剂。拥抱这个革命性的平台,将您的 JavaScript LLM 应用程序提升到新的高度。

在本指南中,我们解决了如何:

  1. 使用LangChain Hub有效地集中和管理您的AI提示。
  2. 增强开发团队内的协作和版本控制。
  3. 将提示管理无缝集成到您现有的开发工作流程中。

继续构建和实验,我很高兴看到您将如何突破 AI 和 LangChain Hub 的可能性!


要保持联系并分享您的旅程,请随时通过以下渠道联系:

  • ?‍? LinkedIn:跟我一起了解有关法学硕士发展和技术创新的更多见解。
  • ? GitHub:探索我的项目并为正在进行的工作做出贡献。
版本聲明 本文轉載於:https://dev.to/kenzic/transform-your-workflow-with-langsmith-hub-a-game-changer-for-javascript-engineers-4a8l?1如有侵犯,請聯絡study_golang@163 .com刪除
最新教學 更多>
  • 將 AdoptiumJDK 原始碼載入到 Eclipse IDE 中
    將 AdoptiumJDK 原始碼載入到 Eclipse IDE 中
    AdoptiumJDK 的安裝程式中沒有內建原始程式碼文件,如果您需要透過 Eclipse IDE 檢查如何使用任何本機 JDK 方法,這是不可能的。 依照以下步驟在Eclipse IDE中載入原始碼: 造訪 AdoptiumJDK 官方網站並按所需的 JDK 版本進行過濾,在我的例子中是 11....
    程式設計 發佈於2024-11-06
  • 絕對定位與相對定位:為什麼它們的行為如此不同?
    絕對定位與相對定位:為什麼它們的行為如此不同?
    了解絕對位置與相對位置:寬度、高度等處理網頁上的元素定位時,了解這些概念絕對位置與相對位置的區別至關重要。讓我們深入探討經常引起疑問的四個關鍵點:1。相對寬度與絕對寬度為何相對定位的div會自動佔據100%寬度,而絕對定位的div只佔據內容寬度? 原因是設定位置:absolute 從文件結構的正常流...
    程式設計 發佈於2024-11-06
  • Python、Node js 和 PHP 中用於驗證碼識別的頂層模組
    Python、Node js 和 PHP 中用於驗證碼識別的頂層模組
    在我们的自动化时代,大多数解决方案都可以免费找到,我现在不是在谈论解决数学问题,而是稍微复杂的任务,例如数据解析,和我们的例子一样,还有 recapcha 识别。但如何找到一个好的模块呢?毕竟,随着技术的发展,每个人都得到了它,无论是认真的开发人员还是彻头彻尾的骗子。 我分析了验证码识别模块的市场,...
    程式設計 發佈於2024-11-06
  • 以下是一些標題選項,重點關注問題格式和核心內容:

**選項 1(直接且簡潔):**

* **如何在 PHP 中有效率地循環多維數組?

**選項2
    以下是一些標題選項,重點關注問題格式和核心內容: **選項 1(直接且簡潔):** * **如何在 PHP 中有效率地循環多維數組? **選項2
    在 PHP 中循環多維數組多維數組可能是解析的一個挑戰,特別是在處理不同深度級別和非順序索引時。考慮一個保存事件資訊的數組,其中可以包含多個藝術家及其相應的鏈接,如下所示:array(2) { [1]=> array(3) { ["eventID"]...
    程式設計 發佈於2024-11-06
  • 透過 Linting 提高程式碼品質
    透過 Linting 提高程式碼品質
    Whenever I start a new project, one of the first things I do is put in place a code linter. For the uninitiated, linters analyze your project and call...
    程式設計 發佈於2024-11-06
  • 如何有效執行JavaScript中的回呼函數?
    如何有效執行JavaScript中的回呼函數?
    理解JavaScript 中回呼函數的本質在JavaScript 中,回呼函數提供了一種方便的機制,可以在另一個函數完成後執行一個函數它的執行。雖然概念很簡單,但回調的最佳實作有時可能不清楚。讓我們探討一個簡化的範例:var myCallBackExample = { myFirstFunc...
    程式設計 發佈於2024-11-06
  • Vue 框架簡介
    Vue 框架簡介
    What is Vue? from the Vue website Vue is a "progressive" JavaScript framework for building user interfaces. It works by build...
    程式設計 發佈於2024-11-06
  • 逃離戲劇:為什麼 HydePHP 是您的 WordPress 替代品
    逃離戲劇:為什麼 HydePHP 是您的 WordPress 替代品
    WordPress 戲劇 隨著 WordPress 生態系統面臨前所未有的混亂,許多開發人員和網站所有者正在重新考慮他們的平台選擇。最近 WordPress 共同創辦人 Matt Mullenweg 和 WP Engine 之間的衝突凸顯了 WordPress 社群內的控制、貢獻和...
    程式設計 發佈於2024-11-06
  • Go 中的並發模式;工作池和扇出/扇入
    Go 中的並發模式;工作池和扇出/扇入
    Go 以其卓越的並發模型而聞名,但許多開發人員只專注於 goroutine 和通道。然而,工作池和扇出/扇入等並發模式提供了真正的效率。 本文將介紹這些進階概念,幫助您最大限度地提高 Go 應用程式的吞吐量。 為什麼並發很重要 並發允許程式有效率地執行任務,特別是在處理 I/O ...
    程式設計 發佈於2024-11-06
  • 如何在 C++ 中將單一字元轉換為 std::string?
    如何在 C++ 中將單一字元轉換為 std::string?
    從單字建立字串從單一字元建立字串人們可能會遇到需要將表示為char 資料類型的單字轉換為std:: string。從字串中取得字元很簡單,只需在所需位置索引字串即可。然而,相反的過程需要不同的方法。 要從單字建立std::string,可以使用多種方法:char c = 34; std::strin...
    程式設計 發佈於2024-11-06
  • JavaScript 變數名稱中美元符號的含義是什麼?
    JavaScript 變數名稱中美元符號的含義是什麼?
    JavaScript 變數名稱中美元符號的意義在程式設計領域,命名約定的使用對於增強程式碼至關重要可讀性並遵循最佳實務。在 JavaScript 中,美元符號 ($) 通常會作為變數名稱的前綴出現,特別是引用 jQuery 物件的變數名稱。 美元符號的用途是什麼? 與流行的看法相反,JavaScri...
    程式設計 發佈於2024-11-06
  • 如何重新排列 CSS 網格佈局中的列以實現移動響應?
    如何重新排列 CSS 網格佈局中的列以實現移動響應?
    在CSS 網格佈局中重新排序列在CSS 網格佈局中,有多種技術可以修改列的順序以實現具體佈局。本問題探討了重新排列行動佈局列的可能性,例如將列移到底部,同時在桌面佈局上保持所需的列順序。 解決方案選項:grid-template-areas: 此屬性可讓您在網格內定義命名區域,然後將網格項目指派給這...
    程式設計 發佈於2024-11-06
  • Hacktoberfest 週線上拍賣系統
    Hacktoberfest 週線上拍賣系統
    概述 在 Hacktoberfest 的第三週,我決定為一個較小但有前途的專案做出貢獻:線上拍賣系統。儘管該專案仍處於早期階段,但它已經顯示出成長潛力,而且我看到了幫助改進其程式碼庫的機會。我的任務是透過減少冗餘程式碼和改進整體結構來重構項目,使其更具可維護性和可擴展性。 ...
    程式設計 發佈於2024-11-06
  • 如何使用“exception_ptr”在 C++ 執行緒之間傳播異常?
    如何使用“exception_ptr”在 C++ 執行緒之間傳播異常?
    在C 中的線程之間傳播異常當從主線程調用的函數生成多個線程時,就會出現在C 中的執行緒之間傳播異常的任務用於CPU 密集型工作的工作執行緒。挑戰在於處理工作執行緒上可能發生的異常並將其傳播回主執行緒以進行正確處理。 傳統方法一種常見方法是手動捕獲工作線程上的各種異常,記錄它們的詳細信息,然後在主線程...
    程式設計 發佈於2024-11-06
  • 如何使用 3D CSS 轉換來修復 Firefox 中的鋸齒狀邊緣?
    如何使用 3D CSS 轉換來修復 Firefox 中的鋸齒狀邊緣?
    使用3D CSS 變換時Firefox 中的鋸齒狀邊緣與Chrome 中使用CSS 變換時的鋸齒狀邊緣問題類似,Firefox 在3D 變換中也出現了這個問題。背面可見性作為 Chrome 中的潛在解決方案,在 Firefox 中被證明無效。 解決方案:要在Firefox 中緩解此問題,您可以實施以...
    程式設計 發佈於2024-11-06

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3