10 分で AI アプリケーションを構築: ステップバイステップ ガイド

Gemini、Nodejs、AI、ガイド
10 分で AI アプリケーションを構築: ステップバイステップ ガイド cover image

ChatGPT と Google Gemini の登場以来、これらのモデルを活用して多くのアプリが起動されるのを見てきました。この手法はアービトラージと呼ばれるもので、AI が実行できる複数のタスクのうち 1 つを取得し、効率的なプロンプトでそれを強化し、それを機能として顧客に提供する手法です。

この記事は、Google Gemini モデルを Node.js アプリケーションに統合する方法に関するステップバイステップのガイドです。生成テキストを処理する Gemini-pro と画像を処理する Gemini-pro-vision の両方の使用方法を見ていきます。

まずプロジェクトをセットアップしてから、それを独自の例で使用します。

## 要件

## はじめる

まず、空のフォルダー内に新しい Node.js プロジェクトを作成します。

mkdir gemini-node  
cd gemini-node
npm init -y

次に、環境ファイルと Gemini SDK に必要なパッケージをインストールします。

npm install dotenv @google/generative-ai

API キーのセットアップ

Google AI プラットフォームで、[API キーの取得] ボタンをクリックして API キーを取得し、それをルート ディレクトリの環境ファイル (.env) に保存します。

API_KEY=YOUR_GEMINI_KEY

新しい lib フォルダーを作成し、その中に config.js ファイルを作成します。次に、次のステップで API キーをエクスポートします。

const  dotenv  =  require("dotenv");
dotenv.config();

const  API_KEY  =  process.env.API_KEY;

module.exports  = { API_KEY };

Gemini SDK のセットアップ

このステップでは、コードで使用できるようにモデルをセットアップします。 lib フォルダー内に、テキストを処理するための gemini.js と画像を処理するための gemini-vision.js の 2 つのファイルを作成しましょう。

1- Google Gemini Pro

const { GoogleGenerativeAI } = require("@google/generative-ai");
const { API_KEY } = require("./config");

const googleAI = new GoogleGenerativeAI(API_KEY);
const geminiConfig = {
  temperature: 0.9,
  topP: 1,
  topK: 1,
  maxOutputTokens: 4096,
};

const geminiModel = googleAI.getGenerativeModel({
  model: "gemini-pro",
  geminiConfig,
});

const generateText = async (prompt) => {
  try {
    const result = await geminiModel.generateContent(prompt);
    const response = result.response;
    return response.text();
  } catch (error) {
    console.log("response error", error);
  }
};

module.exports = { generateText };

エクスポートされた関数を使用して、プロンプトからテキストを生成します。これを使用して、チャット システム、テキスト翻訳、その他多くのユースケースを構築できます。

2- Google Gemini ビジョン

const { GoogleGenerativeAI } = require("@google/generative-ai");
const { API_KEY } = require("./config");
const fs = require("fs");

const googleAI = new GoogleGenerativeAI(API_KEY);
const geminiConfig = {
  temperature: 0.4,
  topP: 1,
  topK: 32,
  maxOutputTokens: 4096,
};

const geminiModel = googleAI.getGenerativeModel({
  model: "gemini-pro-vision",
  geminiConfig,
});

const interactWithImage = async (filePath) => {
  try {
    const imageFile = fs.readFileSync(filePath);
    const imageBase64 = imageFile.toString("base64");

    const promptConfig = [
      { text: "Generate a caption from this image" },
      {
        inlineData: {
          mimeType: "image/jpeg",
          data: imageBase64,
        },
      },
    ];

    const result = await geminiModel.generateContent({
      contents: [{ role: "user", parts: promptConfig }],
    });

    return result.response.text();
  } catch (error) {
    console.log("response error", error);
  }
};

module.exports = { interactWithImage };

エクスポートされた関数を使用して、画像からテキストを生成します。

アプリの構築

新しい index.js ファイルを作成し、次のコードを貼り付けます。

const main = async () => {
  console.log("Hello world!");
};

main();

これで、エクスポートした関数をインポートし、それらを使用して質問または画像プロンプトからテキストを生成できるようになりました。

この関数は引数としてファイル パスを取るため、テストするにはプロジェクト フォルダーに画像ファイルを追加する必要があります。

コードは次のように変換されます。

const { generateText } = require("./lib/gemini");
const { interactWithImage } = require("./lib/gemini-vision");
const path = require("path");

const main = async () => {
  // Text Generation
  let textFromPrompt = await generateText(
    "tell me about bootcamps in a sentence"
  );
  console.log(textFromPrompt);

  // Caption Generation
  const directoryName = path.join(__dirname, "fish.jpg");
  let captionFromImage = await interactWithImage(directoryName);
  console.log(captionFromImage);
};

main();

## 次は何ですか

ExpressJS を使用して、スクリプトの代わりに API を構築できるようになりました。ユースケースに応じたプロンプトの作成に関するベスト プラクティスについて調査することもできます。

以下に、構築できるアプリの例をいくつか示します。

  • [Unsplash API]を使用したSEOメタデータ生成ツール(https://unsplash.com/developers)

  • PDF からコンテンツを取得する追加のスクリプトを追加してレビュー担当者を再開します

  • 画像からインスタグラムのバイオライター

より良いアプリを構築することに興味がありますか? Web 開発ブートキャンプに参加 して、完全に機能する製品を構築する方法を学びましょう。


By Omar Mokhfi

Career Services background pattern

キャリアサービス

Contact Section background image

連絡を取り合いましょう

Code Labs Academy © 2024 無断転載を禁じます.