もふもふ技術部

IT技術系mofmofメディア

Next.js

TanStack FormでNext.jsのServer Actionsを使ってみた

はじめに 準備 create-next-app tanstack-form インストール フォーム実装 zod のスキーマを定義 FormFactory オブジェクトを作成 Server Action を定義 フォームコンポーネントを作成 ページでフォームコンポーネントを使用する 動作確認 クライアントサイ…

LangChainとNext.jsで簡単なチャットBotを作ってみる

JavaScript版のLangChainを触る機会があったので、備忘録も兼ねて簡単なチャットBOTを作ってみます。 構成 さくっと動かしたいのでNext.jsのAPI Routes上でLangChainを使います。 簡略化のためにチャット履歴はメモリ上に保存します。※Nextを再起動するとチ…

Next.jsでログイン機能の実装 NextAuth.js

Next.jsで使える認証ライブラリ、next-authでGoogle認証を試してみます。 公式を参考にしつつ動くところまでやってみます。永続化とかはしません。 ちなみに今回の内容はこのあたりに何もかも書いてあります。 https://next-auth.js.org/getting-started/exa…

Next.js を使ってみる(TypeScript + firebase + Recoil + vercel) その1

バックエンドはRuby on Railsを主に使っていますがフロントエンドはフレームワークをあまりつかっていないことに気づいたので試してみる 環境構築 TypeScriptを導入する tsconfig.jsonを作成する Firebaseでユーザーをいい感じに認証させる ユーザー認証 Rec…