NN-webmaster
@NN-webmaster
Обожаю веб

Мини-сервис (первый опыт), как организовать взаимодействие PHP и JS (vanilla JS & jQuery)?

Приветствую, Тостер!

Сейчас разрабатываю свой небольшой пет-проект. Чем-то похож на SPA, но не совсем. Одна единственная страница, разметка заранее прописана. На странице можно, нажимая разноцветные кнопочки, совершать различные действия, которые требуют обмена данных с сервером, т.е. неоднократных обращений к БД (mySQL с методами mySQLi). Например, лайкать и дизлайкать динамически подгружаемые записи. Делаю я это на чистом PHP (с серверной стороны) и на JS/jQuery (последний использую только для AJAX-запросов) с клиентской.

Честно скажу, это первый проект подобного рода, который я пилю, поэтому, наверняка, я наделал кучу ошибок как в архитектуре, так и в принципах взаимодействия клиента и сервера, да и, веб-разработки, вообще.

Пример одной из таких ошибок, имхо

Например, у меня количество лайков и дизлайков подгружается динамически, AJAX-запросом в БД, в функции, которая выполняется после построения DOM.
Т.е. я так понимаю свою ошибку в этом месте: нет смысла перестраивать DOM ещё один раз, чтобы вставить на страницу две цифры актуальных лайков и дизлайков. А нужно это делать с помощью PHP, получая цифры из БД и вставляя их инлайново прямо в элемент.


И я хотел спросить. Не в глобальном плане, а хотя бы по одному моменту. Сейчас у меня в единственном js-файле полно ajax-запросов, висящих на разных обработчиках (слушатель кнопки подгрузки следующей записи, кнопок лайков/дизлайков и т.д.). В принципе, нормально.

А вот с PHP не всё так гладко. Я его практически не знаю и делаю абы как. Сейчас у меня есть много .php файлов с именами типа "like.php", "refresh.php", "spoiler.php". Каждый из них начинается с команды require_once 'config.php';, т.е. обращения к файлу config.php, в котором происходит подключение к БД. И потом, собственно, каждый скрипт выполняет ту небольшую функцию, за которую он отвечает. Обновляет количество лайков, подгружает следующую запись и т.д. оперируя данными из БД и возвращая результат клиенту через echo.

Вопрос. Такой подход, насколько он неправильный? Наверняка есть какой-то более удобный способ (хотя не могу сказать, что сейчас мне неудобно). Через include, или, я не знаю, обращаться всегда к одному PHP-файлу, в котором все эти функции записаны заранее (как в JS) и конкретная функция запускается уже конкретным AJAX-запросом?

И, также, я буду очень рад, если опытные люди посоветуют, что делать в этой ситуации. Разрабатывать дальше, с кривой архитектурой, или на время отвлечься и пополнить свои знания в этой теме?

И какие теоретические материалы, кстати, вы можете посоветовать почитать по архитектуре веб-приложений (даже не обязательно SPA) и по оптимальному взаимодействию клиент-сервер (может, даже есть какие-то специфические моменты во взаимодействии JS-PHP)?

Заранее благодарю.
  • Вопрос задан
  • 463 просмотра
Пригласить эксперта
Ответы на вопрос 2
@D3lphi
Для spa удобно использовать js фреймворки. Самый легким (в том плане, что простой и быстрый) является vuejs (https://ru.vuejs.org/). Насчет php. Такой подход, кокой используете вы, конечно же, ошибочен. Реализуйте единую точку вход по средствам того, что будете "сливать" все входящие запросы на индексный файл, а он уже будет подключать необходимые файлы, разбираться, что делать в том или ином случае.
Ответ написан
Из теоретических знаний:
MVC, ООП и сам PHP на уровне понимания концепций, а также классы, публичные - приватные методы, интерфейсы.
www.phptherightway.com - для понимания основных концепций и того, как правильно писать.
REST - протокол обмена данными по сети без сохранения состояния (православно для spa приложений, но можете не применять, пока неготовы).
ORM и activerecord- почитайте тоже в википедии, рано или поздно все равно придете к этому.
composer - чтобы не пилить по 10 раз то, что уже запилено другими. Заодно psr-0 psr-4 стандарты, чтобы понимать, как подключить ваши собственные классы.
vuejs либо другой фронтэнд-фреймворк - вы удивитесь, насколькьо удобнее писать на нем вместо чистого jquery (можете использовать совместно с vuejs).
фреймворк - не ранее, чем освоите первые две строки из списка. Но микрофреймворк все же будет очень полезен. Особенно совокупности с композером. slim, lumen, ну или что-нибудь другое (sliex не предлагаю, вдруг он окажется сложным, не пробовал его). Как минимум они дадут вам удобный роутинг, красивую функцию для возвращения ответа сервера в виде json вместо ручного задания заголовков и echo
$data = array('name' => 'Rob', 'age' => 40);
$newResponse = $oldResponse->withJson($data, 201);

и ощущение, что не все потеряно в этой жизни (lumen еще и удобное подключение в базе данных из коробки, но он медленнее, хотя и микро). Кроме роутера в основном ваш код сможете оставить прежним.
Чего еще, а phpstorm - если уж писать правильный код, то правильным инструментом. Чего забыл - другие подскажут.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы