Interactive language tutor powered by OpenAI
Parts of this README have been generated with AI.
Purpose: I built this project to cement what I had learned about using the OpenAI library, making API calls to the 'chat' and 'response' endpoints, the difference between 'zero-shot' and 'few-shot' prompting, the impact of 'temperature' and 'stop-sequences', as well as 'frequency penalties' and 'presence penalties', through Scrimba's "Intro to AI Engineering" course in the "AI Engineer Path".
Function: Concise, AI-powered language lessons for travellers, students, or professional pollyglots. Users can choose from 12 languages: Arabic, Australian (a lighthearted Easter Egg), Chinese, Dutch, French, German, Hebrew, Italian, Japanese, Portuguese, Spanish, and Urdu.
Note on the OpenAI API & Free Alternatives
Re: OpenAI API
OpenAI no longer offers $5 in credit to new users, but I highly recommend making the investment over free options like Gemini API. In addition to the excellent documentation:
- The Fine-Tuning tool allows you to, using either the GUI or API, create fine-tuning jobs from JSONL datasets and use your saved models. It offers less control and deployment options compared to alternatives than SageMaker AI, but is still quite powerful if you're just getting started.
- The OpenAI Playground allows you to do 'back-of-the-napkin' model evals and experiment with different models (including your own fine-tuned models!) by saving your parameters in unique code snippets
- For more methodical evals, you can use the Model Evaluation tool and by referencing the eval documentation here as well as the model optimization docs here
Re: Alternatives
If you're set on a no-cost alternative, you can use the Gemini API OpenAI compatibility option. I've compiled some quickstart guides and working API calls in these files:
Quickstart Guides
Sample API Calls
Project Notes
AI Usage: For this project, I really made an effort to use AI as little as possible. I also turned off tab-complete and React snippets. It came at the cost of less intricate design, but paid back in full in the form of my own sanity and helping me remember that I'm still capable of writing a full stack React/Node app without it.
I used AI to generate the README.md file, and to ask for clarification on dependencies, CORS configuration, and to debug the server setup, but I did not use AI to generate any of the actual code for this project. The code is quite simple, and mostly solidifies what I have been learning through The Odin Project and Full Stack Open.
Starter Files: The starter files provided for this project included empty index.html, index.js, and index.css files, as well as 5 images for the flags of France, Japan, Spain, a parrot logo, and a world map. While Figma design template was provided, I opted for a more minimalist approach.
App Function: Pollyglot is an AI-powered language learning application that helps users practice and learn new languages through interactive translation. Built with React and powered by OpenAI's GPT models, it provides instant translations and language learning assistance.
Tech Stack
- Frontend: React, Vite
- Backend: Node.js, Express (or Cloudflare Workers for lightweight alternative)
- AI: OpenAI Models (or Gemini via the Gemini )
- Styling: External CSS
Prerequisites
- Node.js (v16 or higher)
- npm or yarn
- OpenAI API key
Local Development Setup
This project supports two development setups:
- Full-Stack Local Server: Run the React client and a Node.js/Express backend on your machine. This is ideal for developing and testing the backend server logic.
- Client with Cloudflare Worker: Run the React client locally and connect to a deployed Cloudflare Worker for API calls. This is a more lightweight setup that mirrors a serverless production environment.