A multilingual Angular + Ruby on Rails app development project for SLPP. The front end website of the app is quite simple where users can sign up, log in and submit their ideas. The admin dashboard however is where the bulk of the dev work was dedicated to, as it had to support multiple user types and data entry for 80+ models.

The Angular front end was built using Angular Material, primarily to speed up dev time, but also because it looks good, especially when using a lot of web forms. Making the app multilingual was more challenging as data needed to be entered in Sinhala, English and Tamil. The solution to this was a custom material input using Google’s transliteration service which detected the app’s current locale and allows users to enter English characters that will be transliterated to the selected language.

For this Angular app development project, the back end API was built using Ruby on Rails which I’ve used in a few other projects (thanks Ruby syntactic sugar!). Using token based authentication gave better performance to ensure minimum lag on the frontend user interface.

The app is hosted on a simple AWS setup, with separate instances for frontend (Apache) and API (Nginx) servers.

Technologies

Angular 8, Angular Material, TypeScript, Ruby on Rails, MongoDB, AWS

Live site

https://gamasamaga.org

Screenshots

Home page – English
A Dialogue with the Village angular development project - English home page
Home page – Sinhalese
Sinhalese home page
Home page – Tamil
A Dialogue with the Village angular development project - Tamil home page
Material transliteration input with custom transliteration service
Material transliteration input with custom transliteration service
User profile
A Dialogue with the Village angular  development project - User profile
Welcome email
Welcome email
Login page
A Dialogue with the Village angular development project - Login page
Register page
Register page