{
    "version": "https:\/\/jsonfeed.org\/version\/1",
    "title": "Блог Сергея Копылова: заметки с тегом шаблоны",
    "_rss_description": "Блог Сергея Копылова",
    "_rss_language": "ru",
    "_itunes_email": "",
    "_itunes_categories_xml": "",
    "_itunes_image": "",
    "_itunes_explicit": "",
    "home_page_url": "https:\/\/www.blog.sergeykopylov.ru\/tags\/shablony\/",
    "feed_url": "https:\/\/www.blog.sergeykopylov.ru\/tags\/shablony\/json\/",
    "icon": "https:\/\/www.blog.sergeykopylov.ru\/user\/userpic@2x.jpg?1574324497",
    "author": {
        "name": "Сергей Копылов",
        "url": "https:\/\/www.blog.sergeykopylov.ru\/",
        "avatar": "https:\/\/www.blog.sergeykopylov.ru\/user\/userpic@2x.jpg?1574324497"
    },
    "items": [
        {
            "id": "44",
            "url": "https:\/\/www.blog.sergeykopylov.ru\/all\/arhitektura-frontenda-konfiguracii\/",
            "title": "Архитектура фронтенда: конфигурации",
            "content_html": "<p>Я долго работал над большими проектами для администирования, когда в системе есть очень много данных, и много страниц, для управления ими. Много — это, например, 500 страниц. И я использовал довольно естественный подход, когда каждая страница конфигурируется, а не программируется. Что-то вроде такого:<\/p>\n<pre class=\"e2-text-code\"><code class=\"\">import ...\r\n...\r\n\r\nexport default {\r\n    url: &quot;orders\/:id&quot;, \/\/ Адрес страницы с подстановкой данных\r\n    template: &quot;formPage&quot;, \/\/ Какой шаблон страницы использовать\r\n    data: { \/\/ Данные и обработчики данных\r\n        value: (id) =&gt; Data.get(Orders, {id: id}, \/\/ Набор значений полей заказа с сервера\r\n        fields: fields, \/\/ Набор полей по порядку с их параметрами, подключаемый из другого файла,\r\n        onSave: (id) =&gt; Data.save(Orders,  {id: id})\r\n    }\r\n}<\/code><\/pre><p>Это, конечно, псевдокод, но он показывает сам принцип:<\/p>\n<ul>\n<li>Существует сервис <b>Data<\/b>, который умеет получать данные с сервера и отправлять их обратно. Вообще говоря, неважно, хранит ли он их на сервере, или в локалсторадж, к примеру, странице-то это неважно;<\/li>\n<li>Существует <b>Orders<\/b> — описание того, как именно сохранять или получать заказы, внутри — просто JSON с параметрами, которые переиспользуются на разных страницах;<\/li>\n<li><b>fields<\/b> — это JSON-описание набора полей: в каком они порядке, как взаимосвязаны друг с другом, в каком из них какое поле из data отображается, какого они типа и так далее.<\/li>\n<\/ul>\n<p>Получается, что новому разработчику вообще не нужно уметь программировать, а нужно только описать два JSON-файла:<\/p>\n<ul>\n<li>Набор полей<\/li>\n<li>По какому адресу и с какими дополнительными параметрами можно получить и записать данные о заказе на сервере.<\/li>\n<\/ul>\n<p>Если к этому есть документация, или, хотя бы много примеров (а когда страниц 500, то и примеров в избытке) — это несложно, и, что важнее, очень быстро для исправления или переработки.<\/p>\n<p>Всё. Как именно сохранять данные и когда отправлять их на сервер и в каком виде знает сервис <b>Data<\/b>; компоненты на странице знают, как именно отрисовывать поля ввода. Разработчику ненужно парится об отступах и расположении элементов, об отображении индикатора загрузки при сохранении и вообще о том, как устроен конкретный шаблон, достаточно просто его сконфигурировать.<\/p>\n<p>Но оказалось, что этот способ используется очень редко потому, что дизайнеры рисуют разные макеты, потому, что кажется, что существующим шаблоном не решить задачу и так далее. Все эти проблемы надуманы — нужно стараться решить задачу существующими средствами, точечно дорабатывая их, когда не получается. Но это тема другой статьи<\/p>\n",
            "date_published": "2020-02-24T20:24:20+03:00",
            "date_modified": "2020-02-24T20:24:14+03:00",
            "_date_published_rfc2822": "Mon, 24 Feb 2020 20:24:20 +0300",
            "_rss_guid_is_permalink": "false",
            "_rss_guid": "44",
            "_e2_data": {
                "is_favourite": false,
                "links_required": [
                    "system\/library\/highlight\/highlight.js",
                    "system\/library\/highlight\/highlight.css",
                    "system\/library\/highlight\/highlight.js",
                    "system\/library\/highlight\/highlight.css"
                ],
                "og_images": []
            }
        }
    ],
    "_e2_version": 3559,
    "_e2_ua_string": "E2 (v3559; Aegea)"
}