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 trialDerek Parry
3,080 PointsIn what program(s) are the front-ends of Treehouse and other similar-looking sites designed?
Treehouse is a very good looking, easy to use site. I am very new to web design/development and am curious what Treehouse and other similar "modern" sites are using to design their front-ends. For example, Airbnb and Groupon have somewhat of a similar feel in their user interface--solid colors, fun yet simple graphics, etc. Contrast this with something like http://www.angelfire.com/super/badwebs/ or a basic html/css site like SmellsLikeBakin'. What makes the difference?
I realize this is a very, very broad question, so let me clarify a little. It seems to me that PHP, Python, and Ruby/RoR are very common for programing backend, including the applications of modern/really cool websites like Treehouse, Airbnb, etc. (I am guessing Treehouse was programmed in Ruby...but tell me if I'm wrong). That being said, I know very little about what languages are being used to make front-ends look so good. What language is really popular right now, and what do really good looking websites usually share in common language-wise? HTML 5? Fancy javascript? (I have no idea what I am talking about...I'm sure you can tell.)
Of course, an eye for creativity and a working knowledge of general design elements are key, but my question is really about what programs and languages are being used at the front-end of popular websites.
Thank you for your noob support, and sorry for the long question. You guys are great.
2 Answers
Kevin Korte
28,149 PointsYes, treehouse is a Ruby on Rails site.
For front-end, it's HTML5, CSS3, and Javascript (or JQuery library) that all tie together to create a nice front end experience. All of the nice, big sites are going to be using those three languages on the front end.
It's not so much the languages used that makes the difference between a site like teamtreehouse and Smells Like Bakin' but it's much more how the language is used combined with a solid understanding of design principals, color theory, etc.
Riley Hilliard
Courses Plus Student 17,771 PointsFrontend markup/languages include HTML5(HTML5, CSS/CSS3, JavaScript). It is also very likely that some of those sites are using jQuery as a JavaScript Framework. Today, it is also possible that some modern designed sites may be using a CSS framework like Twitter Bootstrap or Zurb Foundation, at the very least for their CSS scaffolding and layout. What makes these sites you mentioned above look 'good' is the skill of the frontend designer(s) and User Interface engineer(s). Much of what you actually see is probably creative uses of CSS and JavaScript, which work together along side HTML to create the page layouts and functionality. The above mentioned languages are front end languages, but the others you mentioned like PHP, Ruby/Ruby on Rails, Python are backend/server side languages. While they do not contribute to the site's design at all, (if used) they contribute to the dynamic content of the site. So a language like PHP would be used to output information, but PHP itself does not control the sites design unless it's output is another front-end language (HTML, CSS, JS) etc. PHP (or other backend languages) can effect what you see on the page, but probably only because the backend language is being used to generate front-end content.
Derek Parry
3,080 PointsThank you. That clears up a lot.
Derek Parry
3,080 PointsDerek Parry
3,080 PointsGreat. Thank you, this is very helpful.