DEV Community

Cover image for Beyond Grammar: I Built Meydan to Help My Friends Use Arabic in Their Fields
Habeeb Babasulaiman
Habeeb Babasulaiman

Posted on AI-assisted

Beyond Grammar: I Built Meydan to Help My Friends Use Arabic in Their Fields

Hacktoberfest Weekend Challenge: Build for a Friend Submission 🤝

This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend

What I Built

I built ميدان (Meydan), a bilingual Arabic and English writing and practice studio for people who know their field but struggle to express that knowledge in Arabic.

I studied Arabic and Transnational Studies, and I also work across software engineering, DevOps, and cloud infrastructure. I could discuss much of my technical work in English, but found it difficult to explain the same ideas naturally in Arabic. Friends studying Arabic described a similar gap: they were learning grammar and conversation, yet still lacked practice using Arabic to discuss their studies, work, and interests.

That gap became more concrete when I shared the early version of Meydan with friends. They tried it, responded positively, and asked when they could use it online instead of on my computer. Their response encouraged me, while also making the next challenge clear: before opening it up more widely, I need to improve speed, review the Arabic with qualified speakers, and make the experience reliable enough for regular use.

Meydan starts with four fields: technology, health communication, travel, and international relations. A learner can ask it to write about a subject in Arabic and provide an English translation, build a bilingual field glossary with example sentences, or practise a realistic dialogue. They can switch the interface between Arabic and English, choose a light or dark theme, and save useful terms in a phrasebook on their device.

Demo video: https://drive.google.com/file/d/1ZpLdC_UuxUTbUPsC48zPLZnT_CCSRoZA/view?usp=drive_link

Meydan gives them a practical bridge from knowledge to communication.

A learner can:

  • Ask Meydan to write about a topic in Arabic.
  • Receive an English translation and useful Arabic terminology.
  • Learn field-specific vocabulary for technology, health communication, travel, and international relations.
  • Practise realistic professional conversations.
  • Save useful expressions in a local phrasebook.
  • Switch the interface between Arabic and English.
  • Switch between light and dark themes.

The first use case I built around is this kind of request:

Demo

Demo video: https://drive.google.com/file/d/1ZpLdC_UuxUTbUPsC48zPLZnT_CCSRoZA/view?usp=drive_link

The demo shows the Arabic-first interface, the writing workflow, the bilingual response, the terminology cards, the English interface, dark mode, and the local model status.

The model runs locally through Ollama, so the demo may take longer to respond than a hosted GPU service. The application streams the response as it is generated instead of waiting silently for the entire answer.

Code

View the Meydan repository on GitHub

How I Built It

Meydan is a React, TypeScript, and Vite application with an Arabic-first RTL interface and an English LTR mode.

The core architecture is:

flowchart LR
    Learner[Arabic learner] --> UI[React bilingual interface]
    UI --> Proxy[Vite local Ollama proxy]
    Proxy --> Ollama[Ollama on localhost]
    Ollama --> Gemma[Gemma 3 4B open-weight model]
    UI --> Phrasebook[Browser-local phrasebook]

The current local model is Gemma 3 4B, served through Ollama. The app sends requests to the local Ollama service rather than to a hosted model API. Responses stream into the interface and are rendered as structured Markdown so longer Arabic writing, translations, lists, and terminology tables remain readable.

I designed three focused workflows instead of one generic chatbot:

  1. Write an idea: produce Arabic writing, English translation, and key vocabulary.
  2. Learn terminology: create a focused bilingual glossary with examples.
  3. Practise a dialogue: simulate a realistic conversation in a selected field.

The application also includes:

  • Arabic/English interface switching.
  • Light/dark mode persistence.
  • Field-specific starter terminology.
  • A local phrasebook stored in browser storage.
  • Health and other high-stakes safety boundaries.
  • A clear local-model status indicator.

I tested the project on a machine with 12 CPU cores, 32 GB RAM, and integrated graphics. No hosted model API is required for the prototype.

Why Does Open Innovation Matter?

Open innovation matters because language practice can contain private, unfinished, and personal ideas. A learner should be able to practise describing their work without automatically sending every message to a remote service they do not control.

With local inference, Meydan can run on the learner's own machine through Ollama. This makes several things possible:

  • The learner's practice messages can stay local.
  • The model choice and runtime are visible and replaceable.
  • The application can be inspected and modified.
  • The project does not require a paid hosted AI API for its core workflow.
  • The model can be evaluated against the actual Arabic tasks the learner cares about.

Open AI also makes the limitations visible. On my CPU-only machine, Gemma 3 4B is not instant. A 371-token test took approximately 110 seconds end-to-end. The interface therefore streams output as it arrives and keeps responses bounded. The model can also produce fluent but imperfect Arabic, so the application clearly presents itself as a practice aid rather than an authority.

That trade-off is part of the project: privacy and inspectability are valuable, but they do not remove the need for human language review.

What I Learned

The most important lesson was that multilingual support cannot be evaluated by fluency alone.

A model may produce beautiful Arabic while choosing the wrong technical term, adding an unintended metaphor, or translating a professional phrase too literally. I tested the same kind of task across models and found that a smaller model can be faster without automatically being more accurate.

The practical solution is to evaluate the actual task:

  • Can it preserve the learner's intended meaning?
  • Does it produce natural Modern Standard Arabic?
  • Are the field-specific terms correct?
  • Does it handle English-Arabic code-switching?
  • Does it avoid inventing facts?

I still need a fluent Arabic reviewer to evaluate the terminology and my friend's real feedback before treating the output as polished language instruction.

Prize Categories

I am entering:

  • Best Use of Gemma

Gemma is used as the core local model for writing, terminology, and practice responses. It is not included as a decorative or incidental integration.

Project Status

This is a new prototype built during the challenge window. The repository is public and licensed under MIT:

The project is intentionally honest about its limits: local CPU inference is slow, Arabic output needs review, and the health workflow is communication practice only, not medical advice.

Thank you to the DEV and MLH teams for creating a challenge that encouraged me to build something personal and useful for someone I care about.

Top comments (0)