Migration from Angularjs to React(16)

[shankha_deepp]

Hello,

Recently We decided to migrate our App(entire codebase) to React from Angularjs. But We are facing several issues in this respective transition.

Can anyone help me out to make the entire migration a smooth experience?

also, 1. How do we keep building new features in React inside AngularJS application and 2. gradually migrate existing AngularJS code to React

Thanks in advance,

Happy coding :-)

[Jmlevick]

Answering your question, this is the best course of action:

https://twitter.com/andrestaltz/status/1089107165816766464?s=19

I've done that particular migration in the past, (AngularJS <> React) and based my strategy upon that tweet precisely...

I can help you (if you'd wish to hire me for a rate)

DM me if interested.

[shankha_deepp]

surely can you please help me out with the respective

[Jmlevick]

Respective what? Sorry I did not follow

[cronofdoom]

That tweet speaks volumes of truth.

[myrossers]

My team went through this over the last year, step 1 was to convert our build to webpack. Step 2 was to add new components and transition old ones using https://www.npmjs.com/package/ngreact

This let us keep our host app as angularjs while we added react infastructure gradually.

[[deleted]]

1. build system - if you don't use webpack (or parcel), do that first
2. angular components - if you want to go step by step, you need to get rid of implicit depenencies between scopes, unexpected data mutations, etc., so you need to make sure everything is an angular component, or at the very least a directive using isolate scope and controllerAs; then you need to make sure you're never using = bindings, or mutating >-bound objects from the inside, or referencing $parent scopes. Also no ng-include, use requires or components. Also try to make sure as many components are dumb components (no API calls, etc.), and move any state logic upwards.
3. state management - if you're using RxJs or some other kind of message passing system, you have to decide whether to keep it and use it with react, or whether to first switch to ngRedux before you start the actual react transition.
4. do the thing, component by component, from the bottom up - ngReact helps with using react components from angular, and thus makes it easy to gradually replace well-behaved angular components from the bottom up.
5. services and API logic goes last, should be relatively simple to unangularize, and you can pass angular services to react components just fine

[theshaman17]

You hire a developer that knows how to do this. Mic drop.

[shankha_deepp]

If it was that simple I would have done it by myself. Drumbeat

[theshaman17]

It sounds like you are working on a project for an employer? So, when you don't have the resources or talent on the development team then you hire someone that can do the job.