Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


Kraig Walker
Kraig Walker
4,401 Points

From Diagram to Model

Hey guys. I'm building a small translation app for a social housing charity to help explain complicated rent and leasing terminology to new migrants. The app is to be installed on the android phones of the charities's front line workers, so I'm building an html5 single page web app using jQuery Mobile that will be wrapped in PhoneGap.

I've just started using Backbone.js so that I can easily abstract the data from the user interface of the app. If it works as planned, the charity will only need to update the contents of a simple JSON file with their translation data rather than having to modify hard coded html and Javascript stuff.

I was wondering if I could run this diagram by you guys and get some feedback on how best I should model the data in the app.

THe first part of he image is how I'm thinking of storing a single "Translation" which has an English Phrase, and then can also have multiple "Language" containers which hold the translations, audio files and a reference to a flag image in the app's resource folder.

The second part of the image is a mockup of how I envision the UI working. jQuery Mobile has a pretty neat searchable listView which I want to use to let people quickly find a close matching phrase/term in English that they're looking for. Then after selecting the phrase it takes you to a detail view, where the user can swipe through different language translations for the phrase, as well as displaying the native text and a button to play an audio file (the charity had native speakers do some voiceover work for me)

Any feedback on whether this is a good/bad idea would be really helpful!

Also, any help on how to structure the "Language" within the "Translation" would be great. The charity want to start out with Polish, but expand the languages of the app over time. Should Language be it's own Model? Could I still include them in my "Translation" Model?

Translation App Diagram

1 Answer


I've made a diagram to help you out, it's mySQL diagram, but it helps you get the idea.

I would personally do something different, use multiple containers. Why? Because check this out :


Why sentance group ?

Sentance group is a way to group the same sentance, for example.

I love pepsi

-> SentanceGroup = 1

-> Language = 1

Imi place pepsi

-> SentanceGroup = 1

-> Language = 2

You can easily find the sentance in the specific languange, then you know exactly which group it belongs to and you just need to for a group and a language.

Maybe I'm wrong, but this seems like the best approach in my opinion, never did something like this, but if you want, I can do it for you, just for the fun.