Google-Little-Language-Lessons

KO | EN

gitlite — search

#python #java #python3 #arduino #golang #machine-learning #rust #html #flask #javascript #seismology #nodejs

Google-Little-Language-Lessons

★ 13 Open GitHub ↗

Clone of Google's Little Language Lessons Experiments

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Little Language Lessons Clone

This project is a clone of Google's [Little Language Lessons](https://labs.google/lll/en/experiments), a collection of bite-sized language learning experiments originally built with Gemini.

[![CI](https://github.com/yujingr/Google-Little-Language-Lessons/actions/workflows/ci.yml/badge.svg)](https://github.com/yujingr/Google-Little-Language-Lessons/actions/workflows/ci.yml)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![Next.js](https://img.shields.io/badge/Next.js-13.x-black)](https://nextjs.org/)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](http://makeapullrequest.com)
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/yujingr/Google-Little-Language-Lessons)

> **Note:** A video fully process on how this was created using Cursor AI will be released later. This took ~3 hours including all the steps from setup to completion.

## Screenshots

### Home Page

![Home Page](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/home.png)

### Tiny Lesson

![Tiny Lesson Entry](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/tiny_entry.png)
![Tiny Lesson Vocabulary](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/tiny1.png)
![Tiny Lesson Tips](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/tiny2.png)

### Slang Hang

![Slang Hang Entry](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/slang_entry.png)
![Slang Hang Conversation](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/slang1.png)
![Slang Hang Glossary](https://raw.githubusercontent.com/yujingr/Google-Little-Language-Lessons/main/images/slang2.png)

## Implemented Experiments

1. **Tiny Lesson**: Find relevant vocabulary, phrases, and grammar tips for any situation.
2. **Slang Hang**: Learn expressions, idioms, and regional slang from a generated conversation between native speakers.

## Tech Stack

- **Next.js**: React framework for the frontend
- **OpenAI API**: For generating language learning content
- **shadcn/ui**: UI component library
- **Google Translate TTS**: Unofficial API for text-to-speech functionality

## Setup Instructions

1. Clone the repository:

```
   git clone https://github.com/yourusername/little-language-lessons-clone.git
   cd little-language-lessons-clone
   ```

2. Install dependencies:

```
   npm install
   ```

3. Create a `.env.local` file in the root directory with the following variables:

```
   # AI model name to use
   AI_MODEL_NAME=gpt-4o

# Base URL for the AI service API | use openai or compatible api
   AI_BASE_URL=https://api.openai.com/v1

# Your API key for the AI service
   AI_API_KEY=your_api_key_here
   ```

4. Run the development server:

```
   npm run dev
   ```

5. Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

## Environment Variables

- `AI_MODEL_NAME`: model to use (recommend gpt-4o or better)
- `AI_BASE_URL`: Base URL for the OpenAI compatible API endpoint
- `AI_API_KEY`: Your API key for accessing the OpenAI service

## Features

### Tiny Lesson

- Select a language and specify a topic/purpose
- Get vocabulary, useful phrases, and language tips related to your chosen topic
- Text-to-speech functionality to hear correct pronunciation

### Slang Hang

- Experience a realistic conversation between native speakers
- Learn authentic slang, idioms, and colloquial expressions
- Each conversation includes a glossary of slang terms with definitions and examples

## Implementation Note

Unlike the original Google implementation that breaks down AI calls into multiple smaller parts, this clone makes a single OpenAI API call for each experiment. This approach can be prone to errors if using smaller models with limited context windows or processing capabilities.

## TODO

- [ ] Implement Experiment 3 from the original Little Language Lessons
- [ ] Break up Tiny Lesson and Slang Hang into multiple smaller API calls to improve speed and loading times
- [ ] Implement error checking for each smaller part when breaking up the API calls
- [ ] Add fallback mechanisms for handling model errors or limitations

## License

This project is for educational purposes only. The original Little Language Lessons is a product of Google Labs.

Google-Little-Language-Lessons

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README