What is full stack development?

Overview

Full-stack development includes the development of the front-end (client-side) and back-end (server-side) of a web application. It encompasses all the layers in software development, namely the presentation layer, business logic layer, and database layer.

Some of the most popular stacks used for full-stack development are listed as follows:

• MERN: MongoDB, Express, React, Node.js

• MEAN: MongoDB, Express, Angular, Node.js

• LAMP: Linux, Apache, MySQL, PHP

• Django: MySQL, Python, Django

Note: Some languages are multi-purpose. They can be used for both front-end and back-end development. Examples of such languages include JavaScript and Python.

The presentation layer (front-end or client-side) is responsible for the visible part of a web application. It facilitates user experience and interaction through visual indicators such as buttons, menus, and icons. Moreover, it dictates the overall layout of the web pages and ensures responsiveness.

It includes the following languages:

• HTMLHyperText Markup Language: This defines the content and structure of a web page as well as the linking between different web pages.

• CSSCascading Sheet Style: This enables a web page's styling (such as colors, layout, and animations) when used in conjunction with HTML.

• JavaScript: This is used to make web pages dynamic and interactive. It supports user interactions such as clicking on buttons.

Front-end development also utilizes certain tools to help speed up the process. The most popular ones are as follows:

• AngularJS

• React

• Bootstrap

• SemanticUI

The business logic layer (back-end or server-side) refers to the internal mechanics and architecture of the application. It includes the management of the database through queries and APIs through client-side communication. There is no direct interaction with the user in this layer.

It includes the following languages:

• PHP

• C++

• Java

• Python

Similar to front-end development, the back-end also employs several libraries and frameworks. Some of these are:

• Express

• Django

• Ruby

• Rails

Database layer

The database supports data organization in the form of tables, pages, schemas, and views. It enables efficient retrieval, insertion, deletion, and updating of data.

Popular databases include:

• Oracle

• MySQL

• MongoDB

• SQLite

Putting it all together

Consider the following example. The search bar on a web page is displayed on the client-side, and the user can search for some data. The fetch request is processed on the server-side and is forwarded to the database. The data will be displayed to the user on the client-side once it is fetched from the database.

A sequence diagram outlining this process is shown below:

Additional skills

Full-stack development also requires the adoption of some supplementary knowledge and skills. These are as follows:

• Version Control: This helps keep track of all source code versions.

• REST and HTTP: These facilitate communication over the internet.

• Testing and Debugging: These help ensure that the code is error-free and working as intended.