How to smoothly transition to react (angular) on a site that uses jQuery?

Question

css

Hello community.
Now I work in a company on a fairly large project. Just written in HTML/CSS/jQuery as far as the front. All dynamic functionality is now on bare jQuery divided into separate files and libraries with its own area of ​​responsibility. For good support, I want to split it into small components so that all components are clearly divided and lie with all their implementation files in my directory, introduce some kind of framework to bind data to the view and in the model.

The question arises: how to smoothly rewrite the project into components and at the same time not break everything? ;)
I want to do it in small blocks.
Those. there is an authorization form or a block for choosing the color-size of the product. I want to rewrite them in react or connect angular and implement them as if nothing had happened.

Which approach to choose? Maybe there are articles on the topic or someone has already done something similar.

Answer 1

We connect. JADE Tyk , Tyk
And use
You can also use

extends

block

Answer 2

Я опишу свой опыт, не знаю даст это что-то или нет. Тоже встала такая проблема, думал как решить, основная загвоздка была в том, что сразу все переписывать не было времени, т.к. если внедрять React нужно было переписывать все view. Я добавил роутинг от backbone, чтобы много лишнего кода не писать большинство функций оставил на jquery, но так у меня появилась четкая структура.
А view использовал от React (где либо немного переписывать, либо новый функционал), таким образом я структурировал проект избавился от простыней кода (постепенно) и добавил React, Хотя признаться честно React добавил, чтобы изучить новое, там он не особо был нужен. Ну и в итоге получился довольно структурированный проект. Правда все равно местами используется React местами jQuery уж слишком большое наследие в проекте.
Но да, этот проект не для поисковых систем.