What’s the difference between frontend and backend?

Frontend vs Backend

Frontend and backend are two different specializations in web development. Years ago, a frontend developer was the same person designing the site, while the backend developers were the rest.

Now in a medium or big company, there are much more roles involved. But in small companies (also called start-ups), the normal situation is to have two developers: one for the frontend and another one for the backend.

Designer

The frontend developer is not a designer. This is a misconception. The designer is the professional who draws the design on a paper or using an application such as Photoshop. The designer must provide the final layout as image format, giving also the rest of graphical elements of the site.

If the site must change dramatically between different devices (using responsive design), the designer is also responsible of designing how those different versions will look like.

Frontend

Frontend is everything associated with the user interface, that is what you see and the interactions. This includes HTML as the language to present the information, CSS as the language to style that information, and Javascript as the language for interactions.

To make the work easier, frontend developers usually use some kind of CSS framework, being Twitter Bootstrap the most popular. This represents having to include a big amount of files which set the style foundations, and the frontend developer can customize them. Bootstrap is a big framework, and so is its size. There are other alternatives (a bit more difficult to use) such as Bourbon, Neat and Bitters, which I used to build the layout of this blog.

If the application provides an API, it is a common practice to use a JavaScript framework to implement all templates, so the backend only communicates with the frontend through the API. These JavaScript frameworks provide methods to modularize the code, so the maintainability is easy. Examples of these frameworks could be AngularJS, Ember, React.js, Backbone and so on. They all use plain JavaScript, but some can also use CoffeeScript, a language that uses a syntax similar to Ruby. Of course, jQuery can also be used to improve cross-browser compatibility, because browsers can implement JavaScript differently sometimes.

The backend can implement the templates, so a frontend developer must adapt to the chosen backend language and write there the layout. But if the backend only provides the API, then the templates must be implemented in the frontend, using one of the frameworks I talked about before. This is where both “ends” can overlap.

So a frontend developer must know, essentially, HTML, CSS and JavaScript. From this point, a huge amount of tools and frameworks are available to make the work easier, although in the beginning you will have to pass the learning curve.

Backend

Backend is what cannot be seen directly in the browser. It is something computing and providing information from the background. Essentially interacting with a database or other services (such as a search engine, image processing, and so on).

Nowadays no one implements a backend from scratch (except those big internet companies that you know). To make the work easy, it is common to use a framework. For Ruby, the most common framework is Ruby on Rails, which provides an MVC pattern. The V is where the backend can overlap the frontend, as we saw before.

But if the application must provide a simple API, it is common to use a micro-framework such as Sinatra, which lets implement routing and controllers in a single file.

The backend developer must normally care about the database, which can be relational (such as PostgreSQL) or document oriented (such as MongoDB). The latter are also known as NoSQL. When the database is big enough to be the core of the company, a different person must take care of it: the DBA.

But not all is about providing information for the current user browsing the website. Sending notification emails is something managed by a queue system that is run asynchronously to improve concurrency. For this matter there are several solutions which can be used. In the Ruby world, a very popular system is Sidekiq, which uses Redis to have a fast access to what it is going to process.

Finally, the application must be deployed to the server. Except for Microsoft web technologies, the rest are usually deployed to Linux servers, so the backend developer needs the knowledge to setup this operating system, and eventually optimize it. Then, with the help of a deployment tool (such as Capistrano), only the changes are uploaded.

Conclusion

Although it is tentative to work on both specializations, it is better to focus on one, because they are getting big enough and making huge advancements.

If you like user interfaces and are comfortable using HTML and styles, frontend is your area. But take into account that JavaScript is a must, because you will be using all kinds of tools and frameworks that use this language. But remember, the frontend developer is not a designer.

On the other hand, if you feel more comfortable working with databases and serving requests, or just using a full-stack environment, backend is for you. You will have to manage queues, the operating system and deployments. But the most important thing is to choose a language which will make you happy. Ruby is a great one. In fact, the Ruby slogan is “a programmer’s best friend” 🙂

What field do you like more and why?

Did you like it? Please share it:

Get my ebook for free

10 ideas that helped me become a better developer (and may help you too)

Subscribe to my mailing list and get my ebook on 10 ideas that helped me become a better developer.

About Me

David Morales

David Morales

I'm David Morales, a computer engineer from Barcelona, working on projects using Ruby on Rails and training on web technologies.

Learn More