はじめに この記事では、LangChain で Tools を呼び出す方法を紹介します。具体的には以下の記事を参考に記述します。 TypeScript / JavaScript での GitHub リポジトリーを公開している実装例はすくないので記事化しました。作業リポジトリはこちらです。 LangChain x TypeScript での実装例を以下の記事で紹介しています。 LangChain で 簡易LLMアプリを構築（Node.js） LangChain でチャットボットを構築（Node.js） LangChain で構造化データを取得（Node.js） LangChain で Tools 呼び出す（Node.js） LangChain で Runnable をシクエンシャルに結合（Node.js） LangChain で Runnable を並列実行（Node.js） LangCha

「MCP」の「TypeScript SDK」で「MCPサーバ」を構築する手順をまとめました。 ・macOS ・Node.js 18 以降 1. お天気サーバ現在のお天気データを提供する「MCPサーバ」を作成します。 2. セットアップセットアップ手順は、次のとおりです。 (1) プロジェクトの作成。 「Project name」は「weather-service」としました。 npx @modelcontextprotocol/create-server weather-server cd weather-server(3) 追加の依存関係のインストール。 npm install --save axios dotenv3. サーバの作成(1) 「types.ts」を作成。 ・weather-service/src/src/types.ts // OpenWeatherレスポンス expor

https://3rdpartyjs.connpass.com/event/289558/

最近諸事情あり業務でFirebase JS SDKのDatabase実装周りを読むことがあったので、備忘録的にブログ記事にしてみる。 初期化処理の雰囲気 Databaseまで含めると全体像があまりにでかすぎるので、とりあえず初期化処理周りだけを雰囲気でクラス図にしてみた。staticと書いてあるところはクラスではなくただ単にファイルとそこに定義されている関数であることを示している。 実際にDatabaseそのものの詳細な処理（コネクションハンドリングやら内部での状態管理など）はまた別で解説することとして、この図ではSDKの初期化に関連したクラスとメソッドのみを抜き出すことにした。 Firebase JS SDKの実装ではIoCコンテナとDIが設計において積極的に活用されており、独自のDIコンテナを内部実装している。ComponentというパッケージではDIコンテナの実装となるクラスがまとま

In this post we’ll walk through creating a custom JavaScript runtime. Let’s call it runjs. Think of it as building a (much) simplified version of deno itself. A goal of this post is to create a CLI that can execute local JavaScript files, read a file, write a file, remove a file and has simplified console API. Let’s get started. Update 2022-12-04: updated the code samples to the latest version of

js実行環境であるnodeはV8を使っている jsエンジンはソースコードをどうやって実行しているのか ここからが本題です。jsエンジンの裏側をのぞいてみましょう👀 全体像 下記が基本的な流れ V8って書いてあるけど、下記の基本的な流れはエンジンによらずほとんど同じはず もちろんそれぞれのフェーズで実装の違いは在る。“Optimize & Compile it”の具体的な実装などはエンジンにより異なる Benedikt Meurer; “An Introduction to Speculative Optimization in V8”; jsの面白いところは、ASTから直接コンパイルして実行されるわけでもなく、単純なインタプリタのようにコンパイルを挟まずに実行しているわけでもないところ。それに、なんだか見慣れない”Get feedback”というフェーズさえある……！ここがJIT com

I've taught JavaScript for a long time to a lot of people. Consistently the most commonly under-learned aspect of the language is the module system. There's a good reason for that. Modules in JavaScript have a strange and erratic history. In this post, we'll walk through that history and you'll learn modules of the past to better understand how JavaScript modules work today. Before we learn how to

後学のために自分の考えていることをまとめてみる。 考えられるパターン これまでの経験から以下4つのパターンがある。 ローカルStateでprop-drillingする ローカルStateかつイベント経由でデータ交換をする グローバルStoreとローカルStateを併用する グローバルStoreのみを使用する 1. ローカルStateでprop-drillingする propとしてコンポーネント間のデータをやりとりする手法。 ほぼすべてのUIコンポーネントを親からデータを受け取りDOMを出力するだけの純粋な関数として表現できるため、全体の設計自体はシンプルになる。手間は多いが魔法は少ない。 コンポーネントの粒度が小さいアプリケーションの場合にはいわゆるバケツリレーと揶揄されるデータの受け渡しが頻発し、これに嫌悪感を持つエンジニアもいる。 2. ローカルStateかつイベント経由でデータ交換を

www.npmjs.com validatable-recordというモジュールをすこし前に作った。Twitterでは軽く流したが、実際にはこれを作ろうと思ったモチベーションが少なからずあったので、自分自身の学びやのちのちの振り返りのためにも、そのモチベーションについてここに書き残しておきたい。 背景 このモジュールを作っていたとき、僕はチームでVue.jsを用いたSPAの開発をしていて、アプリケーション・フォームのバリデーション・ロジックの実装にとりかかろうとしていた。Vue.jsのバリデーション・モジュールの有名なものにはvue-validatorというものがあるらしく、検索すると上位にヒットし、スターも多い。 作者もVue.js界隈ではよく知られているkazuponさんである。このモジュールのいいところは、モジュール自体の出来もさることながら、バリデーション・ロジックの実装自体を全て

少し前からライブラリを読むトレーニングを始めたのですが、最近ようやく読み方がわかってきたので、やり始めた頃に知っておきたかったことをまとめます。 これから JavaScript/TypeScript で書かれたライブラリを読んでみようと思っている方の助けになれば嬉しいです。 「私はこういう道具を使ったり、こういう工夫をしています」みたいな感じの内容ですので、もし「もっといい読み方があるよ」みたいなのがありましたらIssueなどで教えていただきたいです。 （※ライブラリを読むにあたって、ブラウザの話と NodeJS の話があるのですが、似てる点がほとんどなのでごった煮します。） エントリポイントを探す ライブラリを読むにあたって そのライブラリが持つ module がどう協調して全体が作られるのか その関数は正確にはどういう挙動をするのか などを考えると、ユーザーから渡された入力や呼び出しが

みなさんTypeScriptでサーバアプリケーション（Node.js）のロジックを書く時に、異常系の表現をどのようにされていますでしょうか？ここでいう異常系とは、仕様上想定される異常のことです。準正常系と言ったりもするかと思います。 私はJavaScriptの延長でTypeScriptをはじめたので、最初は null や undefined を返したり throw を用いるやり方をしていましたが、次第にTypeScriptが持つ型を生かし、できるだけ型安全に異常系を表現したいと考えるようになりました。そして試行錯誤した結果、いい感じの落とし所に落ち着いたので、その内容についてお伝えしたいと思います。 また記事の後半では、異常系の型を実装する中でハマった点についてもお伝えしたいと思います。 TypeScriptの異常系表現について 1. nullやundefinedを返す 冒頭でも述べたよう

年末年始の時間を使って実験していたこと。 tl;dr vscode をカスタマイズして静的サイトとしてデプロイしたい。やった。公式にない永続化層も作った。 できた。ここで試せる。 https://mizchi-vscode-playground.netlify.com/ やりたかったこと フロントエンドにまつわるものはフロントエンドで作業を完結したい。なので vscode がブラウザで動いてほしい。 vscode をカスタマイズしたものを各自が自由にデプロイできると、様々な可能性がある。インストールの手間を省いたプログラミング教育用のツールだったり、専用の開発環境だったり、その他諸々。 問題 この用途で期待していた vscode online が使いづらかった。MS のアカウントを要求されたり、Docker コンテナの Enviroment を作ったりする必要があり、面倒だった。そもそもリ

過去に「NoRedInk*1の筋肉の人」としておなじみリチャード・フェルドマンをフィーチャーする記事を書いたので、今度は自分をフィーチャーしようと思う。 www.izumisy.work おすすめはやはり一番最後の「jQueryからElmまで」だが、正直このスライドはElmに関する説明成分が少なかったと反省しているところがある。なので、個人的にはこの記事で並べている順番に見てもらうほうが、Elmに対するわかりが生じやすいと思う。 Elm, the functional frontend Elmの基本的な部分をざっくり説明するスライド。このスライドは関数型プログラミングカンファレンス2019で使った。Elm意外にもRustやElixirなどの関数型プログラミングのエッセンスを持つ言語の人たちとコラボレーションするタイプのイベントだったので、関数型的な部分に言及するのは少なめでElmの良さをア

現代的JavaScriptおれおれアドベントカレンダー2017 – 21日目 概要 基本的な使い方は Map や Set と一緒です。キーに使われるオブジェクトの参照カウントを増やさないとかそういうアレで、「弱い参照」で保持します。メモリリーク対策とかに。 Map 、 Set との違い 基本は Map 、 Set と同様なんだけど、キーが弱い参照（後述）になります。 できること: get() (WeakMap) set() (WeakMap) add() (WeakSet) has() delete() できないこと: size forEach() clear() keys() 他 キーはオブジェクトのみ Map は何でもキーに使えたんだけど、 WeakMap はオブジェクトだけです。 まあ意味ないしね。 弱い参照？ JavaScript界隈では新しい概念のはず。 プログラム内で使ってる情

Single Page Application + Server Rendering yahoo/fluxible を使って、Single Page Application と Server Rendering の良いとこ取りのアーキテクチャを目指す。ある程度の複雑性と引き換えに、双方の利点で双方の欠点を打ち消し合うことができるため、全体的には良好なユーザーインタラクションを期待できる構成。 なぜ Single Page Application なのか 画面遷移時するたびにJavaScript/CSS のパースと評価をしなくて良くなる 画面遷移時のトランジションを柔軟に適用できる 画面遷移をまたがった実装が可能になる（あくまで可能になるだけ） なぜ Server Rendering するのか 初期表示の Critical Rendering Path を短縮できる SEO における保守信仰