What is Full Stack Web Development?

Technology is integrated into almost every aspect of human life and the internet is what makes it so powerful. Everything from buying appliances to talking with old friends to booking and attending medical appointments to reading world news can be found online— along with just about anything else you can think of. The world wide web is a web; it’s a series of individual devices connected to each other through a mix of signals and wires. Your phone, your personal laptop, your work computer, maybe even your car represent individual access points in this massive system of devices and servers.

And if you’re familiar with how coding works, you will know that it takes work to communicate directly from a person to a computer, let alone a person using a computer to get information from somewhere else on the web.

Before we define full-stack web development, we need to get on the same page.

We’re going to call the person using a computer a user, with let’s say a laptop. The user wants to browse the internet, purchase something we’ll call a widget, and have it delivered to their house. Pretty simple, right? There’s just a bit more detail that goes into taking the simple steps the user expects and translating them into the outcome the user desires.

First we’ll assume we’re really good at marketing and the user has found our website. What do you think they see? Likely a logo, the name of our company, maybe a menu at the top of the page showing what different categories of widgets we sell, a search bar, probably some eye-catching pictures, maybe a quote from a happy widget-customer. And many parts of this page—the menu, the search bar, widget product listings—are things we want the user to interact with. We want them to respond to the user, to be dynamic.

Not only do we want the user to be able to click on links and navigate our site easily, we also want to make sure the design is dynamic. This means regardless of device—desktop, tablet, or phone—the user can see all of the relevant information they need to accomplish their task. If we didn’t have dynamic design we would have to choose between mobile-friendly design that would saddle us with desktop screens with annoyingly narrow margins and near-infinite scrolling, or an exact copy of a desktop site that has to be zoomed into in order for anything to be legible on a phone screen. If you’ve looked at a well-designed site on a computer and then on your phone, you will notice it adapts dynamically to the device. This allows you to have an overall experience that feels cohesive even if its technically different.

All of these things, what a user sees and interacts with, are created by front-end developers. Sometimes they work on their own, sometimes they work with designers to create the fonts, colors, and layout, sometimes they use software like Squarespace or WordPress to make the foundation of a site. Regardless, they’re the reason a user can have an easy, convenient way of interacting with our widget store.

Hypertext Markup Language (HTML) is the backbone of most websites you will encounter on the internet. Cascading Style Sheets (CSS) or similar languages allow for more precise and comprehensive control of the aesthetic of a site, while JavaScript allows front-end developers to create things that respond to user input. There are many other languages and programs available to developers, as well, often catered to specific needs.

So back to our shopper. We’ll say our user has selected some widgets, uploaded their payment and shipping information, and completed their order. The user experience with the front end of our site is complete. So that’s everything, right? Not quite!

When thinking about how computers work, you need to consider all of the steps involved.

We need to deduct the widgets purchased from the shop inventory, make sure the warehouse knows which widgets need to be shipped and what destination, and process our user’s payment information. The user also logged into their account, so we need to make sure this purchase is associated with their account so they can get rewards or a return if necessary, and email with a confirmation of their order. There could be countless other pieces of information that a site might need to host. For example, a photo sharing site needs to manage pictures, albums, and tags so that users can find the images they upload. A doctor’s practice needs to be able to show their services, provide appointment booking, and track sensitive patient information. All of these things need to be secure, accessible, and organized.

Even though the user interacts with our website on their device, they don’t have access to our customer list, shipping manifest, or widget stock quantities, and it isn’t safe to make that information publicly available. It’s stored securely over on the Widget Company servers, so we need a way to communicate between our servers and the website/user.

This is what constitutes the back end, which powers the website. It ensures that users, whether that’s customers of the Widget Company or staff managing inventory and sales, can create, read, update, and delete (CRUD) the right data. We need to make sure that when someone increases the quantity of widgets they want to order, that the widget database that tracks inventory is automatically updated. We also need to make sure that database exists in the first place! When someone enters their shipping address, it has to be sent to the printer and associated with their order.

All of that information, is stored in a series of databases that communicate with each other and the greater internet. The ways in which they are able to communicate are created and maintained by back-end developers.

The back end isn’t accessed with the same kinds of user interfaces you might find on the front end. Communication between servers happens through database management applications like MySQL, Oracle, and SQL Server. It’s built on frameworks like Linux that are accessed through a command line. It’s often more of a strictly technical interface, dealing with the movement and manipulation of data between computers.

So the back end is where the data is actually hosted; the front end allows data to be viewed and edited in a way that is accessible to a user.

This brings us to Full Stack Web Development.

If you’re thinking that there’s a lot of connection between front-end and back-end developers, it’s because there is! Full Stack describes this entire spectrum. Full Stack developers can be particularly helpful for small teams who may not be able to hire or even need separate developer roles. It is a term that encompasses the breadth of the front and back end of web development. Understanding how the front and back end work allows an individual to better design programs and processes that will work seamlessly for the user (our shopper), the client (Widget Company), and the software developers who maintain the system.

Front-end and back-end web development do not exist in a vacuum; they rely on each other to provide the uncountable experiences you have online. Whether that’s sending an email from your laptop or looking up a restaurant menu on your phone, full stack web development is what puts an entire world of information in your hands.

You can learn more about our full stack web development program here.