diff --git a/quiz-app/src/App.vue b/quiz-app/src/App.vue
index 328058a1..7735f87b 100644
--- a/quiz-app/src/App.vue
+++ b/quiz-app/src/App.vue
@@ -4,19 +4,7 @@
       <router-link class="navlink" to="/">Home</router-link>
       <label for="locale">locale</label>
       <select v-model="locale">
-        <option>en</option>
-        <option>es</option>
-        <option>fr</option>
-        <option>gr</option>
-        <option>hi</option>
-        <option>id</option>
-        <option>it</option>
-        <option>ko</option>
-        <option>ms</option>
-        <option>nl</option>
-        <option>zh_cn</option>
-        <option>zh_tw</option>
-
+        <option v-for="localeName in availableLocales" :key="localeName">{{ localeName }}</option>
       </select>
     </nav>
     <div id="app">
@@ -41,6 +29,7 @@ export default {
   data() {
     return {
       locale: "en",
+      availableLocales: Object.keys(messages).sort(),
     };
   },
   watch: {