Software development is often broken down into front end, back end, and full stack. In this post, we’ll clarify what the terms refer to and cover the kinds of tools, languages and skills each domain covers, before looking at how your business can get the talent you need. We’ll start with definitions:
What do front end, back end, and full stack development mean?
When we develop an application, let’s say a web app, we actually build several different structures that exist in different places and do different things. This is an oversimplification, but:
Front end = Lives in browser
Back end = Lives on server
Another way to think about this is:
Front end = user sees it
Back end = user doesn’t see it
Front end development is about the layout and interface of a site or app. It involves making and implementing choices like how the app is structured, or how it behaves when you interact with it — swiping, zooming, or even how the onboarding flow is built. For this reason, front end developers often either have UX skills or work closely with UX designers.
Back end development is about the infrastructure that makes all this happen. That means the server, databases, and codebase that power the transfer of information between user and server. For this reason, back end designers are more likely to be concerned with data architecture, application structure, and database design than with user experience per se.
However, these are two ‘ends,’ not two separate domains. The database needs to take user experience into account, because it exists to facilitate a positive experience. Good front end design depends on a working knowledge of, and integration with, the back end.
What does this look like in practice?
Imagine something familiar: an ecommerce website that also has an app. H&M is a good example. On the front end, you might be looking at their website.
This user-accessible front end lives in your browser. But it refers to a dynamically-updated database of available merchandise, segmented by location so I only see products I can buy based on my IP address.
If I go into the same app on my phone…
Again, this front end is designed to be appealing and easy to use on a specific device. It’s built to take advantage of the OS and physical features of an iPhone, and to make users enjoy using it and want to come back. But these images do the same job as the links in the desktop image: they refer to an underlying database of available merchandise and use an application to let me look through it, choose something and buy it.
There are all sorts of ways to construct cross-platform tools like this but the standard is to have the iOS, Android, and web apps all point to the same underlying infrastructure and especially to refer to the same database or databases. That often means doing a lot of quite complex work on the application layer to make sure that the database is correctly synchronized across devices and operating systems.
When someone does buy something through an app like this, the front end processes what the user does — lets me fill in a form with my address and card details, choose a size and a delivery option, and so on. But when I do those things in the front end, the back end is sending the relevant information to warehousing, couriers, payments, and the database. They’re often built by different developers (not always!) and they employ different skillsets, but they’re used to construct a seamless operation.
See for yourself
So think about the website you’re reading this on right now. If you press CTRL+CMD+C (Mac) or CTRL+SHIFT+J (PC), you’ll open developer tools in Chrome, Firefox and other browsers. You’ll be able to see the code for the website, looking at you on the right hand of your screen.
When you navigate here using your browser, what you see is: a web page opens. But under the hood, your browser sends a request to our servers. Our server replies by sending the code for the website to the browser. The code includes even more calls back to our servers, depending on what the website looks like and what it does. So you can see that the division isn’t totally clear-cut.
At the back end of the site, as with any site or any application, is a server, an application, and a database. Back end developers build and maintain those elements. The database contains all the information used to deliver the services the website offers — all product descriptions, prices and availability for an ecommerce store, for instance. The application lets you find and see things from the database. The server is the computer (actually a network of virtualized computers, often in multiple physical locations) where it all lives.
The website code you can see in your browser window was created by a front end developer, and the infrastructure that lets you see it was created by a back end developer.
So what’s a full stack developer? Full stack developers, or full stack development teams, do both front end and back end development. That might be a single developer who can do it all, or a team with specialized roles and a cohesive vision of the final product.
Tools and languages used for web app front end development
Front end development uses a few standbys that almost everyone uses, and a huge array of specialized technologies for achieving specific ends. In 2021, the most-used front end languages for web development were:
HTML
HTML is Hyper-Text Markup Language. It tells web pages what verbal information to display and how it should be laid out. It’s HTML that defines elements of a page like links, and handles elements like h1 tags and title tags that determine how browsers and search engines understand a page. It also contains calls to the server to find and send other assets, like images.
If you’d like to get more of a handle on how HTML works, it’s surprisingly easy to gain basic competence and there’s a good, free, simple course at learn-html.org.
CSS
CSS stands for Cascading Style Sheet. It’s a way of reducing the amount of code your browser has to load, and it forms the visual elements of a web page. A page of HTML is basically ‘put this here, such and thus a size, then put this after, in the middle of the page, then show this text: Lorem Ipsum.’ A page of CSS is basically, ‘always make text gray, Times New Roman, and 14 point. Always put a border around images. Make the background light blue.’ That way, you don’t have to put all that in the page’s code directly. The browser knows to make text gray and 14 point, you don’t have to tell it to do so every paragraph.
The website’s HTML might say:
<p>Lorem Ipsum</p>
The ‘<p>’s are HTML tags that tell the browser to treat the text between them as <p>aragraph text. But the browser also knows, from the website’s relationship with its stylesheet, what color, size and placement rules to apply to everything classified <p>.
They’re called ‘cascading’ style sheets because of the way they treat styling, in a hierarchical order that starts with the browser default and goes through rules defined by on-page code, theme styles, specific styling tags and finally CSS override directives.
To learn more about how CSS works or try your hand at it, check out learn-html.org/en/styles.
JavaScript
JavaScript is the language websites use for reactive elements. It lets front end developers build sliders, hamburger menus, popups, form validation and more. Anything you can change by hovering over it, clicking it, or otherwise interacting with it is probably written in JavaScript. Without JavaScript, the only options for changing a web page would be to completely reload it or to link to a different page. JavaScript uses a lot of pre-written, pre-validated code called libraries, often optimized for different purposes. Some of the most popular are JQuery, React JS, and D3.js. JavaScript is also now an important part of back end development where it can also be used for application development thanks to advances like the NodeJS runtime library.
Front end development tools include a text code editor like Sublime Text or NotePad++, that let front end developers write code, check it, and easily adjust it. Chrome’s own Developer Tools is also popular: in the hands of skilled developers it’s a design, coding, editing and debugging, all at once. Like other developers, front end devs will reach out to GitHub and StackOverflow for information and solutions to sticky or unusual problems too.
Front end designers must ensure that their work is effective across multiple browsers — it’s not going to look great in Lynx (nothing does) and most users are on Chrome, but Edge, Firefox and Opera browsers and older browser versions must also be able to see and navigate the site.
Equally important in a front end developer is the ability to work with designers and back end developers, to create something that works with both user intent and the structures and content of the back end.
What about mobile apps? Mobile apps are increasingly important and mobile app development doesn’t use the same front end tools at all.
Tools and languages for mobile app development
Mobile app development is separated by operating systems. Because modern browsers are like miniature operating systems (Chrome is the most developed case of this, and actually is its own operating system on Chromebooks), developers can build for the browser, not the underlying operating system, when they’re building web applications. Mobile apps are different. They structure files differently, interpret instructions differently and manage their hardware resources differently. So if you want a mobile app, you usually need two versions of it: iOS, for iPhones, iPads and so on, and Android for other smartphones and tablets.
Languages and tools for Android development
Kotlin and Java
Kotlin is the official language for Android app development since 2019. Kotlin is a cross-platform language mostly used for Android, introduced as an alternative to Java. It’s interoperable with Java, has been a secondary official Java language since 2017, and like Java it runs on the Java Virtual Machine (JVM — see below). It’s simpler to write than Java and more specialized, but otherwise very similar, making the transition easy and serving as an entry point to Java for new app developers.
Java is a general-purpose, cross-platform language that works on desktop, server and mobile thanks to the JVM, and it’s one of the world’s most popular programming languages. It’s also commonly used to write apps for Android. In addition, developers fluent in both languages can write most of an app in Kotlin and parts in Java if they need to.
C#
C# is similar to Java in many ways, making it an ideal choice for Android development. It has a cleaner, simpler syntax than Java so coding with it is comparatively easier. Initially, C# was a Windows-only language, but the development of Xamarin for Android means C# can be used to write native Android apps and share the code across multiple platforms.
HTML, CSS, Javascript
Even though they’re the characteristic languages of web applications, they can be used to develop Android applications too. This involves using the Adobe PhoneGap framework powered by Apache Cordova, allowing the development of hybrid apps that are written like web apps, shown through WebView to users, but packaged like a mobile app. However, this is often a stopgap prior to the development of a true native Android app. While these apps require relatively little coding, they’re often less than full-featured and to create a full-featured app this way requires a lot of workarounds.
Languages and tools for iOS development
Swift and Objective-C
Swift was developed specifically for developing iOS apps, including tvOS and watchOS as well as phones and tablets. It was created in 2014 to be the successor to Objective-C, and is designed to work with frameworks like Cocoa, Cocoa Touch, and the extant Objective-C codebase.
Objective-C is an object-oriented language built as an extension of the C programming language in the 1980s. It’s a general purpose language, used extensively in both desktop and mobile Apple computing products.
C#
We’ve already met C#. It’s one of the most popular languages for building native iOS apps as well as many other uses.
HTML, CSS, and JavaScript
The web developer’s standard front end bundle can also be used to build iOS apps using either Adobe Cordova, or Visual Studio for Mac. As with Android apps, though, these are usually stopgaps since native applications perform better.
Tools and languages used for back end development
Back end developers create things that end users don’t normally see. These are the elements that the code in a browser (‘client-side code’) sends requests to, and we can see it in two main ‘layers’: the application layer, and the database layer.
Application layer languages and skills
Server-side applications (as distinct from mobile apps) are built using languages like PHP, Ruby, Python, Java and .Net. Each has distinct features suiting it to a project over other options: for instance, Java uses the Java Virtual Machine (JVM) which runs as an intermediary between Java code and the device where the code is to be deployed. That means it’s a good choice if it might need to work on a lot of different devices, but it costs efficiency to achieve flexibility. One of the key skills of back end developers is in selecting language based on current and projected project needs. Some back end developers are specialists, called in by project managers or Dev Ops when the situation calls for a PHP expert; others can work in several languages and will select the one they think best fits your project.
Database layer languages and skills
The database layer is where all the actual information is stored. It has to be managed, structured, and maintained. So, for instance, the developers who build the database layer need to be good at recognizing the relationships between different types of data and building structures to accommodate those relationships. They also need to know something about what the application, and the eventual end user, will want out of the database, as well as the business’ expectations and goals. Database developers are skilled in languages like SQL (Structured Query Language), MySQL, Oracle, and SQL Server, which let them build databases that find, save, or change data, and serve it to the user in front-end code.
Database developers often refer to the stacks they use by acronyms like LAMP (Linux, Apache, MySQL, and PHP); alternatives include LEMP (Linux, NGINX, MySQL, Perl), LAPP (Linux, Apache, PostgreSQL, PHP), and LEAP (Linux, Eucalyptus, AppScale, Python). What these have in common is a reliance on Linux, which is far and away the most common operating system on servers. Outside that commonality, there’s a bewildering array of tools and techniques in use. Individual developers will have their own preferences, but experienced developers and project managers can match the stack to the project.
In addition, Amazon Web Services plays an increasingly important role in development. AWS lets developers build using Amazon’s own Amplify toolkit, compatible with JavaScript, React, Angular, Vue, and Next.js for web apps and Android, iOS, React Native, Ionic, and Flutter. The attraction for developers is that it makes development faster, easier and more flexible, because it lets them plug pre-existing AWS services into the back end instead of developing analogous functionality from scratch. But it comes with downsides, especially when businesses want to change cloud provider or if code needs to be particularly lean.
Where do full stack developers fit in?
Individual full stack developers can be thought of as ‘deep, rather than wide’; rather than knowing all there is to know about how to develop a specific type of database with SQL for use with a specific type of business or project, they know how to build the whole structure, but they might not have the versatility at any one layer that an expert would. Think of the skillset you’d expect of someone who can build a whole house: it’s impressive, but at every stage, a specialist might do a better job. A bricklayer would lay brick better, a roofer lay roof tiles more accurately, and an architect might have designed the house better. In the same way, a full stack developer might not develop each layer as well as an expert in that layer.
On the other hand, full stack teams are a different proposition. They’ll usually draw on a range of skill sets, with experts drafted in at need to supply solutions. It’s less like hiring a jack of all trades, and more like hiring a building company which in turn employs roofers, bricklayers, electricians and so forth.
Outsourcing front end, back end, and full stack development
Some businesses already have all the skills they need in-house, but it’s relatively rare. Partly that’s because both the languages involved and the use cases change constantly, and partly it’s because businesses often seek to change what they offer their customers in ways that go beyond the skills of their current team.
It’s also because if you have a team of five developers, each earning $107,510 a year (the average developer salary) and you want them to build you a whole new web application from scratch, it might take them three to five months, maybe longer if your requirements are very complex. On the other hand, you might be able to get a new product to market in 100 days or less…
However it happens, once they’ve built the web app, there’s not so much for them to do, but they’re still costing you the same half-million a year plus benefits. And developers are notoriously time-consuming and tough to hire, too.
That’s the argument for outsourcing. But how should you go about it?
You could outsource individual developers. That’s only usually a good idea if you’re clear about which specific areas you need help with and have the skills to match a developer’s CV with the tasks you need to have performed.
Or you can outsource development, not developers. A full stack development team that has the skills to build, design, repair, and maintain your application, database and front end is the most effective and efficient way to go.
How AndPlus can help
AndPlus has been providing back end, front end, and full stack development to businesses since 2005. We’ve built a strategy-first approach to software development that centers your business goals, then structures turnkey product development, consulting and team member or function replacement around them. Using the full range of technologies discussed in this post — plus a few we didn’t get to — we engage in constant, comprehensive upskilling, so we’re always ready to provide capabilities in leading-edge technologies like custom blockchain and Dapp development, natural language processing and machine learning, and computer vision development.
If you’re starting at the beginning we can help match technical requirements to your business goals, offer a tried-and-tested structure for rapid and successful development and launch, and help with maintenance and iteration afterward.
See for yourself what we’ve done for our clients, including full-stack development of cross-platform applications, and emerging technologies like IoT.
Takeaways
- Front end describes the part of an application the user sees and interacts with.
- Back end describes the infrastructure that allows this to happen by storing the data, sorting and finding it, and responding to the user’s actions.
- Full stack means being able to develop database, application, and front end.
- Full stack developers tend to be versatile but not experts in any one domain. Expert developers tend to be less versatile.
- The most cost-effective and efficient way to get the development expertise you need is usually to outsource it.
