The frontend of a software program or website is everything with which the user interacts. From a user standpoint, the frontend is synonymous with the user interface. From a developer standpoint, it is the interface design and the programming that makes the interface function. Conversely, the backend includes functions and data processing that takes place behind the scenes.
One of the primary goals of frontend development is to create a smooth or "frictionless" user experience. In other words, the front end of an application or website should be intuitive and easy to use. While this sounds like a simple goal, it can be surprisingly complex since not all users or devices are the same. For example, an app developed for a mobile device requires a significantly different frontend than a desktop application. Websites must work well on multiple devices and screen sizes, which is why modern web development typically involves responsive design.
Examples of frontend elements include:
- application or page layout
- audio and video elements
- text content
- user interface elements (buttons, links, toolbars, navigation bars, etc.)
- input areas (dialog boxes), form fields, text areas, etc.)
- user flow (how one interface leads to the next)
- user preferences, themes, and customizations
User input is received through the frontend and processed in the backend of a program or website. Backend code reads and writes data and sends output to the user via the frontend. Since the backend and frontend of an app or website work together, software jobs often require both frontend and backend development. Developing for both ends is called full-stack development.
NOTE: Frontend may also be written "front end" (as a noun) or "front-end" (as an adjective). For simplicity, the closed compound word "frontend" has become an acceptable term for both.
Updated: April 18, 2020