Model-View-Controller (MVC) — это архитектурный шаблон, разделяющий приложение на три основных компонента: модель, представление и контроллер. Каждый из этих компонентов создан для обработки конкретных аспектов разработки приложения. MVC — одна из наиболее часто используемых стандартных отраслевых сред веб-разработки для создания масштабируемых и расширяемых проектов.

Давайте обсудим три основных логических компонента немного подробнее:

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

2. Просмотр:

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

3. Контроллер:

  • получает пользовательский ввод и инициирует ответ, вызывая объекты модели.
  • Контроллер принимает ввод от пользователя и указывает модели и области просмотра выполнять действия на основе этого ввода.

Краткое введение в стек MERN

Стек MERN — это стек JavaScript, который используется для более простого и быстрого развертывания полнофункциональных веб-приложений.

Стек MERN состоит из следующих технологий:

  • MongoDB: база данных с открытым исходным кодом на основе документов.
  • Express: платформа веб-приложений для Node.js.
  • React: интерфейсная библиотека JavaScript для создания пользовательских интерфейсов.
  • Node.js: среда выполнения JavaScript, которая выполняет код JavaScript вне браузера (например, на сервере).

Также часто используется Mongoose — простое решение на основе схемы для моделирования данных приложения.

MVC и MERN

MERN не является MVC-фреймворком в традиционном смысле, потому что он охватывает как сервер, так и браузер. MVC также можно реализовать, придерживаясь шаблонов на стороне сервера в Node и просто отправляя HTML-код в браузер и рассматривая браузер как уровень представления, то есть делая вещи так, как всегда и всегда.

Хотя, когда React сочетается с бэкендом javascript, то это MVC. React служит «V» в MVC.

  • Модели Mongoose’ определяют часть данных. Здесь мы будем хранить все важные данные, необходимые для работы нашего приложения.
  • Express & Node.js выполняет все функциональное программирование и будет использоваться для написания уровня бизнес-логики (контроллера). Этот уровень представляет собой сервер приложений, который будет выступать в качестве связующего звена между клиентом и базой данных. Этот уровень будет обслуживать компоненты React на устройстве пользователя, принимать HTTP-запросы от пользователя и давать соответствующий ответ.
  • React служит «V» в MVC. Наш клиентский уровень (представление) будет написан на JavaScript, HTML и CSS с использованием ReactJS в качестве основы. Этот уровень архитектуры — это то, с чем пользователь будет взаимодействовать, чтобы получить доступ к функциям нашего приложения.

На этом мы подошли к концу этой статьи. в этой статье мы обсудили, как традиционная архитектура MVC реализована в очень популярном стеке MERN.

Спасибо, что прочитали!