# Quiz App Translation Files Location in Microsoft AI For Beginners

> Find the Microsoft AI For Beginners quiz app translation files at etc/quiz-app/src/assets/translations/. Learn where to access these files easily.

- Repository: [Microsoft/AI-For-Beginners](https://github.com/microsoft/AI-For-Beginners)
- Tags: how-to-guide
- Published: 2026-08-25

---

**The translation files for the quiz app are located at `etc/quiz-app/src/assets/translations/` in the Microsoft AI For Beginners repository.**

This Vue-based educational application uses a structured JSON-based internationalization system. Each supported language maintains its own subdirectory containing lesson-specific translation files that power the multilingual quiz interface for learners worldwide.

## Translation File Directory Structure

The quiz app organizes all **translation files** under a single root directory. The path from repository root is:

```

etc/quiz-app/src/assets/translations/

```

Within this folder, the structure follows a **language-first, lesson-second** hierarchy:

| Level | Path Example | Contents |
|-------|-----------|----------|
| Root | `translations/` | Language subdirectories |
| Language | `translations/en/` | All English lesson files |
| Lesson | [`translations/en/lesson-1.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/translations/en/lesson-1.json) | UI strings for specific lesson |

As implemented in **microsoft/AI-For-Beginners**, supported languages include `en` (English), `es` (Spanish), `fr` (French), and others. Each language folder contains identical sets of lesson files ([`lesson-1.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/lesson-1.json) through the full curriculum) to ensure complete coverage.

## Translation File Format and Examples

Each **translation file** is a plain JSON object mapping UI identifiers to localized strings. The structure remains consistent across languages for easy maintenance.

The English translation for lesson 1 resides at:

[`etc/quiz-app/src/assets/translations/en/lesson-1.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/src/assets/translations/en/lesson-1.json)

And the equivalent Spanish version at:

[`etc/quiz-app/src/assets/translations/es/lesson-1.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/etc/quiz-app/src/assets/translations/es/lesson-1.json)

Both files share the same key structure—only the string values differ. This enables the Vue-I18n integration to switch languages seamlessly without modifying component logic.

## How the Quiz App Loads Translation Files

The application dynamically imports **translation files** at runtime using Webpack's `require.context`. This approach allows lazy-loading of only the requested language while supporting the full lesson catalog.

```javascript
import { createI18n } from 'vue-i18n'

// Dynamically import JSON files for the selected language
function loadLocaleMessages (locale) {
  const messages = {}
  const context = require.context(
    '@/assets/translations',
    true,
    /\.json$/
  )
  context.keys().forEach(key => {
    if (key.startsWith(`./${locale}/`)) {
      const lesson = key.match(/lesson-(\d+)\.json$/)[1]
      messages[`lesson${lesson}`] = context(key)
    }
  })
  return messages
}

const i18n = createI18n({
  locale: 'en',            // default language
  fallbackLocale: 'en',
  messages: loadLocaleMessages('en')
})

export default i18n

```

The `loadLocaleMessages` function scans `etc/quiz-app/src/assets/translations/`, filtering by the requested locale prefix. It parses lesson numbers from filenames and nests each **translation file** under a `lessonN` namespace for component access.

## Accessing Translations in Vue Components

Once loaded, strings from any **translation file** are accessible via the `$t` helper in templates:

```html
<template>
  <div>
    <h2>{{ $t('lesson1.title') }}</h2>
    <p>{{ $t('lesson1.description') }}</p>
  </div>
</template>

```

The dot-notation path corresponds to the nested structure created during loading: `lesson{N}.{key}` where `{key}` matches the JSON property name in the original file.

## Adding New Languages to the Quiz App

To extend the **translation file** collection for additional languages:

1. Create a new subdirectory under `etc/quiz-app/src/assets/translations/` using the ISO 639-1 language code (e.g., `de` for German, `ja` for Japanese).
2. Copy all [`lesson-N.json`](https://github.com/microsoft/AI-For-Beginners/blob/main/lesson-N.json) files from an existing language folder into the new directory.
3. Translate all string values while preserving key names exactly.
4. Update the Vue-I18n configuration to include the new locale in available options.

No code changes are required to components—the existing dynamic loading logic automatically discovers new language folders at build time.

## Summary

- **Location**: All quiz app translation files live in `etc/quiz-app/src/assets/translations/`
- **Structure**: Language subdirectories (`en/`, `es/`, `fr/`) contain lesson-specific JSON files
- **Runtime**: Vue-I18n loads these files dynamically via `require.context` in [`main.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/main.js)
- **Access**: Components reference keys using `$t('lesson{N}.{key}')` notation
- **Extension**: New languages require only adding a matching folder with translated JSON files

## Frequently Asked Questions

### How do I find which languages are currently supported?

Browse the `etc/quiz-app/src/assets/translations/` directory in the repository. Each subfolder name represents a supported language code. The default configuration in [`main.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/main.js) or [`i18n.js`](https://github.com/microsoft/AI-For-Beginners/blob/main/i18n.js) also lists explicitly configured locales.

### Can I modify a translation without rebuilding the application?

No—the JSON files are bundled at build time through Webpack's `require.context`. Any changes to **translation files** require recompiling the Vue application to regenerate the asset manifest.

### What happens if a translation key is missing in a specific language?

Vue-I18n falls back to the `fallbackLocale` (configured as `'en'` in the source). If the key exists in English but not in the selected language, users see the English text rather than an error or empty string.

### Are the translation files used for content other than the quiz interface?

The **translation files** in this location specifically localize the Vue quiz application UI elements—buttons, labels, instructions, and feedback messages. Course content and lesson text remain in the main repository's markdown files under the `lessons/` directory.