In Ruby On Rails By Leigh Halliday December 06, 2014 Leigh Halliday

Which technologies should I use for my website?

Overview

Now that I've decided to make this website from scratch, there are a number of decisions to make in terms of what technologies to choose from. I've broken things down into 4 sections: Frontend, backend, data, and hosting.

TL;DR

jQuery, Bootstrap, Rails, Postgres, Redis, Heroku.

Frontend

The frontend of the website is what the world sees. When you visit any website, the thing you interact with is the frontend, so it obviously carries a fair amount of importance with it, and many times to a visitor, they won't know or really care what backend you are using.

The frontend is generally made up of 3 different components.

JS framework

A JS framework is what controls the flow and interaction of your website, in terms of how the visitor interfaces and interacts with the website. A lot of this depends on the type of website you are planning to build. If it is highly interactive, like an email client, or a chat application, it makes sense to explore AngularJS or EmberJS, which offer great frameworks for building highly interactive websites, or single page applications.

If your website is more of a document based website, like a blog or wiki, then in my opinion it is better to stick with a more traditional setup (not saying you can't integrate Angular into a small portion of your website where it makes sense) where most of the magic happens on the backend, and requests are made to the server to generate a new page. You'll probably still want jQuery on a website like this to manage a little bit of interaction.

The JS I wrote on this website was originally written in CoffeeScript which transpiles into Javascript.

CSS

With CSS, you can roll your own and do everything from scratch, but it is very common (and time saving) to use a base layer of CSS which already has a grid, responsive capabilities (can auto resize to look good on a phone or a tablet, while also looking good on a desktop screen), and a bit of base look and feel for buttons and form elements and the like. The best options in my opinion are Bootstrap and Foundation.

On this site I am using Bootstrap, which has been pretty easy to work with. Also, because I wanted to spend less time creating an interface, I purchased a theme from WrapBootstrap for a very reasonable price, which saved me a ton of time. I also used theme to give the admin section a default look and feel, also from WrapBootstrap, which happened to be free.

The CSS I wrote on this website was originally written in SCSS, and then transpiled into CSS.

HTML

I would say that more than anything, your JS framework and CSS framework tend to dictate how you lay a lot of your HTML out. There isn't too much to say about HTML, other than you should try to follow standards and stick with what is in HTML5.

The HTML I wrote on this website was originally written in HAML, which is, in my opinion, a way easier way of writing HTML, which involves indentation to nest tags, and requires no closing of tags.

.row
  .col-md-6
    %h2 Heading

produces

<div class="row">
  <div class="col-md-6">
    <h2>Heading</h2>
  </div>
</div>

Backend

Choosing a backend for a website can be done using a number of different variables. The first one in my opinion comes down to comfortability... if you're a Ruby developer, then using Rails or Sinatra makes sense. A pro at Javascript? Then why not go with ExpressJS or hapi in Node. Entrenched in PHP, then I'd recommend Laravel. There are also other options if you prefer to write code in Python (Django) or Scala (Play).

I think being comfortable with a language and a framework will give you more bang for your buck than choosing the trendiest or perhaps fastest framework. But it also helps to choose a framework with great community support behind it, so that you can be sure of updates for years to come.

I've chosen Rails because this is what I am most comfortable and productive in, but also because I find writing code in Ruby to be a joy.

Data

I recommend storing your data in a regular old relational database, such as Postgres or MySQL unless you have a serious reason not to. This website uses Postgres, which tends to be the preference for Rails developers, but I've had good luck with MySQL before too.

Alternative data stores such as MongoDB or Redis can be useful in certain situations, and in fact, I am using Redis on this website to store the translations (it makes a great key/value store). If traffic ramps up (here's hoping), I will probably utilize Memcache to store cached values.

Hosting

This website is "in the cloud"... hosted currently on a free Heroku instance. It provides enough resources for what I need and is extremely easy to set up. The only trick is that you can't save any files locally, so you'll have to use Amazon S3 or something similar to store any uploaded media. In Rails this is extremely easy so it wasn't a problem.

Digital Ocean, Linode, or using Amazon AWS are also great options if you are more inclined to setting up servers, and/or looking for greater flexibility and potentially greater speed and resources.