studio de langage graphique
NULL
LangGraph Studio offre une nouvelle façon de développer des applications LLM en fournissant un IDE d'agent spécialisé qui permet la visualisation, l'interaction et le débogage d'applications agentiques complexes.
Grâce aux graphiques visuels et à la possibilité de modifier l'état, vous pouvez mieux comprendre les flux de travail des agents et itérer plus rapidement. LangGraph Studio s'intègre à LangSmith afin que vous puissiez collaborer avec vos coéquipiers pour déboguer les modes de défaillance.
En version bêta, LangGraph Studio est disponible gratuitement pour tous les utilisateurs de LangSmith, quel que soit le niveau de forfait. Inscrivez-vous à LangSmith ici.
Téléchargez le dernier fichier .dmg de LangGraph Studio en cliquant ici ou en visitant la page des versions.
Actuellement, seul macOS est pris en charge. La prise en charge de Windows et Linux sera bientôt disponible. Nous dépendons également du fonctionnement de Docker Engine. Actuellement, nous ne prenons en charge que les environnements d'exécution suivants :
LangGraph Studio nécessite Docker-compose version 2.22.0+ ou supérieure. Veuillez vous assurer que Docker Desktop ou Orbstack est installé et exécuté avant de continuer.
Pour utiliser LangGraph Studio, assurez-vous d'avoir configuré un projet avec une application LangGraph.
Pour cet exemple, nous utiliserons ici cet exemple de référentiel qui utilise un fichier requirements.txt pour les dépendances :
git clone https://github.com/langchain-ai/langgraph-example.git Si vous souhaitez plutôt utiliser un fichier pyproject.toml pour gérer les dépendances, vous pouvez utiliser cet exemple de référentiel.
git clone https://github.com/langchain-ai/langgraph-example-pyproject.git Vous souhaiterez ensuite créer un fichier .env avec les variables d'environnement pertinentes :
cp .env.example .env Vous devez ensuite ouvrir le fichier .env et le remplir avec les clés API OpenAI, Anthropic et Tavily pertinentes.
Si vous les avez déjà définis dans votre environnement, vous pouvez les enregistrer dans ce fichier .env avec les commandes suivantes :
echo " OPENAI_API_KEY= " $OPENAI_API_KEY " " > .env
echo " ANTHROPIC_API_KEY= " $ANTHROPIC_API_KEY " " >> .env
echo " TAVILY_API_KEY= " $TAVILY_API_KEY " " >> .envRemarque : n'ajoutez PAS de LANGSMITH_API_KEY au fichier .env. Nous le ferons automatiquement pour vous lorsque vous vous authentifierez, et la configuration manuelle de cette option peut provoquer des erreurs.
Une fois que vous avez configuré le projet, vous pouvez l'utiliser dans LangGraph Studio. Allons-y !
Lorsque vous ouvrez l'application de bureau LangGraph Studio pour la première fois, vous devez vous connecter via LangSmith.
Une fois que vous vous êtes authentifié avec succès, vous pouvez choisir le dossier d'application LangGraph à utiliser — vous pouvez soit le glisser-déposer, soit le sélectionner manuellement dans le sélecteur de fichiers. Si vous utilisez l'exemple de projet, le dossier sera langgraph-example .
Important
Le répertoire d'application que vous sélectionnez doit contenir le fichier langgraph.json correctement configuré. Voir plus d'informations sur la façon de le configurer ici et sur la façon de configurer une application LangGraph ici.
Une fois que vous avez sélectionné un projet valide, LangGraph Studio démarrera un serveur API LangGraph et vous devriez voir une interface utilisateur avec votre graphique rendu.
Nous pouvons maintenant exécuter le graphique ! LangGraph Studio vous permet d'exécuter votre graphique avec différentes entrées et configurations.
Pour démarrer une nouvelle exécution :
agent . La liste des graphiques correspond aux clés graphs dans votre configuration langgraph.json .Input .Submit pour appeler le graphique sélectionné.La vidéo suivante montre comment démarrer une nouvelle exécution :
Pour modifier la configuration d'une exécution graphique donnée, appuyez sur le bouton Configurable dans la section Input . Cliquez ensuite sur Submit pour appeler le graphique.
Important
Pour que le menu Configurable soit visible, assurez-vous de spécifier le schéma de configuration lors de la création StateGraph . Vous pouvez en savoir plus sur la façon d'ajouter un schéma de configuration à votre graphique ici.
La vidéo suivante montre comment modifier la configuration et démarrer une nouvelle exécution :
Lorsque vous ouvrez LangGraph Studio, vous serez automatiquement dans une nouvelle fenêtre de fil de discussion. Si vous avez un fil de discussion existant ouvert, suivez ces étapes pour créer un nouveau fil de discussion :
+ pour ouvrir un nouveau menu de fil de discussion.La vidéo suivante montre comment créer un fil de discussion :
Pour sélectionner un fil de discussion :
New Thread / Thread en haut du volet de droite pour ouvrir une liste déroulante de liste de fils de discussion.La vidéo suivante montre comment sélectionner un fil de discussion :
LangGraph Studio vous permet de modifier l'état du thread et de créer des threads pour créer une exécution de graphique alternative avec l'état mis à jour. Pour le faire :
Fork pour mettre à jour l'état et créer une nouvelle exécution de graphique avec l'état mis à jour.La vidéo suivante montre comment modifier un fil de discussion dans le studio :
Vous souhaiterez peut-être exécuter votre graphique étape par étape ou arrêter l'exécution du graphique avant/après l'exécution d'un nœud spécifique. Vous pouvez le faire en ajoutant des interruptions. Les interruptions peuvent être définies pour tous les nœuds (c'est-à-dire parcourir l'exécution de l'agent étape par étape) ou pour des nœuds spécifiques. Une interruption dans LangGraph Studio signifie que l'exécution du graphique sera interrompue avant et après l'exécution d'un nœud donné.
Pour parcourir l'exécution de l'agent étape par étape, vous pouvez ajouter des interruptions à l'ensemble ou à un sous-ensemble de nœuds dans le graphique :
Interrupt .Interrupt on all .La vidéo suivante montre comment ajouter des interruptions à tous les nœuds :
+ apparaître sur le côté gauche du nœud.+ pour appeler le graphique sélectionné.Input /configuration et en cliquant sur SubmitLa vidéo suivante montre comment ajouter des interruptions à un nœud spécifique :
Pour supprimer l'interruption, suivez simplement la même étape et appuyez sur le bouton x sur le côté gauche du nœud.
En plus d'interrompre un nœud et de modifier l'état du graphique, vous souhaiterez peut-être prendre en charge les flux de travail avec intervention humaine avec la possibilité de mettre à jour manuellement l'état. Voici une version modifiée de agent.py avec des nœuds agent et human , où l'exécution du graphique sera interrompue sur le nœud human . Cela vous permettra d'envoyer des entrées dans le cadre du nœud human . Cela peut être utile lorsque vous souhaitez que l'agent obtienne une entrée de l'utilisateur. Cela remplace essentiellement la façon dont vous pourriez utiliser input() si vous l'exécutiez à partir de la ligne de commande.
from typing import TypedDict , Annotated , Sequence , Literal
from langchain_core . messages import BaseMessage , HumanMessage
from langchain_anthropic import ChatAnthropic
from langgraph . graph import StateGraph , END , add_messages
class AgentState ( TypedDict ):
messages : Annotated [ Sequence [ BaseMessage ], add_messages ]
model = ChatAnthropic ( temperature = 0 , model_name = "claude-3-sonnet-20240229" )
def call_model ( state : AgentState ) -> AgentState :
messages = state [ "messages" ]
response = model . invoke ( messages )
return { "messages" : [ response ]}
# no-op node that should be interrupted on
def human_feedback ( state : AgentState ) -> AgentState :
pass
def should_continue ( state : AgentState ) -> Literal [ "agent" , "end" ]:
messages = state [ 'messages' ]
last_message = messages [ - 1 ]
if isinstance ( last_message , HumanMessage ):
return "agent"
return "end"
workflow = StateGraph ( AgentState )
workflow . set_entry_point ( "agent" )
workflow . add_node ( "agent" , call_model )
workflow . add_node ( "human" , human_feedback )
workflow . add_edge ( "agent" , "human" )
workflow . add_conditional_edges (
"human" ,
should_continue ,
{
"agent" : "agent" ,
"end" : END ,
},
)
graph = workflow . compile ( interrupt_before = [ "human" ])La vidéo suivante montre comment envoyer manuellement des mises à jour d'état (c'est-à-dire des messages dans notre exemple) en cas d'interruption :
LangGraph Studio vous permet de modifier la configuration de votre projet ( langgraph.json ) de manière interactive.
Pour modifier la configuration depuis le studio, suivez ces étapes :
Configure en bas à droite. Cela ouvrira un menu de configuration interactif avec les valeurs qui correspondent au langgraph.json existant.Save and Restart pour recharger le serveur API LangGraph avec la configuration mise à jour.La vidéo suivante montre comment modifier la configuration du projet depuis le studio :
Avec LangGraph Studio, vous pouvez modifier le code de votre graphique et synchroniser les modifications en direct avec le graphique interactif.
Pour modifier votre graphique depuis le studio, suivez ces étapes :
Open in VS Code en bas à droite. Cela ouvrira le projet actuellement ouvert dans le studio LangGraph..py dans lesquels le graphique compilé est défini ou aux dépendances associées.La vidéo suivante montre comment ouvrir l'éditeur de code depuis le studio :
Après avoir modifié le code sous-jacent, vous pouvez également rejouer un nœud dans le graphique. Par exemple, si un agent répond mal, vous pouvez mettre à jour l'implémentation du nœud d'agent dans votre éditeur de code et le réexécuter. Cela peut rendre beaucoup plus facile l’itération sur des agents de longue durée.
LangGraph Studio s'appuie sur Docker Compose pour exécuter l'API, Redis et Postgres, qui à son tour crée son propre réseau. Ainsi, pour accéder aux services locaux, vous devez utiliser host.docker.internal comme nom d'hôte au lieu de localhost . Voir #112 pour plus de détails.
Par défaut, nous essayons de rendre l'image aussi petite que possible, donc certaines dépendances telles que gcc ou build-essentials sont absentes de l'image de base. Si vous devez installer des dépendances supplémentaires, vous pouvez le faire en ajoutant des instructions Dockerfile supplémentaires dans la section dockerfile_lines de votre fichier langgraph.json :
{
"dockerfile_lines": [
"RUN apt-get update && apt-get install -y gcc"
]
}
Voir Comment personnaliser Dockerfile pour plus de détails.
