Итоги и практика
Ключевые выводы
- Каждое приложение — это четыре части: (что видят пользователи), (правила и логика), база данных (где данные сохраняются) и хостинг (где всё это работает). Frontend никогда не касается базы данных напрямую — он идёт через backend.
- В браузере HTML — это структура, CSS — это стиль, а JavaScript — это поведение; код меняет страницу, меняя DOM.
- Вы не пишете всё сами — пакеты (управляемые npm через
package.jsonи ) поставляют решённые задачи как зависимости. - Переменные окружения держат секреты вне кода и позволяют одному и тому же коду вести себя правильно в dev и prod.
- Запрос проходит frontend → хостинг → backend → база данных и обратно; назвать слой, в котором живёт проблема, — это половина её решения.
Попробуйте сами
Возьмите приложение, которым пользуетесь ежедневно, и проговорите вслух одно действие через слои: «Я нажимаю отправить (frontend) → это идёт на их сервер (backend) → который проверяет, что мне можно, и сохраняет сообщение (база данных) → и чат обновляется (frontend)». Затем угадайте, в каком слое живёт каждая проблема: кнопка выглядит криво; приложение говорит «вы не вошли в систему»; вчерашнее сообщение пропало. Умение хорошо это называть — это навык, на котором строится остальная часть книги.
Промпт главы
Я учусь, как приложения складываются вместе. Вот функция, которую я хочу:
<одно предложение с описанием того, что пользователь должен мочь делать>
Прежде чем писать любой код, разбери её для меня по слоям:
- Frontend: что видит пользователь и что отправляется
- Backend: какие правила/проверки должны выполниться и где
- База данных: какие данные нужно хранить или читать
- Любые env vars или конфиг (особенно секреты), которые задействованы
Затем опиши поток запроса от нажатия до результата в пронумерованных шагах.
Держи это на простом языке — я хочу понять форму до кода.