Фронтенд vs бэкенд: что это?

👋 Привет!

Сегодня мы разберем, как устроены сайты и приложения. Представь, что ты заказываешь пиццу. Ты видишь меню, кнопки и красивый интерфейс — это фронтенд. А вот кухня, где готовят пиццу, и курьеры, которые её везут — это бэкенд. Давай разбираться подробнее!

📌 Что мы будем изучать в этом модуле?

Ты узнаешь:
- Как сайты и приложения «общаются» с серверами.
- Почему, например, Telegram на телефоне и компьютере показывает одни и те же сообщения.
- Как находить баги не только в кнопках, но и в «скрытой» логике приложений.

Зачем это тестировщику?

- Чтобы понимать, где искать ошибку: в интерфейсе или «внутри» системы.
- Чтобы говорить с разработчиками на одном языке: «Сервер возвращает 500 ошибку при отправке формы» звучит круче, чем «Что-то не работает».

🍕 Фронтенд: меню и кнопки для заказа

Фронтенд — это всё, что ты видишь и трогаешь:
- Сайт в браузере (например, страница ВКонтакте).
- Мобильное приложение (Instagram, YouTube).
- Кнопки, формы, анимации, цвета.

Пример. Когда ты заказываешь пиццу через приложение:
- Выбираешь размер и начинку (фронтенд).
- Видишь счет и адрес доставки (фронтенд).
- Нажимаешь «Заказать» (фронтенд отправляет запрос бэкенду).

Аналогия:
Фронтенд — это меню в ресторане. Ты выбираешь блюда, но не видишь, как их готовят.

🔥 Бэкенд: кухня и логистика

Бэкенд — это всё, что скрыто:
- Серверы, которые обрабатывают запросы.
- Базы данных, где хранятся твои сообщения, фото, заказы.
- Логика: «Если пользователь ввел неправильный пароль — не пускать!».

Пример. Когда ты нажимаешь «Заказать»:
- Бэкенд получает запрос: «Пользователь №123 заказал пепперони».
- Проверяет, хватает ли денег на счету.
- Отправляет заказ на кухню и вызывает курьера.

Аналогия:
Бэкенд — это кухня и офис доставки. Ты не видишь, как повара готовят пиццу или как курьер прокладывает маршрут, но без этого заказ не придет.

📱 Пример: VK или Telegram

У соцсети VK или мессенджера Telegram:

Фронтенд:
- Веб-версия на компьютере.
- Приложение на смартфоне.
-Умные часы с уведомлениями.

Бэкенд:
- Единый сервер, который:
- Хранит все твои сообщения и фото.
- Проверяет пароли.
- Отправляет уведомления на все устройства.

Почему это удобно?
Если ты написал сообщение в VK с телефона, оно сразу появится и на компьютере — потому что бэкенд один!

🔍 Как это связано с тестированием?

Допустим, в Telegram не отправляются голосовые сообщения. Где искать проблему?

Фронтенд:
- Проверить микрофон в приложении.
- Убедиться, что кнопка «Запись» работает.

Бэкенд:
- Посмотреть, принимает ли сервер аудиофайлы.
- Проверить, нет ли ошибок в базе данных.

Совет:
Если голосовые сообщения не отправляются только на Android, но работают на iOS — проблема, скорее всего, во фронтенде.

🎯 Почему это важно?

- Экономия времени: Не будешь тестировать кнопки, если баг в сервере.
- Четкие отчеты: Сможешь написать разработчику: «POST /api/messages возвращает 403 ошибку» вместо «Чёй-то не отправляется».
- Уверенность на собеседовании: Знание основ — must have для QA.

🔥 Практика:

- Открой VK или любой сайт.
- Найди 3 элемента фронтенда: кнопку, поле ввода, меню.
- Придумай, что могло сломаться в бэкенде, если они не работают.

Пример:

Не загружается аватарка → Возможно, бэкенд не сохраняет фото в базу данных.
Не загружается аватарка → Возможно, на фронте при нажатие на кнопку "Сохранить" фронтенд разработчик забыл написать логику отправки запроса на сервер.

🌟 Запомни:
Фронтенд и бэкенд работают вместе, как шеф-повар и официант в ресторане. Понимая их роли, ты будешь находить баги быстрее и точнее!

P.S. Если что-то кажется сложным — не переживай. В следующих уроках мы разберем, как фронтенд и бэкенд общаются через API. Ты на правильном пути! 💪