Принципы проектирования SOLID в #Angular (Расширенный, 2021)

• Дмитрий Маженски рассказывает о принципах проектирования SOLID в контексте Angular.  

• Видео вдохновлено комментарием и направлено на помощь в применении принципов в реальном коде.  

• Видео разделено на пять частей с временными кодами в описании.  

• Принципы проектирования - это рекомендации по созданию удобного и гибкого кода.  

• Принципы абстрактны и могут быть реализованы множеством способов.  

• Существуют шаблоны проектирования, которые решают конкретные случаи использования.  

• Принцип гласит, что класс должен выполнять только одну задачу.  

• Пример: виджет погоды, который экспортирует данные в JSON.  

• В проекте есть пять ветвей, соответствующих принципам проектирования.  

• Компонент приложения содержит слишком много функций.  

• Решение: выделить виджет в отдельный компонент.  

• Создание компонента виджета и перенос логики в него.  

• Компонент приложения теперь отвечает только за рендеринг содержимого и панели инструментов.  

• Компонент виджета генерирует макет и экспортирует данные.  

• Логика экспорта JSON переносится в отдельную службу.  

• Принцип гласит, что объекты должны быть открыты для расширения, но закрыты для модификации.  

• Пример: два виджета с разным содержимым, которые не могут быть изменены.  

• Решение: создание отдельных компонентов для каждого виджета и использование проекции содержимого.  

• Использование тега виджета приложения для отображения контента.  

• Возможность реализации с выходами компонентов и контейнером ng.  

• Создание файла CSS для общих стилей и виджета погоды.  

• Переименование контейнера в содержимое виджета.  

• Импорт CSS-контента для виджета.  

• Возможность выбора контента для виджета приложения.  

• Возможность добавления нового контента без изменения виджета.  

• Принцип замещения Лисков: замена объектов базового класса на объекты производных классов без нарушения работы приложения.  

• Создание базового класса widget base для переноса логики.  

• Импорт исходных данных и украшение директивой.  

• Нарушение принципа замещения при переопределении метода export json.  

• Создание интерфейсов для контента виджета.  

• Поддержка загрузки в реальном времени и функция reload.  

• Разделение интерфейса на два: с возможностью перезагрузки и без.  

• Использование абстракций вместо конкретизаций.  

• Пример с внедрением службы опроса в конструктор.  

• Создание абстракций поверх абстракций для управления зависимостями.  

• Зависимость от конкретного контента, например, погоды, нарушает принцип инверсии зависимостей.  

• Необходимо создать абстракцию для повторного использования контента.  

• Создается токен инъекции для контента, который поддерживает механизм опроса и перезагрузки.  

• Токен должен поддерживать метод reload и свойство loading.  

• Используется внедрение зависимостей для предоставления экземпляра компонента.  

• Компонент погодного контента реализуется через токен.  

• Уровень абстракции представлен токеном, который заменяет конкретную реализацию.  

• Компонент или директива зависят только от метода и свойств интерфейса.  

• Перезагрузка происходит в холодных режимах для компонента погоды.  

• Видео объясняет принципы SOLID в Angular.  

• Упоминаются курсы по тематизации материалов Angular и движку GraphQL Hasura.  

• Призыв подписаться на канал и оставить отзыв.