How to Add Gemini AI Basically to Your Next/React Projects

I’m very satisfied using Hashnode’s AI helpers. They help me to find title for the post, generate seo description etc. I’ve created a blog site with NextJS and wanted to add same feature. I achieved this with @google/generative-ai package (Gemini 2 - Flash). I implemented this feature for post title and seo description.

The prompt that I give is important to take exactly what I want from Gemini. I expect two different result from Gemini:

• Maximum 5 different post title suggestions to be generated from title as a json.

• Maximum 160 characters long description text for seo to be generated from post content.

Here’s the code:

import { ApiError } from "@/lib/custom_fetch"
import { GoogleGenerativeAI } from "@google/generative-ai"

type SuggestVersion = { version: string }

/**
 * Makes suggesting with Gemini Flash 2.0 API
 * @param sourceText string
 * @param multiple string - Maximum 5 different version
 * @returns Promise <string[] | never>
 */
export async function suggest(sourceText: string, multiple: boolean)
    : Promise<string | string[] | never>
{
    const genAI = new GoogleGenerativeAI(process.env.NEXT_PUBLIC_GEMINI_API_KEY!)
    const model = genAI.getGenerativeModel({ model: 'gemini-2.0-flash' })

    const prompt = multiple
        ? `Produce a json (same as this: [{"version": "text"}]) consists of maximum 5 different versions of this: '${sourceText}'`
        : `Generate a summary (I don't want options only one summary) maximum 160 characters long for seo from this: ${sourceText}`

    try {
        const result = await model.generateContent(prompt)

        if (multiple) {
            const resultText = result.response.text()
            const resultJson = 
                JSON.parse(resultText.substring(7, resultText.length - 4)) as SuggestVersion[]
            return resultJson.map(v => v.version)
        } else {
            return result.response.text()
        }
    } catch (error) {
        console.log(error)
        throw new ApiError({
            message: "Gemini API error",
            status: 500
        })
    }
}