@srb-site
WEB-программист

Как избежать чрезмерных зависимостей в коде сложного веб-приложения?

Суть моей проблемы: если нужно написать что-то более сложное, чем отправка формы обратного звонка с лендинга, то заканчивается все монолитом кода с такими зависимостями, что как в анекдоте: "Только ничего не трогай".

Получается говнокод, который изобилует кучей неочевидных связей между html, css, js и php на основе id, классов, параметров функций и т.д. Оно как бы нормально, но, я думаю, не в таком количестве... Как это происходит. В начале работы я очень хочу сделать максимально универсальный и гибкий код. Пишу. Вроде все хорошо. Потом:

1) Например, принимаю данные с формы: собираю их по классам полей через jquery. Делаю это так: в обработчик кнопки отправки передаю this, то есть, получаю из функции доступ к элементу кнопки. Потом через closest получаю саму форму и через find ищу нужные поля. Это единственная технология, к которой я пришел, чтобы не иметь жесткой привязки к id полей...

2) И тут, например, добавляется еще одна форма. Вроде похожая, но немного другая. И получается или новая js-функция (а дальше и php) или внедрение в существующую функцию некоего модификатора. Например условного id формы и внутри разруливание в зависимости от этого модификатора...

3) Дальше больше. Все это переносится в php, нарастает больше и больше и под конец проекта (а он на самом деле весьма маленький и должен делаться гораздо лучше) код выглядит так, что хочется тихонько выделить файлы, нажать delete и начать заново, но КАК?

Кратко: через месяц я сам не могу с ходу разобраться в своем же коде и легко модифицировать его. А как сделать все проще и понятней, я не знаю.

Прошу подсказать хорошую литературу или сайты по проектированию веб-приложений с точки зрения программирования, взаимодействия "клиент-сервер" и баз данных.
  • Вопрос задан
  • 334 просмотра
Решения вопроса 1
alvvi
@alvvi
export default apathy;
На самом деле суть проблемы: вы плохо знаете JS. Сейчас объясню:

1) Например, принимаю данные с формы: собираю их по классам полей через jquery. Делаю это так: в обработчик кнопки отправки передаю this, то есть, получаю из функции доступ к элементу кнопки. Потом через closest получаю саму форму и через find ищу нужные поля. Это единственная технология, к которой я пришел, чтобы не иметь жесткой привязки к id полей...

Ну вот о чем здесь речь? А как же селекторы по аттрибутам (name?), или в конце концов классам? А как же $.fn.serializeArray, которая при наличии элемента формы сама получит все поля и вернет нам содержащий их массив? Да и слушать нужно событие submit, которое диспатчится на самом элементе формы, где уже можно через e.currentTarget (== this в jQuery) получить форму и просто вызывать один метод вместо кучи .find()

И получается или новая js-функция (а дальше и php)

Вынести функцию-хендлер отдельно и сделайте ее универсальной для обеих форм. (при чем тут php ???) Это при условии, что вторая, как вы сказали
Вроде похожая, но немного другая


Все это переносится в php

Не надо переносить фронтенд код в php.
Делайте сборку фронтенда отдельно, php отдельно, нет никакой причины по которой они должны общаться друг с другом, js работает со сгенерированным html. Если вам вдруг нужна переменная с бэкенда, есть куча способов передать ее без переноса фронтенд кода куда-либо.

И отвечая на вопрос из заголовка
Как избежать чрезмерных зависимостей в коде сложного веб-приложения?

Переходите на компонентый подход. Не важно, что это, БЭМ, ES6- и/или CSS- модули, решений множество. Если у вас есть универсальный компонент формы со своими зависимостями, стилями и скриптом, то проблем в коде сложного веб-приложения становится значительно меньше.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
daemonhk
@daemonhk
ПсиХоПат
Все написанное ниже является частью личного опыта автора и не является панацеей, любители похоливарить идут лесом:

1. Приведите себя к единому стандарту разработки. Себя лично, исходя из своего опыта, а не озираясь на всякие Gulp, LESS и прочую хрень, отчасти помогающую в разработке (на самом деле редко).
2. Постарайтесь выделять закономерности в своем коде и его обработке, например, использование одних и тех же классов, структуры верстки. К примеру, для 99% форм у меня есть класс form, которым я оформляю 90% css и делаю ajax именно через этот класс.
3. Для PHP просто называйте поля одинаково из проекта в проект, поможет как для валидации данных, так и вообще для написания единого обработчика, покрывающего 80-90% случаев.
4. Почитайте про KISS, DRY, SOLID, очень помогает поставить мозги на место.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы