Автоматизация разработки

Тема 4. Автоматизация разработки

Учебные вопросы темы:

Фреймворки и CMS.
Frontend и Backend.
Многоуровневая модель.

Вопрос 1. Фреймворки и CMS.

В данном разделе мы попробуем разобраться чем фреймворки отличаются от CMS. Посмотрим их преимущества и недостатки.

Фреймворк от английского слова «каркас» – это надстройка над языком, набор библиотек. Хорошо отлаженных и прекрасно взаимодействующих между собой библиотек. Основные исторические моменты можно представить тезисно:

- Концепция разработана в 1979 году для языка Smalltalk by Christopher Alexander.
- Adapted to OO Programming by Beck and Cunningham (1987).
- Popularity in CS after the book: “Design Patterns: Elements of Re- useable Object-oriented software”, 1994. Erich Gamma, Richard Helm, Ralph Johnson, John Vlissides.

Сейчас шаблоны проектирования широко используются в разработке коммерческих приложений.

CMS(ЦМС) – это уже готовый сайт, который нужно донастроить под свои нужды.

Поверхностным взглядом можно заключить, что фреймворк – это набор библиотек, а CMS – это уже сайт. Тем не менее, это не совсем так.

CMS значительно ускоряет разработку простого шаблонного сайта. У сайта сразу готова админка и её не надо писать отдельно, в отличии от разработки на фреймворке. Тем не менее, скорость создания сайта достигается за счёт шаблонности, ограниченности или излишней универсальности CMS.

При желании расширить функционал, добавить что-то экстраординарное вы будете вынуждены идти на компромиссы. В случае с фреймворком, таких проблем нет.

В фреймворках зачастую только самые необходимые функции и хороший, отлаженный код.

Ведя разработку с помощью фреймворка, Вы выстраиваете взаимодействие пользователя с функциями и данными и принимаете решение как это будет выводиться в браузер. В CMS это всё уже сделано. Вероятно, это и неплохо, ведь если у разработчика недостаточно опыта, то с фреймворком или чистым языком можно наворотить такого, что в итоге CMS окажется очень хорошим вариантом.

Используя CMS, мы привязываемся к структуре, созданной разработчиками, но в шаблонных решениях экономим время, а в нешаблонных, зачастую, прозябаем на форумах в поисках ответов на «как так».

Плюсы CMS

- Скорость. Шаблонное решение можно создать очень быстро.
- Готовая админка. На многих популярных CMS достаточно удобная и понятная админка.
- Простота разработки. По большому счёту, чтобы создать простецкий сайт и навыками программирования и вёрстки обладать не обязательно.

Минусы CMS

- Ограниченный функционал. Шаг влево, шаг вправо карается расстрелом. Функционал допилить возможно всегда, но, вероятно, это будет просто межгалактический костыль.
- Избыточность. В погоне за универсальностью, разработчики CMS, чтобы угодить всем, закладывают столько функций, что скорее всего для одного проекта всё это не нужно.
- Сложное ядро. Порой, чтобы чуть поправить или видоизменить какую-то часть сайта, приходится разбираться с устройством системы.
- Сайт на CMS всегда уступает в производительности хорошо написанному сайту на фреймворке.

Плюсы фреймворка

- Гибкость.Можно реализовать любую задумку без «войны» с движком.
- Производительность. Повторю: сайт на CMS всегда уступает в производительности хорошо написанному сайту на фреймворке.

Минусы фреймворка

- Сложность разработки.
- Отсутствие административной части. Раздел редактирования сайта нужно писать самому.
- Время. Разработка занимает больше времени, чем разработка с помощью CMS.Минусы решаются использованием ранее написанного кода.

Когда лучше подойдёт CMS

- Шаблонное решение, которое покрывается возможностями CMS.
- Для клиентов с небольшими бюджетами.

Когда лучше использовать фреймворк

- Нетиповой нешаблонный проект.
- Активно изменяющийся или подстраивающийся под тренды проект Достаточно опыта, чтобы написать качественно на фреймворке.

Вопрос 2. Frontend и Backend.

В момент разработки сайта или веб-приложения у нас возникают следующие проблемы:

- Нужно изменить внешний вид без изменения логики (ядра приложения).
- Нужно представлять данные в различном контексте.
- Нужно взаимодействовать с данными из различного контекста (т.е. touch экран планшета или клавиатура компьютера).
- Нужно иметь несколько представлений для одних и тех же данных. Для их успешного решения было решено отделить ядро функциональности от представления и логику правления, использующую эту функциональность. Позволить нескольким представлениям разделять одни и те же данные.Сделать подожку нескольких клиентов (клиентских частей приложения, представлений) проще

Frontend — это разработка пользовательского интерфейса и функциональности, которые работают на клиентской стороне веб-сайта или приложения. К этому виду разработки можно отнести все, что видит пользователь, открывая web-страницу. Frontend-разработчик сотрудничает с дизайнерами, программистами и UX-аналитиками, чтобы создавать удобный и востребованный продукт.

Чтобы наглядно понять, что такое frontend-разработка, откройте страницу любого сайта — перед собой вы увидите интерфейс. Щелкнув правой кнопкой мыши, можно посмотреть код этой страницы в браузере.

Данный код — это и есть пример работы frontend-разработчика, он скачивается в браузер пользователя, и его можно увидеть своими глазами. Код страницы описывает все, что вы видите перед собой: цвета, верстку, шрифты, расположение графических элементов и так далее.

Рис. 1. Из чего состоит сайт

К frontend-разработке относятся:

HTML — язык разметки документов, при помощи которого формируется структура страницы: заголовки, абзацы, списки и так далее.
CSS — язык для описания и стилизации внешнего вида документа. Благодаря CSS-коду ваш браузер понимает, как именно отображать элементы.
JavaScript — это язык, который создавался для того, чтобы оживить веб-страницы. Его задача — реагировать на действия пользователя, обрабатывать клики мышкой, перемещения курсора, нажатия клавиш.

К backend-разработке относится:

Backend-разработка — это набор аппаратно-программных средств, при помощи которых реализуется логика работы сайта. Попросту говоря, это то, что скрыто от глаз пользователя и происходит вне его браузера и компьютера.

Например, когда вы вводите запрос на странице поисковика и жмете клавишу Enter, frontend заканчивается и начинается backend. Ваш запрос отправляется на сервер Google или Яндекса, где расположены алгоритмы поиска. Именно там случается все «волшебство». Как только на мониторе появилась информация, которую вы искали, — вновь происходит возвращение в зону frontend.

Также для backend-разработки используются разные системы управления базами данных:

MySQL;
PostgreSQL;
SQLite;
MongoDB.В зависимости от вида конечного продукта в обязанности backend- разработчика могут сильно меняться. Такой специалист может создавать и интегрировать базы данных, обеспечивать безопасность, создавать технологии резервного копирования и восстановления

Вопрос 3. Взаимодействие frontend и backend.

Взаимодействие frontend и backend выглядит так: frontend отправляет пользовательскую информацию в backend, там она обрабатывается и возвращается обратно, приняв понятную форму.

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

Рис. 2. Многоуровневая концепция реализации приложений

Существует несколько вариантов взаимодействия frontend и backend:

HTTP-запрос напрямую отправляется на сервер, сервер ищет информацию, встраивает ее в шаблон и возвращает в виде HTML- страницы.
Вариант с использованием инструментария AJAX (Asynchronous JavaScript and XML). В этом случае запрос отправляет JavaScript, загруженный в браузер, а ответ приходит в формате XML или JSON.
Одностраничные приложения, которые загружают данные без обновления страницы. Это делается также при помощи AJAX или фреймворков Angular и Ember.
Ember или библиотека React помогают использовать приложение и на сервере, и в клиенте. Frontend и backend взаимодействуют через AJAX и HTML-код, который обрабатывается на сервере.Как мы видим, современная разработка — это сложный и многоуровневый процесс, который делится на две части: клиентскую и серверную.Для адекватной работы такого сложного приложения разработаны многоуровневые архитектуры. На данный момент наибольшее распространение получила трехуровневая модель:
Уровень представления (Статический или динамически сгенерированный контент отображаемый через браузер).
Уровень логики (подготовка данных для динамически генерируемого контента, уровень сервера приложений (JavaEE, ASP.NET, PHP, ColdFusion).
Уровень данных (база данных включающая в себя данные и СУБД).

Уровень представления:

Предоставляет графический интерфейс.
Обрабатывает пользовательские события.
Иногда называют GUI или client view of front-end.

Уровень логики:

Набор правил для работы с данными.
Может обрабатывать запросы нескольких пользователей.
Иногда называют middleware или back-end.
Не должен содержать пользовательских форм или непосредственно обращаться к данным.

Уровень данных:

Физическое хранилище для данных (persistence).
Управляет доступом к БД или файловой системе.
Иногда называется back-end.
Не должен содержать пользовательских форм или бизнес логики.

Вопросы для самопроверки:

1. Сколько уровней в традиционной модели веб-приложения:
  - Три.
  - Два.
  - Четыре.
  - Один.
2. Набор правил для работы с данными находится на … уровне архитектуры приложения
  - Уровне логики.
  - Уровне представления.
  - Уровне данных.
  - Уровне правил.
3. К backend относится:
  - Сервер.
  - HTML.
  - СSS.
  - Веб-дизайн.
4. К frontend относится:
  - CSS.
  - Сервер.
  - Формы.
  - Данные.
5. К минусам Frontend не относится:
  - Гибкость.
  - Сложность разработки.
  - Отсутствие административной части. Раздел редактирования сайта нужно писать самому.
  - Время. Разработка занимает больше времени, чем разработка с помощью CMS.

Статьи

Конспект

WebRazrab

Ваш помощник в обучении

Курс Web-разработка