Ответ
Граница между Frontend и Backend — это API (Application Programming Interface), которое определяет контракт взаимодействия между клиентской и серверной частями приложения.
Разделение ответственности выглядит следующим образом:
-
Frontend (клиентская часть):
- Отвечает за визуальное представление (UI) и взаимодействие с пользователем (UX).
- Работает в браузере пользователя (HTML, CSS, JavaScript).
- Отправляет запросы к API для получения или изменения данных.
-
Backend (серверная часть):
- Отвечает за бизнес-логику, обработку данных, аутентификацию и авторизацию.
- Взаимодействует с базами данных и другими сервисами.
- Предоставляет данные для Frontend через API, обычно в формате JSON.
Пример взаимодействия через REST API:
1. Backend-код (Python, Flask)
Сервер предоставляет эндпоинт /api/user/1
, который возвращает данные пользователя.
from flask import Flask, jsonify
app = Flask(__name__)
@app.route('/api/user/1')
def get_user():
user_data = {"id": 1, "name": "Alice"}
return jsonify(user_data)
2. Frontend-код (JavaScript) Клиент запрашивает данные с этого эндпоинта и отображает их.
fetch('/api/user/1')
.then(response => response.json())
.then(data => {
console.log(data.name); // Выведет "Alice"
// Здесь код для отображения имени на странице
});
Современные подходы: Фреймворки вроде Next.js или Nuxt.js могут "размывать" эту границу, используя техники вроде Server-Side Rendering (SSR), где часть frontend-кода выполняется на сервере для ускорения первой загрузки страницы.