Find Jobs
Hire Freelancers

Web development: Front end vs back end

Want to get into web development but don't know whether to be a front end or back end dev? We'll teach all of the skills required for both jobs.
6 Μαΐ 2019 • 7 λεπτά ανάγνωση
Ενημερώθηκε στις 21 Ιαν 2020 από τον/την Closed User
Φωτογραφία Φόντου

Find out the difference between front end and back end development, and the skills you'll need to succeed.

So, you want to get into the web industry, but you don't know which way to specialize. Not a problem. The very first “zig/zag” decision one needs to make is this: front or back?
On the surface that sounds like an innocuous choice, like deciding which seat to shotgun for a very long car trip, or what side to present to a stranger when sliding past in an airplane aisle. Deeper considerations need to be made, however, lest life get unpleasant.
Let's break down the absolute basics of the web industry now, to ensure you don't wind up back-to-front (end) in a career you don't enjoy.
Front-end work (sometimes called the client-side) is typically referred to as “web design”. A back-end job (widely known as server-side) is a “web developer” role. That's the basic gist, now let's dig into the specifics.

What is front end development?

Your job will be primarily visual. It shall be your guiding hand and artistic eye that decides what the end-user will see in either the app they're using, or the browser window on their desktop. You're an organiser of aesthetics – from colors and typefaces to imagery, buttons and navigation menus. 
It's not all just moving pretty pictures around and avoiding Comic Sans, though. Debugging and designing applications along with code analysis are very much in the purview of a front-end developer. 
A big part of your job is ensuring the user gets everything they seek in a straightforward manner. Attention spans are at an all-time low. You've got about three seconds to dazzle and delight a visitor while also keeping the navigation idiot-proof.

Featured Work in Website Design

Portfolio item image
Homepage Redesign
by JohnFLAG
Portfolio item image
Renault Website Design
by negar72
Portfolio item image
Custom Design - Furniture Website
by mdataur15
Portfolio item image
Website Design
by skrbic81

Basic skills required

By and large, the languages you'll be most exposed to will be JavaScript, CSS and HTML. If you've never coded before, don't worry too much. None of these programming disciplines is especially obtuse and their syntax is relatively easy to pick up.
CSS (Cascading Style Sheets) and HTML (Hyper Text Markup Language) are your entry level languages. You’ll have to master both before you can think about taking the front-end web development industry by storm. The good news: in a month you can gain a solid working knowledge of either of these.
JavaScript is a much more powerful beast that can let you craft more complex web applications. For example, JS can be used to enhance the functionality of any user interface, or it may be leveraged to make modest-sized games, interactive maps or just about anything your heart desires.
The code you'll produce will run on the user’s favorite browser of choice (if all goes to plan). As a front-end web developer, you're in charge of making sure that there are no bugs or glitches that negatively affect the viewing experience. Expect to divide your time fairly evenly between layouts, typography, color theory and grid systems, not to mention making sure that the design you have appears as intended. In today's market, with a bunch of different tablet, phone and desktop platforms and browsers to serve, this can be a challenge.

Intermediate skills

The next step up from making static sites for small businesses (or opportunistic family members who probably don't pay too well) is a job managing an existing corporate site. In this role it's more likely you'll not be making everything from scratch, rather you'll be maintaining and tweaking to an established front-end framework. Basically, these give you a better means to hit the ground running and code faster.
If the site leans more to CSS there's a good chance you'll be working with a popular framework called Bootstrap. Alternatively, you may also need to use popular JavaScript frameworks like Backbone, AngularJS, ReactJS and Ember.
Weird names aside, these frameworks are singular in their purpose: to provide you with a pre-baked structure that can be easily used with a vast libraries of ready-made code to minimise your need to code from scratch. It's also highly likely that you'll need to know your way around image editing software, most likely Adobe Photoshop. A front-end dev isn't expected to be the modern day Creative Cloud equivalent of Rembrant, however. You'll be able to get by with basic knowledge of resizing/cropping, file size optimization, and have the ability to "touch up" images that may not be to spec when supplied by photographers.

Front-end programming jobs

Business is booming in web development and front-end aficionados are in relatively high demand. There are, however, a number of specialised roles that fall under the umbrella of “front-end dev” or “web designer”.
The most common divider you'll see in advertised roles is between UX/UI designers or “User Experience” and “User Interface” respectively. The UX professional is something of a focus tester, a deliberate breaker of things who's out to guarantee that the site is not just functionally sound but also geared to appease a very specific user/customer. Meanwhile, the UI designer is more about making the visual elements of any app or site “pop” in such a way as to snag the eye.

Qualifications checklist

A quick glance at websites offering “by the numbers resume templates” tells us that the following traits are desirable in a hireable front-end designer:
Adept at web markup, including HTML5, CSS3.
Fundamental understanding of CSS pre-processing platforms.
Skillful understanding of client-side scripting and JavaScript frameworks (JavaScript fluency is a bare minimum).
Decent understanding of advanced JavaScript libraries and frameworks, such as KnockoutJS, AngularJS, ReactJS, BackboneJS, DurandalJS and the like.
Good understanding of partial page updates and asynchronous request handling
Can use image editing software tools (like Photoshop or Gimp) to be able to resize, crop or enact modest changes to an image.
Can problem-solve cross-browser compatibility challenges.
Basic understanding of code versioning tools.
Proficient in SEO principles and how to implement them.
 

What is back-end development?

Back-end development is the “server side” role of web development. Essentially, your purview is that of a behind-the-scenes database communicating to a browser and, more importantly, to build and maintain server technology.
You're about the complex side of things: the interrelationship between server, application and end-user. You can expect your day-to-day to include implementing site-wide changes and updates, monitoring functionality, and writing the code that governs database information. You're less about making pretty window dressing and more about building and maintaining the framework holding said panes up (and indeed the entire shop structure around it). No pressure at all. 

Basic skills required

The average back-end developer is quite familiar with the programming languages used by their front-end counterparts (think: JavaScript, CSS and HTML).
That said, running sites and servers will require you to be much more multilingual than the UI/UX artistes. It's not uncommon for a back-end dev to be fluent in Python, PHP, Ruby, and .Net (read: C# and/or VB).
Basically, there are two types of back-end programming techniques: Object Oriented (OOP) or Functional. The former is action-based as functional uses statements can be executed in any order (known as declarative language). Popular Functional languages include F#, R and SQL (more on this one in a second). Meanwhile, OOP focuses on statements that should be executed in an especial order. Popular languages that use this technique are .NET, and Python.
You'll need many different languages under your belt in order to wrangle and reliably deliver the data required for what's commonly known as a dynamic site. Practically any front-end developer can make the alternative, a static site. But a dynamic site needs to handle an ever-changing collection of user and company data.
Obviously, when you're dealing with sensitive information this means you'll need to be well across security protocols, procedures and the like. Once you get your head around the basics of the back-end, you'll need to familiarise yourself with popular tools. These are required to locate, secure, or swap data and then fire it on back it back to the end-user in a timely fashion. At the time of writing some preferred options that facilitate this are Oracle, MySQL, MongoDB, PostgreSQ and SQL Server. 

Intermediate skills

Nowadays you can also expect to see back-end job listings that require experience with Linux and version control software, like Git, CVS or SVN. It would also be a boon for you to know your way around handy PHP frameworks like CakePHP, Zend or Symfony.
Often, a company will offer a mobile app for iOS or Android along with their main website as well, which requires a slightly different set of skills. To retrieve data for display, these apps are going to need an Application Programmer Interface (API) to connect to. You'll therefore need to make sense of JavaScript Object Notation (JSON) and/or eXtensible Markup Language (XML).
Obviously, while one part of the job is to be a technically-minded problem solver, some decent communication skills are going to be needed as well. Clients who may not be anywhere near as tech-savy as you will need to be walked through your server/database borax. You'll need to discover your customer's requirements while helping to explain complex technology and architecture.
One of the more recent developments for back-end devs is blockchain engineering. Being able to build decentralised applications (DAPPS) from scratch or integrating them in existing website frameworks has become an increasingly desirable skill to have in your resume.

Freelance Website Design Experts

Avatar Χρήστη
Σημαία της Devinkumar T.
20 USD / hour
5,0 (217 αξιολογήσεις)
PHP
JavaScript
Website Design
Graphic Design
Logo Design
Visit profile
Avatar Χρήστη
Σημαία της Webcapitan
40 USD / hour
5,0 (511 αξιολογήσεις)
PHP
JavaScript
Python
Website Design
Graphic Design
Visit profile
Avatar Χρήστη
Σημαία της Cybrok Solutions
36 USD / hour
5,0 (445 αξιολογήσεις)
PHP
Java
JavaScript
XML
Script Install
Visit profile
Avatar Χρήστη
Σημαία της Softmania
39 USD / hour
4,8 (590 αξιολογήσεις)
PHP
JavaScript
XML
Adobe Flash
Website Design
Visit profile

Back-end programming jobs

Back-end roles are relatively straightforward and aren't typically defined into specialties like front-end designers with their “UI” and “UX” roles. The term you're more likely to see alongside requests for a back-end developer is a “full-stack developer”. Essentially, this is IT speak for jack-of-all-trades; an individual who can comfortably handle both the front and back-ends of a job.
This typically comes about because, as mentioned earlier, a back-end dev needs to know the codebases used by the front-end dev. Once you know that, having a reasonably artistic eye is the final barrier standing between you and being an all-in-one web producing machine. Expect these highly-sought-after individuals to become a more and more common. 

Qualifications checklist

After looking through a number of websites that offer “resume templates” for especially time-poor folks, the following attributes are what's currently desirable in a back-end dev...
Knowledge of most front-end technologies and platforms (HTML5, CSS3 and JavaScript).
Is proficient with LESS, SASS and other server-side CSS preprocessors.
Well-versed in security compliance and accessibility (OWASP security principles especially).
Can consolidate multiple databases and data sources into one system
To support load changes, can ably manage hosting environments, including database administration and application scaling.
Proficiency in data migration, transformation, and scripting
Knowledgable of optimising output for a variety of multiple delivery platforms (mobile/desktop).
Can support business processes by creating database schemas.
Adept at many different back-end programming language (e.g. Python, Java, PHP, .NET).
Well-versed in Git and other code versioning software.
In a distributed server environments, an understanding of “session management”.

Featured Work in Website Design

Portfolio item image
Website User Interface
by bilgeberkay
Portfolio item image
Reworked WooCommerce Shop
by syrwebdevelopmen
Portfolio item image
Funds Management - Website Design
by dendenn
Portfolio item image
Danef - Landing Page
by AquimaWeb
 
 
Πείτε μας τι χρειάζεστε να γίνει
Συμπλήρωσε το όνομα της εργασίας σου
Ξεκίνα την Εργασία σου
Σχετικές Ιστορίες

Μίλησε με έναν από τους Τεχνικούς μας Co-Pilots για να σε βοηθήσουν με την εργασία σου

Λάβε Βοήθεια Τώρα

Προτεινόμενα Άρθρα Μόνο για Εσένα

Thumbnail Άρθρου Building your business' website from the ground up
Learn the complete end-to-end process of building a successful website for your business in our comprehensive guide 
19 min read
Thumbnail Άρθρου Your complete guide to hiring a programmer
You can hire a programmer to solve just about any complex problem, the problem is knowing how to hire the right professional for the job. Learn how..
13 min read
Thumbnail Άρθρου Why hiring a graphic designer is vital for your business in 2023
Great graphic design will solidify your brand identity and drive revenue. Find out how to hire a great designer and what you should expect to pay.
9 min read
Thumbnail Άρθρου Why your website needs great writing
The copy on your website matters. Hiring a professional writer will help you engage, inform and motivate your customers to convert to your offering.
4 min read
Ευχαριστούμε! Σου έχουμε στείλει ένα email με ένα σύνδεσμο για να διεκδικήσεις τη δωρεάν πίστωση σου.
Κάτι πήγε στραβά κατά την προσπάθεια αποστολής του email σου. Παρακαλούμε δοκίμασε ξανά.
Εγγεγραμμένοι Χρήστες Συνολικές Αναρτημένες Δουλειές
Freelancer ® is a registered Trademark of Freelancer Technology Pty Limited (ACN 142 189 759)
Copyright © 2024 Freelancer Technology Pty Limited (ACN 142 189 759)
Φόρτωση προεπισκόπησης
Δόθηκε πρόσβαση για Geolocation.
Η σύνδεση σου έχει λήξει και τώρα έχεις αποσυνδεθεί. Παρακαλούμε συνδέσου ξανά.