Как сделать сайт без перезагрузки страниц?

Question

[x404]

Привет всем!

Как делают такие сайты?
https://meduza.io/ , kremlin.ru

Вопрос в том как сайт работает без перезагрузки, и открывает любые страницы + смена УРЛ + история посещений.

Какие технологии при этом исспользуются серверные/клиентские?
Есть ли уже готовые решения (CMS), на примере ссылки выше?

Comments

[Zhainar]

медуза не открывается, а кремлин похож на обычный сайт на вордпресе.

[Kovalsky]

Zhainar: ... который еще вдобавок весь шириной 680px )

Answer 1

[Никита Гущин]

У браузера есть history api с помощью которого можно отслеживать переход по страницам и вместо того, чтобы запрашивать страницу с сервера - сделать запрос, получить JSON-данные и отрендерить страницу прямо на клиенте.

Такие приложения называют SPA и для их разработки используют фреймворки - react (не библиотека, а вместе с инфраструктурой), angular2, ember.

Сервер в этом случае выглядит как REST API (отдает JSON данные) и может быть реализован на чем угодно. Обычно это PHP (symfony2\laravel\yii\...), nodejs, Java (spring MVC), go, ruby и так далее. В зависимости от задач.

Answer 2

[Kovalsky]

А что именно там динамичного? Если вы про отзывчивость, то это же просто CSS @media, для Wordpress, думаю, почти все темы отзывчивые

Comments

[x404]

Вопрос в том как сайт работает без перезагрузки, и открывает любые страницы + смена УРЛ + история посещений. Я понимаю что все это работает через JS.

Answer 3

[Слава]

поставь в браузер плагин Wappalyzer - он помогает определять на чем делается сайт
joxi.ru/Q2KqbbNhq9aXrj

а вообще такие сайты можно сделать практичеcки на любой CMS. Например, на Wordpress.
А дизайн рисуется в фотошопе и потом преобразуется в html-css при помощи верстальщика.

Comments

[x404]

Такой плагин стоит. Возможно я не совсем корректно задал вопрос.
Интересно как сайт работает без перезагрузки, и открывает любые страницы + смена УРЛ + история посещений. Естественно все это работает через JS. Но какие именно серверные/клиентские технологии применяются.

[Слава]

Сергей Сыса:
Ajax - это дверь в мир сайтов и форм без перезагрузки страниц.

[x404]

Павел Ушанников: Я в этом не сомневаюсь, поэтому в тегах к вопросу указал ajax, react.js итд. Вопрос в том какие СЕРВЕРНЫЕ технологии. В какой БД хранятся данные, и как все это работает.

[Слава]

Сергей Сыса: пусть меня кто-нибудь поправит, но не факт, что на сервере что то особенное. На сервере может быть обычный WordPress а на клиенте ajax И всё. Ну и на сервере могли какую угодно cms или фреймворк использовать - мы этого не узнаем, потому что они не оставили в коде упоминания о ней. может это быть обычным фреймворком, на котором сделан сайт. На клиенте мы видим то что нам выдает Cms, а чтоб узнать как она это делает нужно смотреть код на сервере. А Ajax просто посредник между клиентом и сервером.