Как перевести проект на React (на проекте битрикс)?
=====================================================

 На данный момент на проекте используются: нативный js, битрикс (и php естественно)  

Нам не нравится как взаимодействуют фронтенд и бэкэнд сейчас (фронт и бэк в разных репозиториях и мы хотим чтобы все было в одном месте. Если что то меняется на фронте, то приходится передавать скомпилированные файлики js и css. Нам это неудобно)   

Думаем как оптимизировать работу фронтенда и бэкэнда.  
  

Поступило предложение переводить проект на React.  

Думаю как это сделать, ведь писать с нуля проект на реакте - это одно, а переводить существующий проект на реакт, мне кажется, это другое.  

У меня пока нет полного представления как это будет. Есть куча непонятный вещей.  
  

1) Например сейчас, данные отрисовываются с помощью php.  

Но если мы будем переводить проект на реакт, то как мы будем писать php в нем?  

Ведь синтаксис реакта ( jsx ) не предусматривает php.  

И есть разделы которые даже не хочется трогать - просто копировать php и вставить. Но как такое получится в реакте?  
  

2) И еще момент: проект довольно большой. И мне кажется, так просто взять за неделю и перевести проект на реакт не получится. Наверное будем частями переводить.  

Т.е. получается одна часть проекта будет написана на реакте, а другая - нет? Это вообще как?  
  

У кого то есть подобный или близкий к этому опыт? Что посоветуете? Как грамотно перевести проект на реакт в таком случае? 

> Но если мы будем переводить проект на реакт, то как мы будем писать php в нем?

  

Что это вообще может значить? PHP у вас это server side, а React это клиентское приложение.... Блин, я даже не знаю что дальше спросить... вы PHP в браузере собрались исполнять или JS интерпритатором PHP?  

Это вот вопрос он лишен смысла чуть более чем полностью.  
  

> Ведь синтаксис реакта ( jsx ) не предусматривает php.

  

Да причем тут синтаксис? Среда исполнения не предусматривает php, а вы про синтаксис.  
  

> И мне кажется, так просто взять за неделю и перевести проект на реакт не получится. Наверное будем частями переводить.

  

Если это сайт среднего размера, то нужно заложить не неделю, а несколько месяцев.  
  

> Т.е. получается одна часть проекта будет написана на реакте, а другая - нет? Это вообще как?

  

А что здесь может быть не понятного? Ну реалазиуйте сначала на реакте одну страничку, самую простую в отдельном шаблоне сайта. Будет у вас для переделанных URL один шаблон использоваться, а для не переделанных другой - без реакта. Не вижу никакой проблемы.  
  

> У кого то есть подобный или близкий к этому опыт? Что посоветуете? Как грамотно перевести проект на реакт в таком случае? 

  

Выше написал:  

1 Сначала разрабатываете шаблон для одного раздела сайта на React, так как буд-то других разделов просто не существует.  

2 Пишите соотвествующий бэкенд который будет отдавать данные для этого вашего шаблона.  

3 Переводите этот раздел сайта на React.  

4 Эксплуатируете неделю, подчищая косяки.  

5 Выбираете еще один раздел сайта поменьше и переводите его аналогичным образом.  

6 В этом месте у вас уже должно быть понимание где вы наложали с архитектурой, какие накопились костыли, и в чем фундаментальные изъяны того что вы сделал. Тут вы должны остановиться и выкинуть всё что сделали раньше. Я не шучу - просто выкинуть и начать перерабатывать эти разделы с нуля...  

7 Теперь вы знаете что делать дальше. 

 Все верно человек выше отписал. Добавлю. Ваши шаблоны компонентов Битрикса должны отдавать исходные данные для последующей отрисовки страницы на стороне клиента. Я не знаком с React, но подозреваю, что данные он получает через json. Т.е. задача сводится к тому, что шаблон компонента Битрикса отдавал json, а React его понимал. Создайте новый шаблон сайта, без визуальных данных, и включайте его по GET-условию, например react=Y. И читайте комментарий выше. 

> Нам не нравится как взаимодействуют фронтенд и бэкэнд сейчас (фронт и бэк в разных репозиториях и мы хотим чтобы все было в одном месте.

  
  

Подключите репозиторий с вёрсткой подмодулем к основному репозиторию, а на сервере проставьте симлинки на файлы css и js.   
  

[https://git-scm.com/book/ru/v2/%D0%98%D0%BD%D1%81%...](https://git-scm.com/book/ru/v2/%D0%98%D0%BD%D1%81%D1%82%D1%80%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D1%8B-Git-%D0%9F%D0%BE%D0%B4%D0%BC%D0%BE%D0%B4%D1%83%D0%BB%D0%B8)