Архитектра MVC

MVC — это вариант Многоуровневой архитектуры (Layered Architecture), архитектурный паттерн и парадигма, которая делит приложение на 3 основных слоя.

  • Модель (Model). Этот слой управляет всеми данными, логикой и бизнес правилами не зависимо от представления данных. Это сердце и душа MVC приложения. Слово «Модель» иногда вносит путаницу. В архитектуре MVC слой модели — это не одно и то же что модель Laravel.
  • Вид (View). Предоставляет различные представления слоя модели. Предоставляет способ вызывать изменения в состоянии модели.
  • Контроллер (Controller). Организует взаимодействие между слоями. Выполняет действия над моделью для обновления ее состояния. Отправляет сообщения в слой Вид (View) для изменения конкретного представления модели.
Читать далее

GraphQL

На смену web-приложенями, которые генерировали шаблоны на сервере и отправляли в браузер готовый html, а также базировались на концепции MVC пришли frontend фреймворки и отвоевали уже довольно крупную часть рынка. Чтобы получать данные с сервера они использовуют REST API. При активном использовании последнего начали отчетливее вырисовываться его ограничения.

GraphQL — это новый язык запросов для API, разработанный в Facebook. Является более эффективной, мощной и гибкой альтернативой REST. Но по сути это только спецификация (синтаксис), которая может иметь массу реализаций.

Читать далее

Web Workers API

Web Workers API служит для запуска скриптов в фоне. Если нам необходимо запустить в фоне какие-либо вычисления, да еще и в несколько потоков, то это подходящий инструмент для таких целей. Так как работа происходит в фоне, то при этих вычислениях рендеринг страницы не блокируется. Все происходит параллельно.

Читать далее

Flexbox

Flexbox — это более современный способ располагать блоки на странице, чем плавающие блоки (float), созданный именно для этих целей. Не смотря на то, что он не известен так широко, как float, данный подход уже не новый, появился еще в 2011 году. По версии сайта caniuse его поддерживают все современные браузеры.

Читать далее

Docker Compose

Docker Compose — это инструмент, который позволяет запустить несколько контейнеров Docker одной командой. Также он упрощает процессы управления Docker-контейнерами (настройка связей и объемов внутри контейнеров, запуски закрытие).

Читать далее

Webpack

Webpack — это сборщик модулей современных JavaScript приложений (в принципе любых веб приложений, у которых есть JavaScript часть). Когда он обрабатывает ваше приложение, то рекурсивно собирает граф зависимостей, которые требуются каждому модулю вашего приложения. Затем упаковывает все эти модули в небольшое число склеек (bundles), которые и грузятся  в браузер.

Для сборки веб приложений webpack заменит собой grunt, gulp (системы организации задач) и bower (пакетный менеджер клиентской части). Однако, так как у grunt и gulp область применения иная и не ограничивается сборкой, то в ряде случаев webpack можно и нужно встроить в задачи, контролируемые этими системами.

Читать далее

Gulp

Gulp — это тоже система организации задач, такая же как и grunt, но появилась позже него. Gulp так же устанавливается как npm пакет.

Базовые отличия в этих двух системах следующие:

Читать далее

Grunt

Grunt — это система организации рутинных задач, которые делает веб разработчик. Примеры таких задач — минификация кода, компиляция, запуск unit-тестов, линтинг.

Задачи, которые необходимо автоматизировать прописывается командами в специально файле Gruntfile.js. После чего с помощью команды grunt <имя задачи> можно выполнить любую задачу (последовательность команд). Часто используемую задачу (например сборку всех js и css файлов) можно сделать задачей по-умолчанию и запускать просто командой grunt.

Читать далее

Promise

Promise (промисы) — удобный механизм организации асинхронного кода.

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

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

Читать далее

Npm

Npm — это пакетный менеджер Node.js. Файл package.json содержит в себе информацию о зависимостях вашего приложения в части пакетов Node.js. Множество современных инструментов для разработки веб-приложений устанавливаются через данный менеджер пакетов (webpack, grunt, gulp, bower …).

Читать далее