Some observations and thoughts about using free tier Gemini AI API for text based interactions in React apps

Last updated on 7 May 2025
Over the past few days, I have spent some time developing and using two simple test React apps to check out text based interactions with free tier Gemini AI API. Based on that, given below are some observations and thoughts about using free tier Gemini AI API for text based interactions in React apps.

Observations

  1. Integrating basic text query to and response from Gemini AI in a React app using free tier Gemini API for a known (hard-coded) model is easy. Listing available models using its current @google/genai library for JavaScript API does not seem to be supported as of now. However, a REST API is available to get the list of available models but the information about the models is rather limited. 
  2. For general questions, the Gemini API (without Grounding with Google Search) answers (with gemini-2.0-flash as model) seem to be okay. This includes questions like "Give me a useEffect example in React" where the API answers with example code and detailed explanation. But for some detailed questions, the quality of answers via the API with gemini-2.0-flash as model (without Grounding with Google Search) are sometimes poor as compared to answers with Gemini 2.0 Flash model in Google Gemini chat app for the same detailed questions. Note that (Gemini) Flash 2.0 model seems to be a current model with the Gemini web app also using it by default, and that this (Gemini) Flash 2.0 (model display name) seems to be same as gemini-2.0-flash (model name). I have not yet tested with these detailed questions for Gemini API model gemini-2.0-flash with Grounding with Google Search.
  3. I had to use Grounding with Google Search to combine Gemini API model data with Google search results data. Note that gemini-2.0-flash API knowledge cut-off date is September 2021. So if it is used with default config (without combining its data with web data), it is not good for getting info on current events. Even a question like who is the president of USA gave me a wrong answer of Joe Biden. But Gemini web app using Gemini 2.0 Flash model gave me correct answer of Donald Trump. After the Grounding with Google Search fix was added to Gemini API calling code in the test app, it now provides the correct answer of Donald Trump to the question: who is the president of USA?
  4. When using API, context of previous question is not remembered and so has to be provided along with the new question. In contrast, the Gemini web app remembers earlier context making it possible to have a conversation over multiple message interactions.
  5. The documentation of the current library @google/genai for JavaScript is not great.
  6. Google Gemini API seems to have a decent free tier. Usually it takes a little time to get the response from Gemini (slower as compared to Gemini web app).  At times, I got a message that the model is overloaded (and did not get a response to my question) but in the 2nd version app, I could change the model to what seemed to be a previous model and get a response from that. Despite using it quite often for my tests, I never got a free tier quota exhausted message.
  7. As ChatGPT API does not have a free tier, Google Gemini API is superior to ChatGPT API in this aspect, which would be an imporant point for nonprofit NGOs. (IFIRC, ChatGPT API claims to have a 'free tier' but API calls fail with no quota or similar message and so it does not really have a 'free tier'.)

Thoughts

  1. Educational apps (in React or other JS platforms) that currently do not have AI integrated in their app, could bring in Gemini AI quite easily into their apps. This could be limited to free tier or could use paid tier as well. Consider an edu app having a Question-Answer (QA) bank. If the student-user asks a question which is not in the app's QA bank, the student could be given an option to ask Gemini AI through the API, from within the app itself. The responses from Gemini API can also be stored in the student-user profile related data bank, based on choice of the student. From legal perspective, these responses should clearly provide attribution to Gemini AI API and also have any suitable warning messages like what Gemini web app gives:  'Gemini can make mistakes, so double-check it'. Who owns copyright for these Gemini API responses may be a complex legal topic. For nonprofit apps, perhaps detailed legal counsel may not be that necessary before storing Gemini AI API responses in the app's data bank and then showing it to users. But forprofit apps may need getting detailed legal counsel for such usage.
  2. Similarly health-care apps (in React or other JS platforms) that currently do not have AI integrated in their app, could bring in Gemini AI quite easily into their apps. However, health-care may involve lot of legal concerns about validity and safety of responses from Gemini AI. But could a nonprofit health-care app have less such legal issues and so provide this AI QA functionality with choice of storing AI responses as user's data? Probably.
  3. I don't know how easy or difficult it would be to access and integrate images and videos from Gemini API in React apps. Browsing the net indicates that it may not be too difficult, in which case, it opens up very interesting feature addition possibilities to React apps that currently do not have this images and videos from Gemini API functionality.
  4. Overall, I am very impressed with Google for providing a decent free tier to access Google Gemini AI in JavaScript apps like React apps through Gemini API. Hats off to Google!

Test app links

If you would like to check out using these simple test apps (both can be used on desktop/mobile) ...
  1. Test app (2nd version) which allows you to specify the model to be used and also shows list of available models. It has some small additional UI stuff but it retains only one message exchange (current or previous): Live site: https://testgeminiapi.netlify.app/ , GitHub repo: https://github.com/ravisiyer/testGeminiAPI
  2. Test app (1st version) with fixed model of gemini-2.0-flash, which maintains current session message exchange history: Live site: https://geminiapitrial.netlify.app/ , GitHub repo: https://github.com/ravisiyer/GeminiAPITrial

Associated blog post

For more info, please visit my associated post: Google Gemini (AI) API has free tier; Easily setup and ran tutorial article React app using API; Wrote 2nd Trial app with user choice for model, https://raviswdev.blogspot.com/2025/04/google-gemini-ai-api-has-free-tier.html .

Comments

Post a Comment