Key components of an app
Anatomy of an application and differences between frontend and backend
Creating either a mobile or web application takes lots of moving parts, and the way these moving parts work together is often hard to picture. The application architecture is a “skeleton” or layout that outlines its key external and internal components, the interaction and relationship between those app components, like user interfaces, application servers, and databases.
For example, once a user opens a webpage, the web or application server sends specific data to the browser to respond to the user’s request. To be precise, a web client (or user agent) may request web resources or more commonly-known web documents (HTML, JSON, etc.) through a web or application server. Then, the requested information appears, and the interaction between a user and a website starts.
As part of application architecture, there will be both frontend and backend services. Frontend development is concerned with the user experience of the app. In contrast, backend development focuses on providing access to the data, services, and other existing systems that make the app work. In short, the frontend is what the user interacts with (e.g., mobile app or web page), and the backend is the blackbox, which the users do not see, does all the heavy lifting of managing data and processing user requests.
While creating an app, several different decisions need to be made, which adds additional complexity to the whole development process. To name a few, the following key decisions need to be made;
  • Programming language(s) that will be used for frontend and backend development
  • Technologies and/or frameworks that will be used for database, application server, web server, UI, caching, message queue, scheduler, etc.
  • Deployment technologies and cloud provider selection
  • Automation tools to use speed up application maintenance and deployment
  • Code repository, versioning, and testing tools selection
  • Application performance monitoring and management tools selection
Copy link