Lecture
You have almost certainly heard the buzzwords "frontend" and "backend" that are so popular in programming, but what is behind them?
Frontend is the client side of the user interface to the software and hardware part of a service.
Backend is the software and hardware part of a service.
Frontend and backend are a variant of software architecture.
The terms appeared in software engineering as a result of the development of the principle of separation of concerns between the external presentation and the internal implementation.
To provide its functionality, the backend implements APIs that the frontend uses. This way, a frontend developer does not need to know the implementation details of the server, and a backend developer does not need to know the frontend implementation.
Frontend is everything that a browser can read, display on screen, and/or run. That is, HTML, CSS, and JavaScript.
HTML (HyperText Markup Language) tells the browser what the content of the page is, for example, "heading", "paragraph", "list", "list item".
CSS (Cascading Style Sheets) tells the browser how to display elements, for example, "a 20-pixel indent after the first paragraph" or "all text in the body element should be dark gray and set in the Verdana font".
JavaScript tells the browser how to react to certain interactions, using a lightweight programming language. Most sites do not actually use much JavaScript, but if you click on something and the page content changes without the screen flashing white, then JavaScript was used somewhere.
Backend is everything that runs on a server, that is, "not in the browser" or "on a computer connected to a network (usually the Internet) that responds to messages from other computers".
For the backend, you can use any tools available on your server (which is essentially just a computer configured to respond to messages). This means you can use any general-purpose programming language: Ruby, PHP, Python, Java, JavaScript / Node, bash. It also means you can use database management systems such as MySQL, PostgreSQL, MongoDB, Cassandra, Redis, Memcached.
Frontend and backend developers have different areas of responsibility and skill sets, but there is some overlap in competencies between them. Here are the main knowledge and skills that frontend and backend developers should have:
Frontend developer:
Backend developer:
In addition, both frontend and backend developers must have good teamwork skills, be able to figure out errors and debug code, and be ready for continuous learning and adaptation to new technologies and requirements in the development industry.
Today there are several main architectures that determine how your backend and frontend will interact.
In this case, HTTP requests are sent directly to the application server, and the server responds with an HTML page.
Between receiving the request and responding, the server typically looks up information in a database based on the request and embeds it into a template (ERB, Blade, EJS, Handlebars).
Once the page is loaded in the browser, HTML defines what will be shown, CSS defines how it will look, and JS handles all sorts of special interactions.
Another type of architecture uses AJAX (Asynchronous JavaScript and XML) for communication. This means that JavaScript loaded in the browser sends an HTTP request (XHR, XML HTTP Request) from within the page and (for historical reasons) receives an XML response. Nowadays the JSON format can also be used for responses.
This means your server must have an endpoint that responds to requests with JSON or XML. Two examples of protocols used for this are REST and SOAP.
AJAX lets you load data without refreshing the page. This is used most in frameworks such as Angular and Ember. After being built, such applications are sent to the browser, and any subsequent rendering is done on the client side (in the browser).
Such a frontend communicates with the backend over HTTP, using JSON or XML responses.
Some libraries and frameworks, such as React and Ember, let you run applications both on the server and on the client.
In this case, the application uses both AJAX and server-rendered HTML to connect the frontend with the backend.
The web applications you are going to build will require a network connection less and less.
Progressive web apps load only once and work (almost) always. You can store a database in the browser. In some cases, your applications need a backend only on first load, and after that only to synchronize / secure data. This level of persistence means that most of the application logic lives directly in the client.
The backend, in turn, is getting lighter and lighter. Technologies such as document stores and graph databases reduce the number of calls to the backend to re-aggregate data. The client's job is to specify which data it needs (graph databases) or to fetch all the various pieces of data it needs (REST API).
It is now possible to build backend services that do not run all the time but only when they are needed, thanks to serverless architectures such as AWS Lambda.
Computational tasks can now be moved between the frontend and the backend. Depending on the kind of application, you can have the computation done either on the client or on the server.
Each option has its pros and cons. The server is a more stable environment with fewer unknowns, but it always requires a network connection. Some users run the latest browser versions, and they benefit from client-side applications, which do most of the work and can boast a beautiful interface, but then you will alienate users who do not use the newest browsers and high-speed Internet connections.
In any case, it is good that there is something to choose from. The main thing is to choose exactly what suits the specific task best. I hope you have gained a better understanding of the state of web development today.
Frontend and backend each have their own technologies and programming languages, and to work with them you need to be proficient in those languages. If a programmer is well versed in both areas and easily handles tasks related to both frontend and backend, that programmer is called a full-stack developer.
So a full-stack programmer is a generalist specialist who can lay out a site's design, set up how forms and buttons work, write the server side, and even configure the server itself. Such a programmer creates a web service single-handedly, replacing 3-4 narrower specialists. On the other hand, such a developer may lack deep knowledge of particular technologies, especially if they have little overall work experience
for frontend, backend, and DevOps.


the frontend developer's path:

And here is the backend:

Third-party APIs of payment systems such as PayPal, Privat24, Sberbank, Blockchain.com, of search engines, mapping services, SMS and email notification managers, and data analytics such as Google Analytics, Yandex Metrica, etc.
Third-party vendor libraries such as ElasticSearch,
The DevOps roadmap is a branch off the backend:

Of course, these are just tools. A web developer needs other development skills besides mastery of the tools described above.
Comments