HOME

TheInfoList



OR:

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