What is Front-end Architecture?

Front-end Architecture is a specialization of Software Architecture. It goes beyond low-level coding concerns and takes into consideration multiple criteria, such as internal and external forces, the past & forecasting of technologies, inferences regarding the growth-direction of applications, their alignment with internal and vendors' systems, and more, in order to provide educated and adapted recommendations to front-end development.

An opposing understanding comes from a popular use of the word "architecture", which refers to the structure of the internal pieces of a given application, including the organization of its modules, the tech-stack used, its data-flow, and so forth. That is not necessarily wrong (conceptually). However, academically speaking those responsibilities belong to another area called "System Design", which is an engineering discipline. By using the proper terminology we are free to reserve the word “architecture” for higher-level concerns which are essential for the success of front-end development and front-end products, especially for big organizations and for the long run. Here are some examples of those architectural concerns:

  • Converting Non-functional Requirements into comprehensive technical directives relevant to front-end development;
  • Forecasting of the growth-direction of multiple applications and subsequent recommendations for the adjustments on their System Design;
  • Study of the current status and forecasting of technologies - what is coming and what will be deprecated;
  • Organization of Front-end Shops and definition of technical standards;
  • Documentation and maintenance of Architectural Decision Records (ADR);
  • Creation and optimization of dev-environments;
  • Identification of reusability opportunities across multiple departments;
  • Team composition and management;
  • Strategic representation/communication of architectural decisions to the various stakeholders;
  • Benchmark and R&D to favor continued innovation and increase of competitive advantage;
  • Quality assurance to maximize maintainability and longevity of front-end projects.

This is not a normative list. In fact, these items might change depending on each person and/or organization. The goal here is to exemplify possible concerns related to Front-end Architecture.

In years past, concerns like these were covered by Software Architects. However, the immense range of IT-related knowledge nowadays (Cloud, AI, IoT, AR, VR, Frontend, Backend, Security, DevOps, and so on) has rendered their contributions much less realistic and relevant. Even front-end developers have difficulty keeping up with the intense changes in the field. So while Software Architects and Managers don't have adequate knowledge to give technical recommendations to front-end development, programmers are too busy with their deliverables to monitor the multi-departmental efforts within their companies. Therefore, Front-end Architecture is an essential specialization to permit the strategic direction of front-end development work.

Book - Professional Front-end Architecture

Book - Professional Front-end Architecture

Front-end development has become too big, too important, too complex and too expensive to be treated as a mere sub-part of the web development pipeline. In order to break free from survival mode and move toward “continuous innovation” we need... Read more...


 

Go to Amazon page...

Visit also...

Frontend-architecture.com

A blog to discuss ideas and practices of Front-end Architecture. Have something to say? Become one of our authors!

Proven experience

Techonolgies

  • Specialist in all Frontend related topics
    • React, Angular, Vue, Svelte, Marko, ...
    • AG-Grid, HighCharts, Bootstrap ...
    • Tensorflow, D3JS, Babylon, ThreeJS, ...
    • SASS, BEMCSS, OOCSS, ...
    • Cordova, Electron, Tauri, Neutralino, ...
    • Web Components
    • SSR - Server Side Rendering
    • Browser Performance
    • SEO
  • Backend
    • NodeJS and Python
    • SQL and Non-SQL Databases
    • System Integration
      • API development, testing, monitoring, security
      • Microservices, REST, GraphQL, RPC, Kafka, etc
      • Authentication and Authorization

Management

  • Direct and coordinate Frontend initiatives
  • Convert business directives into strategic architectural plans
  • Translate business requests into techincal actions
  • Lead techincal research into new technologies
  • Contact and maintain good rapport with vendors
  • Conduct Proof of Concepts
  • Coach/train developers in new technologies
  • Perform quality control for code and products
  • Establish and improve Agile efforts
  • Ensure scalability and maintainability of Frontend products
  • Secure Frontend products
  • Design and Coordinate Cloud Infrastructure
  • Direct UX Research and Design
  • Promote and capture strategic ideas
  • Coordinate innovation efforts - from ideation to delivery
  • Knowledge management