{"id":453202,"date":"2025-03-25T03:01:25","date_gmt":"2025-03-25T03:01:25","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=453202"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=453202","title":{"rendered":"UI\/UX: \u0423\u0447\u0438\u043c\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 MVC<\/span>"},"content":{"rendered":"
<\/div>\n
\n
\n
\n
\n
\"\u0412\u0435\u0441\u044c<\/p>\n
\u0412\u0435\u0441\u044c UI — \u044d\u0442\u043e \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044f MVC<\/figcaption><\/div>\n<\/figure>\n

\u0412 1972 \u0433\u043e\u0434\u0443 \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u044f Xerox PARC \u043f\u0435\u0440\u0432\u043e\u0439 \u0432 \u043c\u0438\u0440\u0435 \u0438\u0437\u043e\u0431\u0440\u0435\u043b\u0430 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u044b \u0441 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c (GUI). \u0414\u043e \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u043c\u0435\u043d\u0442\u0430 \u0432\u0441\u0435 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u043b\u0438\u0441\u044c \u0447\u0435\u0440\u0435\u0437 \u043f\u0435\u0440\u0444\u043e\u043a\u0430\u0440\u0442\u044b \u0438\u043b\u0438 \u043a\u043e\u043d\u0441\u043e\u043b\u044c. \u042d\u0442\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u043e\u0440\u044b\u0432\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0435\u0442\u0435\u043d\u0438\u0435. \u0412\u0441\u0451 \u043e\u0441\u0442\u0430\u0432\u0448\u0435\u0435\u0441\u044f \u0434\u0435\u0441\u044f\u0442\u0438\u043b\u0435\u0442\u0438\u0435 \u0438\u043d\u0436\u0435\u043d\u0435\u0440\u044b \u043b\u0430\u0431\u043e\u0440\u0430\u0442\u043e\u0440\u0438\u0438 \u043f\u043e\u0442\u0440\u0430\u0442\u0438\u043b\u0438 \u043d\u0430 \u0435\u0433\u043e \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435. \u0418\u043c\u0435\u043d\u043d\u043e \u043e\u043d\u0438 \u0438\u0437\u043e\u0431\u0440\u0435\u043b\u0438 \u043f\u0435\u0440\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u043d\u044b\u0435 \u043c\u044b\u0448\u0438 \u0438 \u044f\u0437\u044b\u043a SmallTalk<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043b\u043e\u0436\u0438\u043b \u043e\u0441\u043d\u043e\u0432\u0443 \u041e\u041e\u041f. \u0412 ~1987 \u0433\u043e\u0434\u0443 Trygve Reenskaug \u0441\u043e\u0437\u0434\u0430\u0451\u0442 \u043f\u0430\u0442\u0442\u0435\u0440\u043d MVC \u0434\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 GUI. \u0418\u043c\u0435\u043d\u043d\u043e \u044d\u0442\u043e\u0442 \u043f\u0430\u0442\u0442\u0435\u0440\u043d \u043f\u043e \u043f\u0440\u0430\u0432\u0443 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0432\u044b\u043c \u0432 \u043c\u0438\u0440\u0435 \u0448\u0430\u0431\u043b\u043e\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n

MVC \u0437\u0430\u0434\u0443\u043c\u044b\u0432\u0430\u043b\u0441\u044f \u043a\u0430\u043a \u0441\u043f\u043e\u0441\u043e\u0431 \u0443\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u043a\u043e\u0434\u0430 \u0432 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430\u0445. \u041e\u043d \u0440\u0430\u0437\u0434\u0435\u043b\u044f\u043b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u0442\u0440\u0438 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438: Model<\/code>, View<\/code> \u0438 Controller<\/code>. Model<\/code> \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u043b\u0430 \u0438\u0437 \u0441\u0435\u0431\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0443\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u043b\u0430\u0441\u044c \u0432 \u0433\u043e\u043b\u043e\u0432\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. View<\/code> \u044f\u0432\u043b\u044f\u043b\u043e\u0441\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u044d\u0442\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435. \u0410 Controller<\/code> \u0431\u044b\u043b \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u043c\u0435\u0442\u043e\u0434\u043e\u0432, \u0447\u0435\u0440\u0435\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043c\u043e\u0433 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u043c\u043e\u0434\u0435\u043b\u044f\u043c\u0438 \u0438 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043e\u0439 \u0432 \u0446\u0435\u043b\u043e\u043c.<\/p>\n

\u0418\u0434\u0435\u0438 MVC \u043d\u0435 \u0438\u043c\u0435\u043b\u0438 \u043d\u0438\u0447\u0435\u0433\u043e \u043e\u0431\u0449\u0435\u0433\u043e \u0441 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043e\u0439 \u0432\u0441\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041a\u0430\u0436\u0434\u044b\u0439 MVC \u0431\u044b\u043b \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u043c, \u0438 \u043e\u0442\u0432\u0435\u0447\u0430\u043b \u0437\u0430 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435: \u043a\u043d\u043e\u043f\u043a\u0443, \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0435 \u043c\u0435\u043d\u044e, input \u0444\u043e\u0440\u043c\u044b. \u041a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e \u0438\u0441\u0442\u0438\u043d\u043d\u0430\u044f \u0446\u0435\u043d\u043d\u043e\u0441\u0442\u044c MVC \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u043f\u043e\u0442\u0435\u0440\u044f\u043b\u0430\u0441\u044c. \u0421\u0435\u0439\u0447\u0430\u0441 \u044d\u0442\u043e\u0442 \u043f\u0430\u0442\u0442\u0435\u0440\u043d \u0431\u043e\u043b\u044c\u0448\u0435 \u0438\u0437\u0432\u0435\u0441\u0442\u0435\u043d \u043a\u0430\u043a \u0441\u043f\u043e\u0441\u043e\u0431 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0444\u0430\u0439\u043b\u044b \u0432 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0445 web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445. \u0421 \u0447\u0435\u043c \u043e\u043d, \u043f\u043e \u043c\u043e\u0435\u043c\u0443 \u043c\u043d\u0435\u043d\u0438\u044e, \u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u043b\u043e\u0445\u043e.<\/p>\n

\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u043e \u0442\u043e\u043c, \u0441 \u0447\u0435\u043c MVC \u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0445\u043e\u0440\u043e\u0448\u043e; \u043e\u0431 \u0438\u0434\u0435\u044f\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u044b\u043b\u0438 \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u044b \u0432 \u043d\u0435\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u0435\u043b\u0435\u043c. \u041c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a MVC \u0443\u043b\u0443\u0447\u0448\u0438\u0442 UI \u0438 UX \u0432\u0430\u0448\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u0441\u0434\u0435\u043b\u0430\u0432 \u0438\u0445 \u043f\u043e\u043d\u044f\u0442\u043d\u0435\u0435 \u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u0435\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439. \u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u043a\u043e\u0434\u0430 \u043f\u043e \u044d\u0442\u043e\u043c\u0443 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0443, \u0447\u0442\u043e\u0431\u044b \u0432\u044b \u0441\u043c\u043e\u0433\u043b\u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u044d\u0442\u0438 \u0437\u043d\u0430\u043d\u0438\u044f \u0432 \u0441\u0432\u043e\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u0435. \u0410 \u0442\u0430\u043a \u0436\u0435 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u0439 \u044d\u0442\u043e\u0433\u043e \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0443\u043b\u0443\u0447\u0448\u0430\u044e\u0442 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0438 \u0443\u0441\u043a\u043e\u0440\u044f\u044e\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443.<\/p>\n

\"\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f<\/p>\n
\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f MVC<\/figcaption><\/div>\n<\/figure>\n

\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 MVC<\/h3>\n

\u041d\u0430 \u0434\u0432\u043e\u0440\u0435 1970-\u044b\u0435 \u0433\u043e\u0434\u0430. \u041f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0441\u0442\u044b \u0432\u0441\u044e \u0436\u0438\u0437\u043d\u0438 \u0432\u0432\u043e\u0434\u0438\u043b\u0438 \u0432 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440 \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 \u043f\u0435\u0440\u0444\u043e\u043a\u0430\u0440\u0442\u044b \u0438\u043b\u0438 \u0447\u0435\u0440\u0435\u0437 \u043a\u043e\u043d\u0441\u043e\u043b\u044c. \u0414\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0431\u044b\u043b\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u043c\u0430\u043d\u0434\u0443 \u043d\u0430 \u043f\u043e\u043d\u044f\u0442\u043d\u043e\u043c \u044f\u0437\u044b\u043a\u0435 \u0438 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440 \u0432\u0441\u0451 \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0441\u0430\u043c. \u0410 \u0442\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u0447\u0430\u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f «\u043a\u0430\u043a\u0438\u0435-\u0442\u043e GUI», \u0433\u0434\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0442\u043e\u0433\u043e \u0436\u0435 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u043b\u043e\u0441\u044c \u0432\u043e\u0434\u0438\u0442\u044c \u043f\u043e \u0441\u0442\u043e\u043b\u0443 \u043a\u0430\u043a\u043e\u0439-\u0442\u043e \u043a\u043e\u0440\u043e\u0431\u043e\u0447\u043a\u043e\u0439 \u0438 \u043d\u0430\u0436\u0438\u043c\u0430\u0442\u044c \u043a\u0443\u0440\u0441\u043e\u0440\u043e\u043c \u043d\u0430 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0438.<\/p>\n

\u0420\u0430\u043d\u044c\u0448\u0435 \u043d\u0438\u043a\u0442\u043e \u0441 \u0442\u0430\u043a\u0438\u043c\u0438 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f\u043c\u0438 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u043b. \u041d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c GUI \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u0435\u0435 \u0438 \u043f\u043e\u043d\u044f\u0442\u043d\u0435\u0435. \u0418 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u0438\u0437 PARC \u043e\u0431\u0440\u0430\u0442\u0438\u043b\u0438\u0441\u044c \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u0431\u044b \u043d\u0430\u0437\u0432\u0430\u043b\u0438 \u0438\u043c\u043c\u0435\u0440\u0441\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u044e \u0438\u043b\u0438 \u0441\u043a\u0435\u0432\u043e\u043c\u043e\u0440\u0444\u0438\u0437\u043c\u043e\u043c (\u043f\u0435\u0440\u0432\u043e\u0435 \u0431\u043e\u043b\u044c\u0448\u0435 \u043f\u0440\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435, \u0430 \u0432\u0442\u043e\u0440\u043e\u0435 \u043f\u0440\u043e \u0432\u043d\u0435\u0448\u043d\u0438\u0439 \u0432\u0438\u0434).<\/p>\n

\u0418\u0434\u0435\u044f \u0431\u044b\u043b\u0430 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u0435 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0432 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u043f\u043e \u0441\u0432\u043e\u0435\u043c\u0443 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044e \u0438 \u0432\u043d\u0435\u0448\u043d\u0435\u043c\u0443 \u0432\u0438\u0434\u0443 \u043f\u043e\u0445\u043e\u0436\u0438\u0435 \u043d\u0430 \u043c\u043e\u0434\u0435\u043b\u0438 \u0438\u0437 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430. \u0415\u0441\u043b\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u043a\u043d\u043e\u043f\u043a\u0430, \u0442\u043e \u043e\u043d\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043a\u0430\u043a \u043a\u043d\u043e\u043f\u043a\u0430 \u0438 \u043d\u0430\u0436\u0438\u043c\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u043a\u043d\u043e\u043f\u043a\u0430. \u0415\u0441\u043b\u0438 \u044d\u0442\u043e \u0444\u043e\u0440\u043c\u0430 \u0441 \u043f\u043e\u043b\u044f\u043c\u0438, \u0442\u043e \u043f\u0443\u0441\u0442\u044c \u043e\u043d\u0430 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043a\u0430\u043a \u0431\u043b\u0430\u043d\u043a \u0441 \u043f\u0440\u043e\u043f\u0443\u0441\u043a\u0430\u043c\u0438. \u0415\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u043f\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c (\u043e\u043d\u0438 \u0436\u0435 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044b), \u0442\u043e \u043f\u0443\u0441\u0442\u044c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043a\u0430\u043a \u0437\u0430\u043a\u043b\u0430\u0434\u043a\u0438 \u0432 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430\u0445. \u0421\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 «\u041f\u0440\u0438\u043d\u0446\u0438\u043f \u043d\u0430\u0438\u043c\u0435\u043d\u044c\u0448\u0435\u0433\u043e \u0443\u0434\u0438\u0432\u043b\u0435\u043d\u0438\u044f». \u042d\u0442\u0443 \u0438\u0434\u0435\u044e \u0432 \u043f\u043e\u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0438 \u0434\u043e\u0432\u0435\u0434\u0443\u0442 \u0434\u043e \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u0430 \u0421\u0442\u0438\u0432 \u0414\u0436\u043e\u0431\u0441, \u0421\u0442\u0438\u0432 \u0412\u043e\u0437\u043d\u044f\u043a \u0438 \u0438\u043d\u0436\u0435\u043d\u0435\u0440\u044b \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438 Apple.<\/p>\n

Models<\/h4>\n

\u041a\u0430\u043a \u043d\u0430\u043c \u043f\u0435\u0440\u0435\u043d\u0435\u0441\u0442\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u0435 \u0438\u0437 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d? \u0414\u043b\u044f \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0437\u0430\u0434\u0430\u0447 \u043f\u043e\u0434\u043e\u0431\u043d\u043e\u0433\u043e \u0440\u043e\u0434\u0430 \u043c\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u043c \u0430\u0431\u0441\u0442\u0440\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435. \u041c\u044b \u0440\u0430\u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u043c \u043f\u0440\u0435\u0434\u043c\u0435\u0442 \u043d\u0430 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430, \u0438 \u0432\u044b\u0431\u0438\u0440\u0430\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435, \u0447\u0442\u043e \u0432\u0430\u0436\u043d\u044b \u0434\u043b\u044f \u043d\u0435\u0433\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438. \u0423 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u0430 \u0435\u0441\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430: \u0441\u0442\u043e\u043b — \u044d\u0442\u043e \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430\u044f \u043f\u043e\u0432\u0435\u0440\u0445\u043d\u043e\u0441\u0442\u044c, \u0444\u043e\u043d\u0430\u0440\u0438\u043a — \u0438\u0437\u043b\u0443\u0447\u0430\u0435\u0442 \u0441\u0432\u0435\u0442, \u043a\u0440\u0443\u0436\u043a\u0430 — \u044d\u0442\u043e \u0451\u043c\u043a\u043e\u0441\u0442\u044c \u0434\u043b\u044f \u0436\u0438\u0434\u043a\u043e\u0441\u0442\u0438. \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u0430 \u0438 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u043c\u0438 \u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f: \u0441\u0442\u043e\u043b \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0439 — \u043d\u0430 \u043d\u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0447\u0442\u043e-\u0442\u043e \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u044c, \u0444\u043e\u043d\u0430\u0440\u0438\u043a \u0438\u0437\u043b\u0443\u0447\u0430\u0435\u0442 \u0441\u0432\u0435\u0442 — \u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u043e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0432 \u0442\u0435\u043c\u043d\u043e\u0442\u0435, \u043a\u0440\u0443\u0436\u043a\u0430 \u044d\u0442\u043e \u0451\u043c\u043a\u043e\u0441\u0442\u044c — \u0432 \u043d\u0435\u0451 \u043c\u043e\u0436\u043d\u043e \u0447\u0442\u043e-\u0442\u043e \u043d\u0430\u043b\u0438\u0442\u044c \u0438\u043b\u0438 \u043d\u0430\u0441\u044b\u043f\u0430\u0442\u044c, \u0438 \u044d\u0442\u043e \u0447\u0442\u043e-\u0442\u043e \u043d\u0435 \u0440\u0430\u0437\u043e\u043b\u044c\u0451\u0442\u0441\u044f \u0438 \u043d\u0435 \u0440\u0430\u0441\u0441\u044b\u043f\u043b\u0435\u0442\u0441\u044f.<\/p>\n

\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0430\u0431\u0441\u0442\u0440\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0434\u043e \u043d\u0443\u0436\u043d\u043e\u0433\u043e \u043d\u0430\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043c\u044b \u0438 \u0431\u0443\u0434\u0435\u043c \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c\u044e (Model<\/code>). \u041c\u043e\u0434\u0435\u043b\u044c — \u044d\u0442\u043e \u043d\u0430\u0431\u043e\u0440 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0438 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u043e\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u0441\u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0435.<\/p>\n

\u042d\u0442\u043e \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u0434\u043c\u0435\u0442 \u0438\u0437 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430. \u0413\u043b\u0430\u0432\u043d\u043e\u0435 — \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0445\u043e\u0434\u0438\u043b \u043c\u043e\u0434\u0435\u043b\u044c \u043f\u043e\u043d\u044f\u0442\u043d\u043e\u0439. \u0427\u0442\u043e\u0431\u044b \u0432 \u0435\u0433\u043e \u0433\u043e\u043b\u043e\u0432\u0435 \u0441\u043b\u043e\u0436\u0438\u043b\u0441\u044f \u043f\u0430\u0437\u043b: «\u042d\u0442\u043e \u0432\u0435\u0449\u044c \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0442\u0430\u043a\u0438\u043c\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c\u0438, \u0438 \u044f \u043c\u043e\u0433\u0443 \u0432\u043e\u0442 \u0442\u0430\u043a \u0441 \u043d\u0435\u0439 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c».<\/p>\n

\u041a\u0430\u043a \u043d\u0430\u043c \u0441\u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0444\u043e\u0440\u043c\u0443 \u0430\u0443\u0442\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438? \u041a\u0430\u043a\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0438 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u0442\u0430\u043a\u0443\u044e \u0444\u043e\u0440\u043c\u0443? \u041e\u0442\u0432\u0435\u0442\u0438\u0432 \u043d\u0430 \u044d\u0442\u0438 \u0432\u043e\u043f\u0440\u043e\u0441\u044b \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u0435\u0451 \u043c\u043e\u0434\u0435\u043b\u044c. \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0444\u043e\u0440\u043c\u044b — \u044d\u0442\u043e \u043d\u0430\u0431\u043e\u0440 input’\u043e\u0432, \u043a\u0443\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u0432\u0432\u043e\u0434\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435. \u0410 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f — \u044d\u0442\u043e \u0432\u0432\u043e\u0434 \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u044d\u0442\u0438\u0445 \u0434\u0430\u043d\u043d\u044b\u0445. \u0427\u0443\u0442\u044c \u043f\u043e\u0437\u0436\u0435 \u043c\u044b \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u0442\u0430\u043a\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0440\u0430\u0437\u0438\u0442\u044c \u0432 \u043a\u043e\u0434\u0435.<\/p>\n

P.S. \u041e\u0434\u0438\u043d \u0438\u0437 \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u0432 \u043f\u043e\u0434\u043e\u0431\u043d\u043e\u0433\u043e \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f — \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0431\u0443\u0434\u0443\u0442 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0438\u0437 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439 \u0438 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0432\u0441\u0435\u0439 \u0444\u043e\u0440\u043c\u044b \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440. \u0415\u0441\u043b\u0438 \u0441\u043b\u0443\u0448\u0430\u044f \u043f\u0440\u043e \u041e\u041e\u041f \u0432\u0430\u043c \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0438\u0440\u0430 \u0447\u0435\u0440\u0435\u0437 \u043a\u043b\u0430\u0441\u0441\u044b «\u043a\u043e\u0442\u043e\u0432» \u0438 «\u043c\u0430\u0448\u0438\u043d», \u0442\u043e \u0437\u043d\u0430\u0439\u0442\u0435, \u0447\u0442\u043e \u044d\u0442\u043e \u043f\u043e\u0448\u043b\u043e \u043e\u0442\u0441\u044e\u0434\u0430. \u0422\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u0433\u0434\u0430 \u0410\u043b\u0430\u043d \u041a\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u0430\u043b \u043d\u0430\u0434 SmallTalk<\/code>, \u043e\u043d \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u0430\u0433\u0430\u043b, \u0447\u0442\u043e \u0433\u043b\u0430\u0432\u043d\u0430\u044f \u0437\u0430\u0434\u0430\u0447\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 — \u044d\u0442\u043e \u043e\u0431\u043c\u0435\u043d \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f\u043c\u0438. \u0410 \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u044d\u0442\u043e \u043b\u0438\u0448\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0441\u043b\u0438 \u0432\u0430\u0448\u0430 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u043a\u043e\u0442\u0430\u043c\u0438 — \u044d\u0442\u043e \u0435\u0449\u0435 \u043d\u0435 \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043a\u043b\u0430\u0441\u0441\u044b \u043a\u043e\u0442\u043e\u0432, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u0442\u044b \u043c\u043e\u0433\u0443\u0442 \u0438 \u043d\u0435 \u043e\u0431\u043c\u0435\u043d\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f\u043c\u0438. \u0418 \u0442\u043e\u0433\u0434\u0430 \u043a\u043b\u0430\u0441\u0441\u044b \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u044f\u0442\u0441\u044f \u043d\u0435 \u0432 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f, \u0430 \u0432 \u0441\u043f\u043e\u0441\u043e\u0431 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u043a\u043e\u0434\u0430, \u0447\u0442\u043e \u0443\u0436\u0435 \u0434\u0435\u043b\u043e \u0432\u043a\u0443\u0441\u0430.<\/p>\n

\"\u0412\u0430\u0440\u0438\u0430\u043d\u0442<\/p>\n
\u0412\u0430\u0440\u0438\u0430\u043d\u0442 \u0430\u0431\u0441\u0442\u0440\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f «\u0424\u043e\u0440\u043c\u044b \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438» \u043a \u043c\u043e\u0434\u0435\u043b\u0438<\/figcaption><\/div>\n<\/figure>\n

Views<\/h4>\n

\u0422\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c, \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0435\u0451 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435. \u0413\u043b\u0430\u0432\u043d\u043e\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0435 \u0437\u0434\u0435\u0441\u044c — \u0434\u0438\u0437\u0430\u0439\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0441 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c. \u041e\u043d \u0434\u043e\u043b\u0436\u043d\u043e \u043e\u0442\u0440\u0430\u0436\u0430\u0442\u044c \u0432\u0441\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043c\u043e\u0434\u0435\u043b\u0438, \u0438 \u044f\u0441\u043d\u043e \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043d\u0435\u0439. \u0414\u0438\u0437\u0430\u0439\u043d, \u043e\u0442\u0440\u0430\u0436\u0430\u044e\u0449\u0438\u0439 \u043c\u043e\u0434\u0435\u043b\u044c, \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c View<\/code>.<\/p>\n

\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u043c \u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u0444\u043e\u0440\u043c\u043e\u0439 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438. \u041f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0438\u043c, \u0447\u0442\u043e \u043c\u044b \u0432\u0435\u0440\u0441\u0442\u0430\u0435\u043c \u0442\u0430\u043a\u0443\u044e \u0444\u043e\u0440\u043c\u0443 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e HTML.<\/p>\n

\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0434\u043e\u043b\u0436\u0435\u043d \u0437\u0430\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u043f\u043e\u043b\u044f \u0424\u0418\u041e \u0438 Email. \u0421\u0434\u0435\u043b\u0430\u0435\u043c \u0434\u0432\u0430 input’\u0430: \u043e\u0434\u0438\u043d \u0434\u043b\u044f \u0438\u043c\u0435\u043d\u0438, \u0434\u0440\u0443\u0433\u043e\u0439 \u0434\u043b\u044f email’\u0430. \u0427\u0442\u043e\u0431\u044b \u043b\u0443\u0447\u0448\u0435 \u043e\u0442\u0440\u0430\u0437\u0438\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c — \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c label \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e input’\u0430. \u041c\u043e\u0436\u0435\u043c \u0435\u0449\u0451 \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c input’\u044b, \u0437\u0430\u043c\u0435\u043d\u0438\u0432 \u0438\u0445 \u0444\u043e\u0440\u043c\u0443 \u0441 \u043e\u0431\u044b\u0447\u043d\u043e\u0433\u043e \u0442\u0435\u043a\u0441\u0442\u0430 \u043d\u0430 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0442\u0438\u043f\u0430 (\u0424\u0418\u041e \u0440\u0430\u0437\u043b\u043e\u0436\u0438\u043c \u043d\u0430 3 input’\u0430, \u0430 \u0443 email \u0431\u0443\u0434\u0435\u043c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u0432\u0432\u043e\u0434\u0438\u0442 \u0438\u043c\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438 \u0430\u0434\u0440\u0435\u0441 \u0441\u0430\u0439\u0442\u0430).<\/p>\n

\u0421\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u0441\u043e\u0433\u043b\u0430\u0448\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0441\u044b\u043b\u043a\u043e\u0439, \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u043d\u043e\u0432\u0443\u044e \u0432\u043a\u043b\u0430\u0434\u043a\u0443. \u0410 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u043e\u0439, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0441 \u0442\u0435\u043a\u0441\u0442\u043e\u043c \u0441\u043e\u0433\u043b\u0430\u0448\u0435\u043d\u0438\u044f. \u041c\u044b \u0434\u0430\u0436\u0435 \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u0441\u0441\u044b\u043b\u043a\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u043b\u043e\u0441\u044c \u0441\u043a\u0430\u0447\u0430\u0442\u044c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0441\u043e\u0433\u043b\u0430\u0448\u0435\u043d\u0438\u0435\u043c, \u0437\u0430\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u043e\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u044c\u044e.<\/p>\n

\u0421\u043e\u0433\u043b\u0430\u0441\u0438\u0435 \u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0441\u043e\u0433\u043b\u0430\u0448\u0435\u043d\u0438\u0435\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u043c checkbox’\u043e\u043c.<\/p>\n

\u0414\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0444\u043e\u0440\u043c\u044b \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u044b\u0447\u043d\u0443\u044e \u043a\u043d\u043e\u043f\u043a\u0443, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0441\u0434\u0435\u043b\u0430\u0435\u0442 HTTP \u0437\u0430\u043f\u0440\u043e\u0441. \u0418\u043b\u0438, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u044f\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0441 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u044b, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0441\u043b\u0430\u0442\u044c \u0444\u043e\u0440\u043c\u0443 \u043d\u0430 \u043f\u0435\u0447\u0430\u0442\u044c. \u0414\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u044f\u0442\u0441\u044f \u0432 \u0431\u043b\u0430\u043d\u043a (\u043a\u0430\u043a \u043d\u0430 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0439 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435 \u0441\u043b\u0435\u0432\u0430) \u0438 \u043a\u043b\u0438\u0435\u043d\u0442 \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0442 \u0441\u0432\u043e\u044e \u043f\u043e\u0434\u043f\u0438\u0441\u044c \u043d\u0430 \u0440\u0430\u0441\u043f\u0435\u0447\u0430\u0442\u0430\u043d\u043d\u043e\u043c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0435.<\/p>\n

\"\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b<\/p>\n
\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u043c\u043e\u0434\u0435\u043b\u0438 «\u0424\u043e\u0440\u043c\u044b \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438»<\/figcaption><\/div>\n<\/figure>\n

\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u043e\u0434\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u0442\u044c \u043e\u0433\u0440\u043e\u043c\u043d\u043e\u0435 \u043a\u043e\u043b-\u0432\u043e \u0440\u0430\u0437\u043d\u044b\u0445 View<\/code>, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430, \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0438 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438, \u0431\u044e\u0434\u0436\u0435\u0442\u0430 \u043d\u0430 \u0434\u0438\u0437\u0430\u0439\u043d \u0438 \u0442.\u043f. \u041f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0435 \u043a\u043e\u043b-\u0432\u043e \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043e \u043b\u0438\u0448\u044c \u0432\u0430\u0448\u0435\u0439 \u0444\u0430\u043d\u0442\u0430\u0437\u0438\u0435\u0439.<\/p>\n

Controllers<\/h4>\n

\u041d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0437\u0430\u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u043c\u043e\u0434\u0435\u043b\u044c\u044e. \u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 \u0432\u0432\u043e\u0434\u0430 (\u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0443, \u043c\u044b\u0448\u044c, \u0441\u0435\u043d\u0441\u043e\u0440). \u041c\u043e\u0434\u0435\u043b\u044c \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043d\u0430 \u044d\u0442\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f, \u0441\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0437\u0430\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0439 \u0432 \u043d\u0435\u0439 \u043b\u043e\u0433\u0438\u043a\u0435. \u0412 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 \u0436\u0435 \u0432\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u044d\u0442\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0438\u0437 \u0440\u0430\u0437\u043d\u044b\u0445 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u0432 \u0438 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u0445 \u0432 \u043d\u0443\u0436\u043d\u044b\u0435 \u043c\u043e\u0434\u0435\u043b\u0438.<\/p>\n

\u041f\u0440\u0438 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0435\u0433\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u044b \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432 \u0432\u0432\u043e\u0434\u0430, \u043f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0441\u043b\u0435\u0434\u044f\u0442 \u0437\u0430 \u043d\u0438\u043c\u0438 \u0438 \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u044e\u0442 \u043d\u0430 \u0442\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u0445\u043e\u0434\u044f\u0442 \u0432 \u0438\u0445 \u0437\u043e\u043d\u0443 \u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u0438. \u0414\u043b\u044f JavaScript<\/code> \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u043e\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u043b\u0443\u0436\u0438\u0442\u044c \u0432\u044b\u0437\u043e\u0432 \u043c\u0435\u0442\u043e\u0434\u0430 document.addEventListener('someEvent', controller)<\/code>. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u043c \u0431\u0443\u0434\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u0430\u044f \u0432 \u043c\u0435\u0442\u043e\u0434 \u0432\u0442\u043e\u0440\u044b\u043c \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u043c.<\/p>\n

\u0414\u043b\u044f \u043e\u0434\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u043c\u043e\u0436\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432. \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u0432\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u043e\u043c \u0438 \u0445\u043e\u0442\u0438\u0442\u0435 \u0435\u0433\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c. \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u043d\u044e, \u0432\u044b\u0431\u0440\u0430\u0432 \u043f\u0443\u043d\u043a\u0442 «\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c». \u041d\u0430 \u044d\u0442\u043e \u043e\u0442\u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f DocumentMenuController<\/code>. \u0410 \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0436\u0430\u0442\u044c «Ctrl+S», \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0442\u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 DocumentKeyboardController<\/code>.<\/p>\n

\u0412\u0441\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043c\u043e\u0434\u0435\u043b\u044c\u044e \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0438\u0434\u0443\u0442 \u0432 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440. \u041c\u043e\u0434\u0435\u043b\u044c \u043d\u0435 \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432 \u0432\u0432\u043e\u0434\u0430. \u0423 \u043d\u0435\u0451 \u0441\u0432\u043e\u0438 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438. \u0422\u0430\u043a\u043e\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c \u0447\u0438\u0441\u0442\u043e\u0439, \u043d\u043e \u0438 \u0441\u043e\u0431\u0438\u0440\u0430\u0442\u044c \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0438\u0437 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u0432 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e.<\/p>\n

\u0413\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0434\u043b\u044f \u043c\u043e\u0434\u0435\u043b\u0438 \u043c\u043e\u0436\u0435\u0442 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c, \u043d\u043e \u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u0430. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0432\u0435\u0440\u0448\u0451\u043d GET<\/code> \u0437\u0430\u043f\u0440\u043e\u0441 \u0441 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435\u043c \u044d\u0442\u0438\u0445 \u0434\u0430\u043d\u043d\u044b\u0445. \u0417\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u0438 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u0435\u043c, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0441\u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440.<\/p>\n

\"\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b<\/p>\n
\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b Controller’\u043e\u0432 \u0434\u043b\u044f \u043c\u043e\u0434\u0435\u043b\u0438 «\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442»<\/figcaption><\/div>\n<\/figure>\n

\u0417\u0430\u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u0443\u0435\u043c ProgressBar \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e MVC<\/h3>\n

\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0443\u0433\u043b\u0443\u0431\u0438\u043c\u0441\u044f \u0432 \u0434\u0435\u0442\u0430\u043b\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c MVC \u0432 \u043a\u043e\u0434\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b. \u0411\u0443\u0434\u0435\u043c \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c «\u043e\u0436\u0438\u0434\u0430\u043d\u0438\u0435 \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438». \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u044f\u0437\u044b\u043a\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c TypeScript<\/code>.<\/p>\n

Model<\/h4>\n

\u041d\u0430\u0447\u043d\u0451\u043c \u0441 \u043c\u043e\u0434\u0435\u043b\u0438. \u041a\u0430\u043a \u0447\u0435\u043b\u043e\u0432\u0435\u043a \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u0435\u0431\u0435 «\u043e\u0436\u0438\u0434\u0430\u043d\u0438\u0435 \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438»? \u0415\u0441\u043b\u0438 \u043c\u044b \u0433\u043e\u0432\u043e\u0440\u0438\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e \u0444\u0430\u043a\u0442 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438, \u0442\u043e \u043e\u043d\u0430 \u043b\u0438\u0431\u043e \u0435\u0441\u0442\u044c, \u043b\u0438\u0431\u043e \u043d\u0435\u0442. \u042d\u0442\u043e boolean<\/code> \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435. \u0415\u0441\u043b\u0438 \u043c\u044b \u0447\u0442\u043e-\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u043c \u0434\u043e\u043b\u0433\u043e\u0435 \u0432\u0440\u0435\u043c\u044f, \u0442\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u043d\u0435\u043f\u043b\u043e\u0445\u043e \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0447\u0435\u043b\u043e\u0432\u0435\u043a\u0443 \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u043e\u043b\u043e\u0441\u043e\u0447\u043a\u043e\u0439, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f. \u0412\u043e\u0442 \u0443 \u043d\u0430\u0441 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u043e\u0441\u044c 2 \u043c\u043e\u0434\u0435\u043b\u0438.<\/p>\n

Loader<\/code> \u0432 \u043a\u043e\u0434\u0435 \u043c\u043e\u0433 \u0431\u044b \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n

\/\/ \u041c\u043e\u0434\u0435\u043b\u044c \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0430\u043a\u0442 \u043d\u0430\u043b\u0438\u0447\u0438\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438. \u041e\u043d\u0430 \u043b\u0438\u0431\u043e \u0435\u0441\u0442\u044c, \u043b\u0438\u0431\u043e \u043d\u0435\u0442. type Loader = {     isLoading: boolean, }  class LoaderModel {     \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u043c\u043e\u0434\u0435\u043b\u0438     private loader: Loader = {         isLoading: false,     };  public get model(): Loader {     return this.loader; }      \/\/ \u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430     public start(): void {         this.loader.isLoading = true;     }      public cancel(): void {         this.loader.isLoading = false;     }      public finish(): void {         this.loader.isLoading = false;     } }<\/code><\/pre>\n
\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u0432 \u043a\u043b\u0430\u0441\u0441\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u0435\u0441\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043c\u0435\u0442\u043e\u0434\u043e\u0432, \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0445 \u0441 \u043d\u0435\u0439. \u042d\u0442\u043e \u0432\u0430\u0436\u043d\u044b\u0439 \u0430\u0441\u043f\u0435\u043a\u0442 \u043f\u0440\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u043c\u043e\u0434\u0435\u043b\u0435\u0439. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u0443\u0435\u043c \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u044e, \u043c\u044b \u043f\u0440\u043e\u0434\u0443\u043c\u044b\u0432\u0430\u0435\u043c \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0434\u043b\u044f \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u0438\u044f \u044d\u0442\u043e\u0439 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0438 \u0434\u0430\u043d\u043d\u044b\u0435, \u043d\u043e \u0438 \u043a\u0430\u043a \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0436\u0438\u0434\u0430\u0435\u0442 \u0441 \u044d\u0442\u0438\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c. \u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 Loader<\/code> \u043e\u043d \u043e\u0436\u0438\u0434\u0430\u0435\u0442, \u0447\u0442\u043e \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0447\u0430\u0442\u044c\u0441\u044f, \u043c\u043e\u0436\u0435\u0442 \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044c\u0441\u044f… \u0430 \u043c\u043e\u0436\u0435\u0442 \u0438 \u0431\u044b\u0442\u044c \u043e\u0442\u043c\u0435\u043d\u0435\u043d\u0430.<\/p>\n
\u041c\u044b \u0440\u0435\u0434\u043a\u043e \u0438\u043c\u0435\u0435\u043c \u0442\u0430\u043a\u0443\u044e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0432 WEB. \u041a\u043e\u0433\u0434\u0430 \u0437\u0430\u043f\u0440\u043e\u0441 \u0443\u0436\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u0435\u043d \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440, \u043c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u043d\u0430 \u043d\u0435\u0433\u043e \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c. \u0418 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u0435\u0433\u043e \u043e\u0442\u043c\u0435\u043d\u0438\u0442\u044c. \u0410\u043d\u0430\u043b\u0438\u0437 \u043c\u043e\u0434\u0435\u043b\u0438 \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u043b \u043d\u0430\u0441 \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043c\u043e\u0433 \u0431\u044b \u043e\u0436\u0438\u0434\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0433\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f: «\u0415\u0441\u043b\u0438 \u044f \u0443\u0441\u0442\u0430\u043d\u0443 \u0436\u0434\u0430\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443, \u0442\u043e \u044f \u043d\u0430\u0436\u043c\u0443 \u043d\u0430 \u043a\u0440\u0435\u0441\u0442\u0438\u043a \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043f\u0440\u0435\u043a\u0440\u0430\u0442\u0438\u0442\u0441\u044f». \u041c\u044b \u043c\u043e\u0436\u0435\u043c \u043d\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435. \u041d\u043e \u043c\u044b \u0437\u043d\u0430\u0435\u043c, \u0447\u0442\u043e \u0435\u0441\u043b\u0438 \u0443 \u043d\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0430\u044f \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c, \u0442\u043e \u044d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u043b\u0443\u0447\u0448\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 \u043d\u0430\u0448 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440. \u0422\u0430\u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0443\u0434\u0435\u0442 \u0431\u043b\u0438\u0436\u0435 \u043a \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e \u043d\u0451\u043c \u0435\u0441\u0442\u044c \u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/p>\n
Progress<\/code> \u0432 \u043a\u043e\u0434\u0435 \u043c\u043e\u0433 \u0431\u044b \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n
\/\/ \u041c\u043e\u0434\u0435\u043b\u044c \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441 \u043a\u0430\u043a\u043e\u0433\u043e-\u043b\u0438\u0431\u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0432 \u043f\u0440\u043e\u0446\u0435\u043d\u0442\u043d\u043e\u043c (%) \u044d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u0435 type Progress = {    percentages: number,    isGoing: boolean, }  class ProgressModel {     \/\/ \u0414\u0430\u043d\u043d\u044b\u0435 \u043c\u043e\u0434\u0435\u043b\u0438     private progress: Progress = {         percentages: 0,         isGoing: false,     };      public get model(): Progress {         return this.progress; }      \/\/ \u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430     public start(): void {         this.progress.percentages = 0;         this.progress.isGoing = true;     }      public finish(): void {         this.progress.percentages = 0;         this.progress.isGoing = false;     }      public update(percentages: number): void {         switch (true) {         case percentages <= 0:         this.progress.percentages = 0;         break; case percentages >= 100: this.progress.percentages = 100; break; default: this.progress.percentages = percentages;         }     } }<\/code><\/pre>\n
\u0412 \u043c\u043e\u0434\u0435\u043b\u0438 Progress<\/code> \u043c\u044b \u0432\u0432\u0435\u043b\u0438 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u044f \u043d\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445. Progress.percentages<\/code> \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0442 0 \u0434\u043e 100, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u044d\u0442\u043e \u043f\u0440\u043e\u0446\u0435\u043d\u0442\u044b.<\/p>\n
View<\/h4>\n
\u041e\u0442\u043b\u0438\u0447\u043d\u043e. \u041f\u0435\u0440\u0435\u0439\u0434\u0451\u043c \u043a \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c. \u0414\u043b\u044f \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u043e\u0433\u043e Loader<\/code>, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432 \u043a\u043d\u043e\u043f\u043a\u0435, \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0438\u043a\u043e\u043d\u043a\u0438:<\/p>\n
\"\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b<\/p>\n
\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u0445 \u0434\u0438\u0437\u0430\u0439\u043d\u043e\u0432 \u0434\u043b\u044f \u043c\u043e\u0434\u0435\u043b\u0438 Loader<\/figcaption><\/div>\n<\/figure>\n
\u0414\u043b\u044f \u0431\u043e\u043b\u044c\u0448\u043e\u0433\u043e Loader<\/code>, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 \u0432\u0441\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0435:<\/p>\n
\"\u041f\u0440\u043e\u0441\u0442\u043e\u0439<\/p>\n
\u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u0431\u043e\u043b\u044c\u0448\u043e\u0439 Loader<\/figcaption><\/div>\n<\/figure>\n
\u0410 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u0432\u0441\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0432 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u0430:<\/p>\n
\"\u0421\u043b\u043e\u0436\u043d\u044b\u0439<\/p>\n
\u0421\u043b\u043e\u0436\u043d\u044b\u0439 \u0438 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0439 \u0431\u043e\u043b\u044c\u0448\u043e\u0439 Loader<\/figcaption><\/div>\n<\/figure>\n
\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u043c\u043e\u0434\u0435\u043b\u044c \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u0434\u043d\u0430 \u0438 \u0442\u0430 \u0436\u0435: \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u0435\u0441\u0442\u044c \u0438 \u043d\u0443\u0436\u043d\u043e \u0436\u0434\u0430\u0442\u044c, \u0438\u043b\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043d\u0435\u0442 \u0438 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442. \u0412 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438 \u0435\u0451 \u043e\u0442\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043e\u0442 \u0440\u0430\u0437\u043d\u044b\u0445 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u043a\u0430\u043a \u0440\u0430\u0437 \u0438 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0442\u0435\u043e\u0440\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043e\u0441\u043d\u043e\u0432\u0430 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0430 MVC.<\/p>\n
Observer \u043c\u0435\u0436\u0434\u0443 Model \u0438 View<\/h4>\n
«View<\/code> \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043d\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 Model<\/code>» — \u0433\u043b\u0430\u0441\u0438\u0442 \u043e\u0434\u043d\u0430 \u0438\u0437 \u0441\u0442\u0440\u0435\u043b\u043e\u043a \u043d\u0430 \u0432\u0442\u043e\u0440\u043e\u0439 \u0441\u0445\u0435\u043c\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435. \u041a\u0430\u043a \u044d\u0442\u043e \u043f\u043e\u043d\u0438\u043c\u0430\u0442\u044c? \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 (Model<\/code>), \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438 (View<\/code>) \u0434\u043e\u043b\u0436\u043d\u043e \u043e\u0442\u0440\u0430\u0437\u0438\u0442\u044c \u044d\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041a\u043e\u0433\u0434\u0430 \u043c\u043e\u0434\u0435\u043b\u044c Loader<\/code> \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442 \u0438\u0437 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f isLoading = false<\/code> \u0432 isLoading = true<\/code>, \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0434\u043e\u043b\u0436\u0435\u043d \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f Loader<\/code>. \u041a\u043e\u0433\u0434\u0430 isLoading<\/code> \u0441\u043d\u043e\u0432\u0430 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f false<\/code>, \u0442\u043e\u0433\u0434\u0430 Loader<\/code> \u0441 \u044d\u043a\u0440\u0430\u043d\u0430 \u0434\u043e\u043b\u0436\u0435\u043d \u0438\u0441\u0447\u0435\u0437\u043d\u0443\u0442\u044c.<\/p>\n
\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u0432 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0430\u043a\u043e\u0433\u043e \u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n
\u0427\u0435\u0440\u0435\u0437 \u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\/Mediator:<\/strong><\/p>\n
    \n
  1. \n
    \u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u043c\u043e\u0434\u0435\u043b\u044c<\/p>\n<\/li>\n
  2. \n
    \u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u043d\u043e\u0432\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438<\/p>\n<\/li>\n
  3. \n
    \u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u043e\u0442\u0434\u0430\u0451\u0442 \u0435\u0433\u043e \u0432 View<\/code><\/p>\n<\/li>\n<\/ol>\n
    \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0430 Observer:<\/strong><\/p>\n
      \n
    1. \n
      \u041c\u043e\u0434\u0435\u043b\u044c \u0434\u0430\u0451\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0434\u0440\u0443\u0433\u0438\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0432\u043e\u0438\u0445 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439. \u041f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u043e\u0431\u044a\u0435\u043a\u0442 \u043c\u043e\u0434\u0435\u043b\u0438 \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u0442 \u0432\u0441\u0435\u043c \u043f\u043e\u0434\u043f\u0438\u0441\u0430\u0432\u0448\u0438\u043c\u0441\u044f \u043d\u0430 \u043d\u0435\u0433\u043e \u0441\u0432\u043e\u0451 \u043d\u043e\u0432\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435<\/p>\n<\/li>\n
    2. \n
      View<\/code> \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438<\/p>\n<\/li>\n
    3. \n
      \u041a\u043e\u0433\u0434\u0430 \u043c\u043e\u0434\u0435\u043b\u044c \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f, \u043e\u043d\u0430 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 View<\/code> \u0441\u0432\u043e\u0451 \u043d\u043e\u0432\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ol>\n
      \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u0430 Proxy:<\/strong><\/p>\n
        \n
      1. \n
        \u0421\u043e\u0437\u0434\u0430\u0451\u0442\u0441\u044f \u043e\u0431\u044a\u0435\u043a\u0442 \u0442\u0438\u043f\u0430 Proxy<\/code> \u0441 \u0442\u0435\u043c \u0436\u0435 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c, \u0447\u0442\u043e \u0438 \u0443 \u043c\u043e\u0434\u0435\u043b\u0438. \u0422\u0435\u043f\u0435\u0440\u044c \u043b\u044e\u0431\u043e\u0439 \u043c\u0435\u0442\u043e\u0434, \u0432\u044b\u0437\u0432\u0430\u043d\u043d\u044b\u0439 \u043d\u0430 \u043c\u043e\u0434\u0435\u043b\u0438, \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c Proxy<\/code> \u0434\u043e \u0438 \u043f\u043e\u0441\u043b\u0435 \u0432\u044b\u0437\u043e\u0432\u0430<\/p>\n<\/li>\n
      2. \n
        \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0432 Proxy<\/code> \u043e\u0431\u044a\u0435\u043a\u0442 View<\/code><\/p>\n<\/li>\n
      3. \n
        \u041f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0432\u044b\u0437\u043e\u0432\u0435 \u043c\u0435\u0442\u043e\u0434\u0430 \u043d\u0430 \u043c\u043e\u0434\u0435\u043b\u0438 \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u0442\u044c \u0447\u0435\u0440\u0435\u0437 Proxy<\/code>, \u0438 \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u0442\u043e\u0434 \u043c\u043e\u0434\u0435\u043b\u0438 \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442 \u0441\u0432\u043e\u044e \u0440\u0430\u0431\u043e\u0442\u0443, Proxy<\/code> \u0431\u0443\u0434\u0435\u0442 \u0431\u0440\u0430\u0442\u044c \u043d\u043e\u0432\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u0438 \u043f\u0440\u043e\u043a\u0438\u0434\u044b\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432 View<\/code><\/p>\n<\/li>\n<\/ol>\n
        \u041c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u0430\u0442\u044c \u0435\u0449\u0435 \u043c\u043d\u043e\u0433\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432. \u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0437 \u043d\u0438\u0445 \u043e\u043f\u0438\u0441\u0430\u043d\u044b \u0432 GOF. \u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 UI-Framework’\u0430\u043c\u0438.<\/p>\n
        \u041f\u043e\u043b\u043d\u0430\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f<\/h3>\n
        \u041e\u0431\u044b\u0447\u043d\u043e \u044f \u043f\u0438\u0448\u0443 client-side \u043d\u0430 Vue.js<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0441\u044c \u0435\u0433\u043e \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c\u0430\u043c\u0438 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438 \u043d\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f. \u0412\u043e\u0442 \u0442\u0430\u043a \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043f\u043e\u043b\u043d\u0430\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043c\u043e\u0434\u0435\u043b\u0438 Progress<\/code> \u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u0437 \u0435\u0451 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 —ProgressBar<\/code>:<\/p>\n
        \n\u041f\u043e\u043b\u043d\u0430\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f<\/summary>\n
        \n
        \u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0439:<\/p>\n
        src |-- components |-- progress |-- progressModel.ts |-- ProgressBar.vue<\/code><\/pre>\n
        \u041c\u043e\u0434\u0435\u043b\u044c Progress:<\/p>\n
        \/\/ progressModel.ts import {type DeepReadonly, readonly, ref} from \"vue\";  export interface Progress { percentages: number, isGoing: boolean, }  export class ProgressModel { private progress = ref<Progress>({ percentages: 0, isGoing: false, });  public get model(): DeepReadonly<Progress> {         \/\/ \u0427\u0442\u043e\u0431\u044b \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0438 \u0432 \u043e\u0431\u0445\u043e\u0434 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u043c\u043e\u0434\u0435\u043b\u0438 return readonly(this.progress.value); }  public start(): void { this.progress.value = { percentages: 0, isGoing: true, } }  public finish(): void { this.progress.value = { percentages: 0, isGoing: false, } }  public update(percentages: number): void { const progress: Progress = { percentages: this.model.percentages, isGoing: this.model.isGoing, }; switch (true) { case percentages <= 0: progress.percentages = 0; break; case percentages >= 100: progress.percentages = 100; break; default: progress.percentages = percentages; } this.progress.value = { percentages: progress.percentages, isGoing: progress.isGoing, } } }<\/code><\/pre>\n
        \u041e\u0434\u043d\u043e \u0438\u0437 \u043c\u043d\u043e\u0433\u0438\u0445 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 View \u0434\u043b\u044f \u043c\u043e\u0434\u0435\u043b\u0438 Progress. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e ProgressBar (\u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u044e\u0449\u0430\u044f\u0441\u044f \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430\u044f \u0448\u043a\u0430\u043b\u0430):<\/p>\n
        <!-- ProgressBar.vue --> <template> <div v-if=\"progress.isGoing\"> <div class=\"flex justify-start w-full h-16 border-2 border-slate-800\"> <div :style=\"`width: ${progress.percentages}%`\" class=\"bg-slate-500\"><\/div> <\/div> <\/div> <\/template><\/code><\/pre>\n
        import type {Progress} from \"@\/components\/progress\/progressModel.ts\";  defineProps<{ progress: Progress, }>();<\/code><\/pre>\n
        \u0422\u0435\u0441\u0442\u043e\u0432\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 (\u043f\u0440\u043e\u0441\u0442\u043e\u0439, \u0447\u0442\u043e\u0431\u044b \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u043e\u043a\u043b\u0438\u043a\u0430\u0442\u044c):<\/p>\n
        <template>     <ProgressBar :progress=\"progress.model\" \/>     <button @click=\"() => progress.start()\">Start<\/button>     <button @click=\"() => progress.update(progress.model.percentages + 10)\">Add<\/button>     <button @click=\"() => progress.finish()\">Finish<\/button> <template><\/code><\/pre>\n
        import ProgressBar from \"@\/components\/progress\/ProgressBar.vue\";   import {ProgressModel} from \"@\/components\/progress\/progressModel.ts\";  const progress = new ProgressModel();<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
        \u0412\u043e \u0432\u0441\u0435\u0445 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f Vue.js<\/code> + TypeScript<\/code> + TailwindCSS<\/code>. \u041c\u043e\u0436\u0435\u0442\u0435 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u0434 \u0432 \u043d\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0438 \u0438\u0437\u0443\u0447\u0438\u0442\u044c \u0435\u0433\u043e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e. \u0420\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0439\u0442\u0435 \u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043a\u0430\u043a \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438.<\/p>\n
        \u0412\u0430\u0440\u0438\u0430\u0446\u0438\u0438 \u043d\u0430 \u0442\u0435\u043c\u0443: MVP \u0438 MVVM<\/h3>\n
        <\/figure>\n
        \u041f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0438\u043c, \u043c\u044b \u043d\u0430\u0447\u0430\u043b\u0438 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043d\u0430\u0448\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043f\u043e MVC. \u041d\u043e \u043a\u0430\u043a \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c View<\/code>? \u041c\u043e\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c, \u0441\u0432\u044f\u0437\u0430\u0442\u044c \u0435\u0451 \u0441 View<\/code>, \u043f\u0435\u0440\u0435\u0432\u0435\u0441\u0442\u0438 \u043c\u043e\u0434\u0435\u043b\u044c \u0432 \u043d\u0443\u0436\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0438… \u0447\u0442\u043e \u0442\u0435\u043f\u0435\u0440\u044c? \u041d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c, \u0447\u0442\u043e View<\/code> \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u043c\u043e\u0434\u0435\u043b\u044c. \u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e \u0432 MVC \u0432 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438 View<\/code> \u0432\u0445\u043e\u0434\u0438\u0442 \u0438 \u043f\u0435\u0440\u0435\u0432\u043e\u0434 \u043c\u043e\u0434\u0435\u043b\u0438 \u0432 \u043f\u0440\u0435\u0437\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435.<\/p>\n
        \u041d\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0442\u0440\u0443\u0434\u043d\u043e. \u041c\u043e\u0436\u043d\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0432\u0441\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 html) \u0438 \u0441\u043e\u043e\u0442\u043d\u0435\u0441\u0442\u0438 \u0438\u0445 \u0441 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0435\u043b\u0435\u0439. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0445\u043e\u0440\u043e\u0448\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0437\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u0442\u0435\u0441\u0442\u044b (characterization test). \u041b\u0438\u0431\u043e \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c View<\/code> \u0432 \u0441\u0442\u0440\u043e\u043a\u0443 \u0438 \u0438\u0441\u043a\u0430\u0442\u044c \u0432 \u043d\u0435\u0439 \u0432\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u043f\u043e\u0434\u0441\u0442\u0440\u043e\u043a. \u041d\u043e \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u0438 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u0442\u0435\u0441\u0442\u044b \u0443\u0439\u0434\u0435\u0442 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041a\u0430\u043a \u043d\u0430\u043c \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441?<\/p>\n
        \u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0442\u044f\u0436\u0435\u043b\u043e. \u0410 \u0447\u0442\u043e \u043d\u0430\u0441\u0447\u0451\u0442 \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u0430 \u043c\u043e\u0434\u0435\u043b\u0438 \u0432 \u043f\u0440\u0435\u0437\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435? \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u043c\u044b \u043f\u0438\u0448\u0435\u043c \u043d\u0430 JS\/TS<\/code> \u0438 \u0443 \u043d\u0430\u0441 \u0432 \u043c\u043e\u0434\u0435\u043b\u0438 \u0435\u0441\u0442\u044c \u0432\u0440\u0435\u043c\u044f \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 Date<\/code>. \u041d\u043e \u043c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0435\u0433\u043e \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0441\u0440\u0430\u0437\u0443. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0435\u0433\u043e \u043e\u0442\u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c — \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u0441\u0442\u0440\u043e\u043a\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: 2025.03.23<\/code>. \u041c\u043e\u0436\u0435\u043c \u043b\u0438 \u043c\u044b \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u0443 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u043e\u0442 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u044d\u0442\u0438\u0445 \u0441\u0442\u0440\u043e\u043a \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435? \u041f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0442\u0430\u043a\u0438\u043c\u0438 \u0440\u0430\u0437\u043c\u044b\u0448\u043b\u0435\u043d\u0438\u044f\u043c\u0438 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0434\u043e\u0439\u0442\u0438 \u0434\u043e MVP.<\/p>\n
        \u041c\u044b \u0441\u043e\u0437\u0434\u0430\u0451\u043c \u0435\u0449\u0435 2 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438 \u043a\u043b\u0430\u0441\u0441\u043e\u0432: Presenter<\/code> \u0438 ViewModel<\/code>. Presenter<\/code> \u0431\u0435\u0440\u0451\u0442 \u043d\u0430 \u0441\u0435\u0431\u044f \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u044c \u0441\u043b\u0435\u0434\u0438\u0442\u044c \u0437\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f\u043c\u0438 \u0432 \u043c\u043e\u0434\u0435\u043b\u0438 \u0438 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0443\u044e DTO<\/code>, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043c\u044b \u043d\u0430\u0437\u043e\u0432\u0451\u043c ViewModel<\/code>. \u0422\u0435\u043f\u0435\u0440\u044c View<\/code> \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432\u0437\u044f\u0442\u044c \u0443\u0436\u0435 \u043e\u0442\u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0441\u0442\u0440\u043e\u043a\u0438 \u0438\u0437 ViewModel<\/code> \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0438\u0445 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0432\u043e\u0434 \u043c\u043e\u0434\u0435\u043b\u0438 \u0432 \u043f\u0440\u0435\u0437\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0434\u0430\u0436\u0435 \u043d\u0435 \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u044f html \u0438\/\u0438\u043b\u0438 \u043d\u0435 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u044f \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u043e\u0431\u043e\u043b\u043e\u0447\u043a\u0443.<\/p>\n
        \u0421 MVVM<\/code> \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0441\u043b\u043e\u0436\u043d\u0435\u0435. \u041c\u044b \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u043c \u0437\u0430 \u043c\u043e\u0434\u0435\u043b\u044c\u044e \u0438 View<\/code> \u0442\u0435 \u0436\u0435 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438, \u0447\u0442\u043e \u0438 \u0432 MVP<\/code>. \u041d\u043e \u043c\u0435\u0436\u0434\u0443 \u044d\u0442\u0438\u043c\u0438 \u0434\u0432\u0443\u043c\u044f \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\u043c\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 \u0435\u0441\u0442\u044c \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0441\u043b\u043e\u0439\u043a\u0438 (Controller<\/code> \u0438 \u043d\u0430\u0448\u0438 \u043d\u043e\u0432\u044b\u0435 Presenter<\/code> \u0438 ViewModel<\/code>). Controller<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043e\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u043c\u043e\u0434\u0435\u043b\u044c. \u041d\u043e \u043e\u0442\u043a\u0443\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u043b \u044d\u0442\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u044f? \u041e\u043d\u0438 \u0431\u044b\u043b\u0438 \u043d\u0430 \u0435\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0435, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0451\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 View<\/code>. Presenter<\/code> \u043e\u0442\u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u043b \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u043c\u043e\u0434\u0435\u043b\u0438, \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u043b \u0438\u0445 \u0432 View<\/code>. \u041c\u043e\u0434\u0435\u043b\u044c \u0438 View<\/code> \u0437\u0434\u0435\u0441\u044c \u0441\u0430\u043c\u044b\u0435 \u0433\u043b\u0430\u0432\u043d\u044b\u0435. \u0412\u0441\u0451 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435 — \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b.<\/p>\n
        \u0412\u043e\u0442 \u044d\u0442\u0438 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b MVVM<\/code> \u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0438\u0442\u044c \u0432 \u043e\u0434\u043d\u0443 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044e: ViewModel<\/code>. \u0414\u0430, \u0442\u0435\u0440\u043c\u0438\u043d \u0442\u043e\u0442 \u0436\u0435, \u043d\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0443 \u043d\u0435\u0433\u043e \u0443\u0436\u0435 \u0434\u0440\u0443\u0433\u043e\u0435. ViewModel<\/code> \u0431\u0443\u0434\u0435\u0442 \u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043e\u0442 View<\/code> \u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u044c, \u0430 \u043f\u043e\u0442\u043e\u043c \u0431\u0440\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u043d\u0451\u043d\u043d\u043e\u0439 \u043c\u043e\u0434\u0435\u043b\u0438, \u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0438\u0445 «\u043e\u0431\u0440\u0430\u0442\u043d\u043e» \u0432 View<\/code>. \u0423\u0434\u043e\u0431\u043d\u0430\u044f \u0432\u0435\u0449\u044c, \u043a\u043e\u0433\u0434\u0430 \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 (\u043a\u0430\u043a, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 Svelte<\/code> \u0438\u043b\u0438 Vue.js<\/code>).<\/p>\n
        \u0414\u043e\u0431\u0430\u0432\u043b\u044e \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u043e\u0442 \u0441\u0435\u0431\u044f. \u0414\u043b\u044f \u043c\u0435\u043d\u044f \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0439 \u043d\u0430 MVP<\/code> \u0438 MVVM<\/code> \u043d\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442. \u042f \u0432\u0438\u0436\u0443 \u0432\u0441\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b MVC<\/code> \u043a\u0430\u043a \u0441\u0445\u0435\u043c\u0443, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u043b \u0432\u044b\u0448\u0435. \u042d\u0442\u043e \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0439 \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0438\u0437 MVC\/MVP\/MVVM<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043e\u0431\u0440\u0430\u043d\u044b \u0432 \u043e\u0434\u043d\u0443 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044e \u0438 \u043c\u0435\u0436\u0434\u0443 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u0432\u044b\u0441\u0442\u0440\u043e\u0435\u043d\u044b \u043b\u0443\u0447\u0448\u0438\u0435, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0441\u0432\u044f\u0437\u0438.<\/p>\n
        \u041c\u043d\u043e\u0433\u0438\u0435 \u0441\u0447\u0438\u0442\u0430\u044e\u0442, \u0447\u0442\u043e View<\/code> \u0432 MVC<\/code> \u043d\u0435 \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u043c\u043e\u0434\u0435\u043b\u044c, \u0430 \u0432\u0441\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0447\u0435\u0440\u0435\u0437 Controller<\/code>. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043a\u0430\u043a \u0448\u0430\u0431\u043b\u043e\u043d Mediator<\/code>. \u0422\u043e \u0436\u0435 \u0441\u0430\u043c\u043e\u0435 \u0438 \u043f\u0440\u043e MVP<\/code> — \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0430\u043c Mediator<\/code> — \u044d\u0442\u043e Presenter<\/code>. \u042f \u0441\u0447\u0438\u0442\u0430\u044e \u0442\u0430\u043a\u0438\u0435 \u0441\u0432\u044f\u0437\u0438 \u0445\u0443\u0436\u0435, \u0447\u0435\u043c \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438 \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f.<\/p>\n
        \u042f \u0434\u0435\u0440\u0436\u0443 \u0432 \u0433\u043e\u043b\u043e\u0432\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u0443 \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u0441\u0445\u0435\u043c\u0443 \u0441 \u0442\u0435\u043c\u0438 \u0441\u0432\u044f\u0437\u044f\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u0430\u043c \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u043d\u044b. \u0418, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438, \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u044e \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0439 \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0438\u043b\u0438 \u043c\u0435\u043d\u044f\u044e \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438 \u0442\u0438\u043f\u044b \u0441\u0442\u0440\u0435\u043b\u043e\u043a. \u0422\u043e \u0435\u0441\u0442\u044c \u0443 \u043c\u0435\u043d\u044f \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0438\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0442\u0440\u0451\u0445 \u0448\u0430\u0431\u043b\u043e\u043d\u043e\u0432, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e M-VM<\/code>, \u0430 \u043c\u043e\u0436\u0435\u0442 \u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443 (MVC-P-VM<\/code>?). \u0425\u043e\u0442\u044f, \u0441\u043a\u043e\u0440\u0435\u0435 \u0432\u0441\u0435\u0433\u043e, \u0442\u0430\u043a\u043e\u0433\u043e \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0441\u043b\u0443\u0447\u0430\u043b\u043e\u0441\u044c. \u0414\u043b\u044f \u043c\u0435\u043d\u044f \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043e\u0434\u043d\u0443 \u043c\u043e\u0434\u0435\u043b\u044c, \u0430 \u043f\u043e\u0442\u043e\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043d\u0430 \u043b\u0435\u0442\u0443 \u0435\u0451 \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u0438 \u043f\u0440\u043e\u0449\u0435, \u0447\u0435\u043c \u0437\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u0442\u044c 3 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0448\u0430\u0431\u043b\u043e\u043d\u0430. \u041c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0439 \u043f\u043e\u0434\u0445\u043e\u0434, \u0435\u0441\u043b\u0438 \u0442\u043e\u0436\u0435 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0435 \u0435\u0433\u043e \u0443\u0434\u043e\u0431\u043d\u044b\u043c.<\/p>\n
        \u041a\u0430\u043a \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e \u0432 \u0440\u0430\u0431\u043e\u0442\u0435<\/h3>\n
        \u0415\u0441\u043b\u0438 \u0432\u044b \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440,<\/strong> \u0442\u043e \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u043c\u043e\u0434\u0435\u043b\u0435\u0439. \u0412\u043e\u0437\u044c\u043c\u0438\u0442\u0435 \u043f\u0435\u0440\u0432\u044b\u0439 \u043f\u0440\u0438\u0448\u0435\u0434\u0448\u0438\u0439 \u0432 \u0433\u043e\u043b\u043e\u0432\u0443 \u0434\u0438\u0437\u0430\u0439\u043d \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u0434\u043e\u0432\u043b\u0435\u0442\u0432\u043e\u0440\u0438\u0442 \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0410\u0431\u0441\u0442\u0440\u0430\u0433\u0438\u0440\u0443\u0439\u0442\u0435 \u0435\u0433\u043e \u0434\u043e \u043c\u043e\u0434\u0435\u043b\u0438: \u0432\u044b\u043f\u0438\u0448\u0438\u0442\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0438 \u043a\u0430\u043a \u0441 \u044d\u0442\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c. \u0410 \u043f\u043e\u0442\u043e\u043c \u043f\u0440\u0438\u043a\u0438\u043d\u044c\u0442\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0434\u0438\u0437\u0430\u0439\u043d\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0432\u0448\u0435\u0439\u0441\u044f \u043c\u043e\u0434\u0435\u043b\u0438. \u0422\u0430\u043a \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0439\u0442\u0438 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0438 \u0432\u0430\u0448\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u044b \u0441\u0442\u0430\u043d\u0443\u0442 \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u0435\u0435. \u0410 \u043f\u0440\u043e\u0434\u0443\u043c\u044b\u0432\u0430\u043d\u0438\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0443\u043b\u0443\u0447\u0448\u0438\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442.<\/p>\n
        \u0415\u0441\u043b\u0438 \u0432\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a,<\/strong> \u0442\u043e \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0440\u0430\u0437\u0431\u0438\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438\u0437 \u043c\u0430\u043a\u0435\u0442\u043e\u0432 \u043d\u0430 3 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438 \u0438\u0437 MVC. \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u0446\u0438\u0440\u0443\u0439\u0442\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0438 \u043c\u0435\u0442\u043e\u0434\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043d\u0443\u0436\u043d\u044b \u0434\u043b\u044f \u0435\u0433\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u0430 \u043f\u043e\u0442\u043e\u043c \u0432\u043e\u0441\u0441\u043e\u0437\u0434\u0430\u0439\u0442\u0435 \u0438\u0445 \u0432 \u043a\u043e\u0434\u0435, \u0441\u0442\u0440\u043e\u0433\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u0432 \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438. \u0422\u0430\u043a \u0432\u0430\u0448\u0438 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b \u0441\u0442\u0430\u043d\u0443\u0442 \u043d\u0430\u0434\u0451\u0436\u043d\u0435\u0435, \u0432\u0435\u0434\u044c \u0440\u0430\u0431\u043e\u0442\u0430 \u0441 \u043c\u043e\u0434\u0435\u043b\u044c\u044e \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u0442 \u043f\u0440\u043e\u0434\u0443\u043c\u044b\u0432\u0430\u0442\u044c \u0438\u043d\u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u0410 \u043a\u043e\u0434 \u0441\u0442\u0430\u043d\u0435\u0442 \u043f\u0440\u043e\u0449\u0435 \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0441\u0442\u0440\u043e\u0436\u0435 \u0440\u0430\u0441\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c \u043e\u0431\u044f\u0437\u0430\u043d\u043d\u043e\u0441\u0442\u0438 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438.<\/p>\n
        \u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h3>\n
        \u0421\u0442\u0430\u0442\u044c\u044f \u043d\u0430 \u044d\u0442\u043e\u043c \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0430. \u041d\u0430\u0434\u0435\u044e\u0441\u044c \u0432\u044b \u0443\u0437\u043d\u0430\u043b\u0438 \u0447\u0442\u043e-\u0442\u043e \u043d\u043e\u0432\u043e\u0435 \u0438 \u044f \u043f\u043e\u043c\u043e\u0433 \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c \u0432\u0430\u0448 \u0440\u0430\u0431\u043e\u0447\u0438\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441. \u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u0430\u0442\u0442\u0435\u0440\u043d \u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0435 \u0443\u0436\u0435 \u0437\u0430\u0432\u0442\u0440\u0430. \u0412\u043e\u0437\u044c\u043c\u0438\u0442\u0435 \u043e\u0434\u0438\u043d \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438 \u043f\u0440\u043e\u0434\u0443\u043c\u0430\u0439\u0442\u0435 \u0435\u0433\u043e \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 MVC. \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0432\u044b \u0430\u0434\u0430\u043f\u0442\u0438\u0440\u0443\u0435\u0442\u0435 \u044d\u0442\u043e\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043f\u043e\u0434 \u0441\u0435\u0431\u044f \u0438 \u043e\u043d \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0432\u0430\u0448 \u0440\u0430\u0431\u043e\u0447\u0438\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u0435\u0435.<\/p>\n\n
        P.S.<\/p>\n
        \u042f \u0445\u043e\u0447\u0443 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0430\u043c\u0438 \u043c\u043e\u0438\u043c\u0438 \u0440\u0430\u0437\u043c\u044b\u0448\u043b\u0435\u043d\u0438\u044f\u043c\u0438 \u043f\u043e \u043f\u043e\u0432\u043e\u0434\u0443 \u0438\u0434\u0435\u0438 \u043e \u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043c\u043e\u0434\u0435\u043b\u044f\u0445. \u042d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0441\u0442\u0430\u043b\u0430 \u043f\u0440\u043e\u043c\u0435\u0436\u0443\u0442\u043e\u0447\u043d\u044b\u043c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u043e\u043c \u043c\u043e\u0438\u0445 \u043f\u043e\u043f\u044b\u0442\u043e\u043a \u043e\u0442\u0432\u0435\u0442\u0438\u0442\u044c \u043d\u0430 \u0432\u043e\u043f\u0440\u043e\u0441: «\u0410 \u0447\u0442\u043e, \u0435\u0441\u043b\u0438 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u0432\u0441\u0435\u0445 \u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043c\u043e\u0434\u0435\u043b\u0435\u0439, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0445\u0441\u044f \u0432 WEB-\u0434\u0438\u0437\u0430\u0439\u043d\u0435?». \u0427\u0442\u043e \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e?<\/p>\n
        \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u0438\u0437, \u0441\u043a\u0430\u0436\u0435\u043c, 20-30 \u043c\u043e\u0434\u0435\u043b\u0435\u0439. \u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0434\u0435\u043b\u0438 \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0442 \u0437\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435. \u041c\u043e\u0434\u0435\u043b\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0442\u0435\u043a\u0441\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u0432\u0437\u044f\u0442\u044c \u0438\u0437 markdown: \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438, \u043f\u0430\u0440\u0430\u0433\u0440\u0430\u0444\u044b, \u0441\u043f\u0438\u0441\u043a\u0438. \u041c\u043e\u0436\u043d\u043e \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u043c\u043e\u0434\u0435\u043b\u0438 \u0433\u0440\u0443\u043f\u043f\u0438\u0440\u043e\u0432\u043a\u0438: \u0441\u0435\u043a\u0446\u0438\u0438, \u043a\u043e\u043b\u043e\u043d\u043a\u0438, \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u0435 \u043e\u043a\u043d\u0430. \u0414\u043b\u044f \u0437\u0430\u043f\u0438\u0441\u0438 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u043f\u043e\u043b\u044f, \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043d\u044b\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u043f\u043e\u043b\u044f (\u0446\u0432\u0435\u0442\u0430, \u0434\u0430\u0442\u044b, \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u044b \u0438 \u0442.\u043f.), \u0441\u0435\u043b\u0435\u043a\u0442\u044b \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u0444\u0430\u0439\u043b\u043e\u0432.<\/p>\n
        \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u044d\u0442\u043e\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u043a\u043e\u043d\u0435\u0447\u0435\u043d \u0438 \u043c\u044b \u0441\u043e\u0431\u0440\u0430\u043b\u0438 \u0432\u0441\u0435 \u043c\u043e\u0434\u0435\u043b\u0438. \u041a\u0430\u043a\u0438\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u044d\u0442\u043e \u043e\u0442\u043a\u0440\u043e\u0435\u0442!<\/p>\n