I’m excited to announce my latest project, LearnLanguageOnline—a website offering free language lessons and exercises. This post outlines both the user experience and the technical development process.
For Language Learners
As a language learning enthusiast for over a decade, I’ve used countless resources to improve my skills. One consistent challenge was finding free online grammar and vocabulary exercises, often leaving me to print worksheets from outdated materials I found online.
By combining my web development expertise with my passion for languages, I’ve created LearnLanguageOnline to support others on their language learning journeys. Currently, the site offers materials for English and Spanish, with plans to expand to additional languages, including my native Bulgarian.
The platform features two main components:
- Comprehensive lessons covering essential language concepts
- Interactive exercises for practical application of knowledge
Users can engage with multiple-choice questions or free-response exercises, receiving immediate feedback on their submissions:
For Developers
The project consists of three distinct codebases:
- Backend API: Built with Laravel for its reliability, ease of use, and robust ecosystem
- Admin UI: Developed in React, featuring a custom text editor I built specifically for creating language exercises
- Public UI: Created with Next.js, this is the website users interact with
The Admin UI was particularly rewarding to develop. I designed a custom text editor that generates exercises in a specialized JSON format, facilitating easy creation and management. For lesson content, I implemented react-markdown, which proved remarkably straightforward to work with—highly recommended!
The Public UI presented the greatest challenge, particularly from an infrastructure perspective. Given that LearnLanguageOnline is intended to be free for users, I needed a cost-effective solution. I chose static site generation with Next.js, despite its critics, as it offered the best option within the React ecosystem for my needs. A key requirement was the ability to build and deploy language-specific websites independently. Cloudflare provided excellent support for managing builds and deployments, making it my recommended hosting solution for static websites.
