Mapping AngularJs codes to ReactJs?

There is no such thing as services in react

here are alternatives.

1. $rootscope --> state, you can share it across components. (You can use redux for state management whose philosophy is one true source of data).
2. $q --> Es6 Promise
3. $websocket --> html5 websocket.

Some thing similar to service is you can write a Class or Function which takes all the required services as params and you can call it any where by exporting it.

some similar implementation you can use for react.

In service.js

const myService = (...otherServices) => {
    doStuff1();
    doStuff2();
    return {
       ...items
    }
}
export default myService;

In component.js

you can import it

import myService from './service';
import React from 'react';
class testComponent extends React.Component {
    constructor(props){
        super(props);
        this.data = myService().getData(); //just an example.
    }
    render(){
        return (
            <div>{this.data}</div>
        );
    }
} 

$rootScope -> it is an global scope object in angular, in react we use reducers to store data which will be accessible to all components

$q-> we have q library same as $q in react

$location -> we have transition/history inside instance of class/components

$webScocket-> t here are multiple modules https://blog.pusher.com/making-reactjs-realtime-with-websockets/