In
software engineering, the terms frontend and backend (or sometimes referred to as back end or back-end) refer to the
separation of concerns between the
presentation layer (''frontend''), and the
data access layer (''backend'') of a piece of
software
Software is a set of computer programs and associated software documentation, documentation and data (computing), data. This is in contrast to Computer hardware, hardware, from which the system is built and which actually performs the work.
...
, or the physical infrastructure or
hardware. In the
client–server model, the
client is usually considered the frontend and the
server is usually considered the backend, even when some presentation work is actually done on the server itself.
Introduction
In
software architecture, there may be many
layers between the hardware and
end user
In product development, an end user (sometimes end-user) is a person who ultimately uses or is intended to ultimately use a product. The end user stands in contrast to users who support or maintain the product, such as sysops, system administrat ...
. The ''front'' is an abstraction, simplifying the underlying component by providing a
user-friendly
Usability can be described as the capacity of a system to provide a condition for its users to perform the tasks safely, effectively, and efficiently while enjoying the experience. In software engineering, usability is the degree to which a soft ...
interface, while the ''back'' usually handles data storage and
business logic.
In
telecommunication
Telecommunication is the transmission of information by various types of technologies over wire, radio, optical, or other electromagnetic systems. It has its origin in the desire of humans for communication over a distance greater than tha ...
, the ''front'' can be considered a device or service, while the ''back'' is the infrastructure that supports provision of service.
A
rule of thumb
In English, the phrase ''rule of thumb'' refers to an approximate method for doing something, based on practical experience rather than theory. This usage of the phrase can be traced back to the 17th century and has been associated with various t ...
is that the client-side (or "frontend") is any component manipulated by the user. The server-side (or "backend") code usually resides on the
server, often far removed physically from the user.
Software definitions
In
content management systems, the terms ''frontend'' and ''backend'' may refer to the end-user facing views of the CMS and the administrative views, respectively.
In
speech synthesis
Speech synthesis is the artificial production of human speech. A computer system used for this purpose is called a speech synthesizer, and can be implemented in software or hardware products. A text-to-speech (TTS) system converts normal languag ...
, the frontend refers to the part of the synthesis system that converts the input text into a
symbol
A symbol is a mark, sign, or word that indicates, signifies, or is understood as representing an idea, object, or relationship. Symbols allow people to go beyond what is known or seen by creating linkages between otherwise very different conc ...
ic
phonetic representation, and the backend converts the symbolic phonetic representation into actual sounds.
For major computer subsystems, a graphical
file manager is a frontend to the computer's
file system
In computing, file system or filesystem (often abbreviated to fs) is a method and data structure that the operating system uses to control how data is stored and retrieved. Without a file system, data placed in a storage medium would be one larg ...
, and a
shell interfaces with the
operating system
An operating system (OS) is system software that manages computer hardware, software resources, and provides common daemon (computing), services for computer programs.
Time-sharing operating systems scheduler (computing), schedule tasks for ef ...
. The frontend faces the user, and the backend launches the programs of the operating system in response.
In
compilers, the
frontend translates
Translation is the communication of the meaning of a source-language text by means of an equivalent target-language text. The English language draws a terminological distinction (which does not exist in every language) between ''transla ...
a computer programming
source code
In computing, source code, or simply code, is any collection of code, with or without comment (computer programming), comments, written using a human-readable programming language, usually as plain text. The source code of a Computer program, p ...
into an
intermediate representation, and the backend works with the intermediate representation to produce code in a computer output language. The backend usually
optimizes to produce code that runs faster. The front-end/back-end distinction can separate the
parser section that deals with source code and the backend that
generates code and optimizes. Some designs, such as
GCC, offer choices between multiple frontends (parsing different source
languages
Language is a structured system of communication. The structure of a language is its grammar and the free components are its vocabulary. Languages are the primary means by which humans communicate, and may be conveyed through a variety of met ...
) or backends (generating code for different target
processors).
Using the
command-line interface (CLI) requires the acquisition of special terminology and memorization of
commands
Command may refer to:
Computing
* Command (computing), a statement in a computer language
* COMMAND.COM, the default operating system shell and command-line interpreter for DOS
* Command key, a modifier key on Apple Macintosh computer keyboards
* ...
, so a
graphical user interface (GUI) acts as a frontend
desktop environment instead.
Web development as an example
Another way to understand the difference between the two is to understand the knowledge required of a front-end vs. a back-end
software developer
Software development is the process of conceiving, specifying, designing, Computer programming, programming, software documentation, documenting, software testing, testing, and Software bugs, bug fixing involved in creating and maintaining applic ...
. The list below focuses on
web development
Web development is the work involved in developing a website for the Internet (World Wide Web) or an intranet (a private network). Web development can range from developing a simple single static page of plain text to complex web applications ...
as an example.
Both
*
Version control tools such as
Git,
Mercurial, or
Subversion
Subversion () refers to a process by which the values and principles of a system in place are contradicted or reversed in an attempt to transform the established social order and its structures of power, authority, hierarchy, and social norms. Sub ...
*
File transfer tools and protocols such as
FTP or
rsync
Front-end focused
* Markup and web languages such as
HTML,
CSS,
JavaScript
JavaScript (), often abbreviated as JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. As of 2022, 98% of Website, websites use JavaScript on the Client (computing), client side ...
, and ancillary libraries commonly used in those languages such as
Sass
Sass, Saß or SASS may refer to:
SASS
* M110 Semi-Automatic Sniper System (or M110 SASS)
* Safe Amplification Site Society, a non-profit organization that promotes music and the arts within Vancouver, British Columbia, Canada
* Shanghai Academ ...
or
jQuery
*
Asynchronous request handling and
AJAX
*
Single-page applications (with frameworks like
React,
Angular or
Vue.js)
*
Web performance (largest contentful paint, time to interactive, 60
FPS animations and interactions, memory usage, etc.)
*
Responsive web design
*
Cross-browser compatibility issues and workarounds
*
End-to-end testing
Software testing is the act of examining the artifacts and the behavior of the software under test by validation and verification. Software testing can also provide an objective, independent view of the software to allow the business to apprecia ...
with a
headless browser
*
Build automation to transform and bundle JavaScript files, reduce image sizes and other processes using tools such as
Webpack and
Gulp.js
gulp is an open-source JavaScript toolkit created by Eric Schoffstall used as a streaming build system (similar to a more package-focused Make) in front-end web development.
It is a task runner built on Node.js and npm, used for automation o ...
*
Search engine optimization
*
Accessibility concerns
* Basic usage of image editing tools such as
GIMP
GIMP ( ; GNU Image Manipulation Program) is a free and open-source raster graphics editor used for image manipulation (retouching) and image editing, free-form drawing, transcoding between different image file formats, and more specialized task ...
or
Photoshop
*
User Interface
Back-end focused
*
Scripting languages like
PHP,
Python,
Ruby,
Perl,
Node.js, or
Compiled languages like
C#,
Java or
Go
*
Automated testing frameworks for the language being used
*
Application Data Access
*
Application Business Logic
Application may refer to:
Mathematics and computing
* Application software, computer software designed to help the user to perform specific tasks
** Application layer, an abstraction layer that specifies protocols and interface methods used in a ...
*
Database administration
*
Scalability
*
High availability
* Security concerns,
authentication and
authorization
*
Software Architecture
*
Data transformation
*
Backup methods and software
Note that both positions, despite possibly working on one product, have a very distinct set of skills.
API
The frontend communicates with backend through an
API. In the case of
web
Web most often refers to:
* Spider web, a silken structure created by the animal
* World Wide Web or the Web, an Internet-based hypertext system
Web, WEB, or the Web may also refer to:
Computing
* WEB, a literate programming system created by ...
and mobile frontends, the API is often based on
HTTP
The Hypertext Transfer Protocol (HTTP) is an application layer protocol in the Internet protocol suite model for distributed, collaborative, hypermedia information systems. HTTP is the foundation of data communication for the World Wide Web, ...
request/response. The API is sometimes designed using the "Backend for Frontend" (BFF) pattern, that serves responses to ease the processing on frontend side.
Hardware definitions
In
network computing
Network Computing is an online technical news publication that began as a printed magazine. During that period, ''Advertising Age'' ranked it among the ''Top 300'' print magazines. and advanced in 1995 from #146 to #133 with a circulation of 38,500 ...
, ''frontend'' can refer to any
hardware that optimizes or protects
network traffic. It is called
application front-end hardware because it is placed on the network's
outward-facing frontend or boundary. Network traffic passes through the front-end hardware before entering the network.
In
processor design, ''frontend design'' would be the initial description of the behavior of a circuit in a
hardware description language such as
Verilog, while ''backend design'' would be the process of mapping that behavior to physical transistors on a
die.
See also
References
{{DEFAULTSORT:Front And Back Ends
Software architecture
Software engineering terminology