Динамические страницы - это страницы сайта с уникальным маршрутом (url-адресом) и возможностью динамического переключения между маршрутами. Т.е. маршруты изменяются и часть страницы сайта, содержащего контент, тоже меняется, но не вся страница. Динамическое переключение маршрутов означает, что меняется сам маршрут и часть содержимого страницы, при этом не происходит обновления всей страницы: стилей, файлов, базового шаблона.
Уникальный адрес или маршрут для html-страницы можно получить с помощью Nginx, Apache, Node, PHP и множества других технологий и фрэймворков. Часто для этого необходимо лишь установить сервер (для Windows это может быть OpenServer) и разместить свою страницу в корневой папке сервера (для OpenServer это может быть папка domains/localhost).
Веб-приложение состоит из множества маршрутов. Современные технологии позволяют формировать маршруты как на стороне сервера, так и на стороне клиента (браузера). При проектировании динамических страниц, могут использоваться клиентские и серверные маршруты. И это не усложнение - пока это единственный способ создать качественное web-приложение с динамической маршрутизацией.
Проблемма в том, что приложения только с клиентской маршрутизацией (фрэймворки Angular, React, Vue) для SEO-продвижения бесполезны, поисковики не видят контента таких "лэндингов". А приложения только с серверной маршрутизацией - не динамичны.
В разработке web-приложений приходится использовать и клиентскую и серверную маршрутизацию. Всё что необходимо выделить для SEO-продвижения: маршруты, контент и мета-данные, для этого используем клиентскую маршрутизацию. Примеры таких маршрутов для сайта компании:
/ /about_company /vacancy /blog /contact
А серверные маршруты не видны для клиента. Для реализации таких маршрутов можно использовать модуль Axios либо технологии Ajax.
По динамике взаимодействия клиентской и серверной маршрутизации выделяются следующие виды веб-приложений.
Серверная маршрутизация и динамика на стороне клиента. Например, с использованием языка программирования PHP на сервере и функционального JavaScript или библиотек JavaScript (например, jQuery). Маршрут определяется на стороне сервера. Сайты разработанные таким образом обладают динамикой обладают динамикой только в пределах одной страницы (независимо от способов шаблонизации на стороне сервера). Другая страница обладает независимым маршрутом, но при переходе на такую страницу происходит обновление всего контента. При такой разработке говорить о динамике можно только в пределах одной страницы.
Клиентская маршрутизация и динамика на стороне клиента. Такую возможность предоставляют фрэймворки Vue, React, Angular. В базовой установке они предлагают готовые решения для создания лендингов. Благодаря этим фрэймворкам появилась возможность реализовывать любую даже самую сложную динамику и даже реализовывать клиентские маршруты. Сайты с клиентской маршрутизацией хоть и обладают полной динамикой при переходе по страницам (т.е. обновление маршрута происходит без перезагрузки всего контента), но с точки зрения SEO-продвижения - бесполезны: такие сайты сложно продвигать, потому что поисковые роботы и браузеры не видят таких маршрутов, и вообще не видят никакого контента.
SSR и динамика на стороне клиента. Маршрутизация определяется структурой приложения. Такой способ разработки, а соответственно, и архитектуру приложения предоставляют фрэймворки Nuxt (с использованием синтаксиса Vue) и фрэймворк Next (с использованием синтаксиса React) и библиотека https://github.com/thedevdojo/genesis (фрэймворка Laravel). Данные JavaScript фрэймворки предлагают компонентный подходв разработке приложения, позволяют реализовать специальную, "заточенную" под клиента маршрутизацию и возможность реализовывать серверные запросы. Всё что нужно для разработки приложения с динамическими страницами.
Практика