Если вы ищете реальный пример WordPress REST API с кодом, который вы можете изучить, новый веб- сайт ustwo.com с открытым исходным кодом находится на GitHub . ustwo — агентство цифровых продуктов, наиболее известное своей работой над отмеченным наградами приложением Monument Valley. Они сотрудничали с Human Made , агентством по разработке WordPress, для создания серверной части сайта.
Внешний интерфейс ustwo.com — это одностраничное приложение React.js, которое обслуживает контент WordPress через WP REST API с использованием настраиваемых конечных точек. В посте под названием « Открытие исходного кода нашего веб -сайта » разработчик ustwo Дэниел Деммель объясняет, почему компания разместила внешний интерфейс сайта на GitHub.
«В конечном счете, мы создали что-то новое и достаточно отточенное, чтобы поделиться им с общественностью», — сказал он. «Мы хотим, чтобы это было действительно полезно для других — в конце концов, очень хорошо читать в блоге о том, как приятно использовать React или Docker, с некоторыми примерами Hello World, но имея возможность заглянуть под капот производственный веб-сайт — это совсем другое».
В начале этого года команда ustwo решила внедрить инновационный подход, установив «безголовый WordPress», до официального слияния WP REST API.
«То, как мы использовали WordPress в качестве безголовой установки, доступной только через API для высококлассного производственного веб-сайта, было чем-то вроде технологической ставки — с WP-API, появившимся в ядре WordPress через шесть месяцев после того, как мы решили пойти на это — поэтому делимся нашим опыт и кодовая база должны давать идеи и уверенность в выполнении всем, кто рассматривает эту установку», — сказал Деммель.
Преимущества безголового WordPress
Если вам интересно, почему агентство может утруждать себя созданием своего веб-сайта в виде одностраничного приложения, вам нужно всего лишь зайти на сайт ustwo.com , чтобы увидеть разницу. Красивые переходы и скорость пользовательского интерфейса ставят этот сайт на голову выше аналогичных сайтов-портфолио.
«Мы решили построить сайт как одностраничное приложение, чтобы иметь полный контроль над всеми его аспектами, включая переходы между страницами, и сделать навигацию очень быстрой, не перезагружая браузер», — сказал Деммель. «Для этого мы выбрали React.js в качестве основной технологии JavaScript, поскольку она имеет встроенную поддержку рендеринга страниц и на стороне сервера (так называемый изоморфный рендеринг).
«Наша система управления контентом, стоящая за этим, представляет собой экземпляр WordPress, который на самом деле не отображает страницы сам по себе, а вместо этого предоставляет контент через API через сочетание стандартных и настраиваемых конечных точек JSON REST, что делает подавляющее большинство контента редактируемым». он сказал.
Так совпало, что проект Calypso на WordPress.com работает на похожем стеке. «Поэтому, если вам нравится то, что они сделали для того, чтобы сделать работу редактора потрясающей, вам понравится то, что мы сделали, чтобы сделать так, чтобы посетители были великолепны», — сказал Деммель.
ustwo решили сделать свою работу с открытым исходным кодом, как Automattic сделала с Calypso, осознавая важность совместного использования для содействия развитию всей экосистемы.
«Для нас гораздо больше пользы можно получить, опираясь на работу и знания друг друга, чем пытаясь удержать краткосрочное технологическое преимущество», — сказал Деммель.
REST API меняет совместную работу команд
В тематическом исследовании , опубликованном на веб-сайте Human Made, команда рассмотрела, как работа над проектом ustwo.com изменила их методы работы.
Работа с WordPress REST API привела к разделению задач, что означало новый подход к управлению проектами. Наши разработчики сосредоточились исключительно на WordPress как на приложении для ввода и доставки данных. Мы были лишь частью большой команды, в которую входили дизайнер, разработчик внешнего интерфейса React, разработчик внешнего интерфейса CSS, разработчик Node.js, менеджер проекта и заинтересованное лицо. Это позволило каждой части команды полностью сосредоточиться на своем компоненте, работая независимо, а также предоставляя обратную связь остальной части команды.
Human Made приписывает это аккуратное разделение задач новому рабочему процессу, который естественным образом возникает при использовании REST API. Back- и frontend-разработчики больше не наступают друг другу на пятки:
Сама технология способствовала этому изменению в управлении проектами: все, что нужно разработчикам внешнего интерфейса, чтобы заставить сайт работать, — это изменить URL-адрес, по которому находятся данные. Когда разработчики работают локально в своих средах разработки, они могут работать с содержимым действующего сайта; это также упрощает процесс перехода от постановки к производству. Мы обнаружили, что API изменил не только WordPress, но и то, как люди работают вместе, создав новый рабочий процесс и подтолкнув WordPress к развитию.
Для получения более подробной информации об архитектуре ustwo.com ознакомьтесь с примером из практики Human Made, а также с обзором процесса от ustwo . Надежные примеры с открытым исходным кодом, подобные этому, всегда полезны при обучении созданию с использованием новых технологий. Весь код веб-сайта находится под лицензией GPL и доступен на GitHub для любого использования или перепрофилирования.
