Bug 1574435 - [RFE] Analyse React and Angular 2.0
Summary: [RFE] Analyse React and Angular 2.0
Keywords:
Status: CLOSED NOTABUG
Alias: None
Product: Red Hat Gluster Storage
Classification: Red Hat Storage
Component: web-admin-tendrl-ui
Version: rhgs-3.4
Hardware: Unspecified
OS: Unspecified
unspecified
unspecified
Target Milestone: ---
: ---
Assignee: Neha Gupta
QA Contact: sds-qe-bugs
URL:
Whiteboard:
Depends On:
Blocks:
TreeView+ depends on / blocked
 
Reported: 2018-05-03 10:36 UTC by Neha Gupta
Modified: 2023-11-01 08:17 UTC (History)
6 users (show)

Fixed In Version:
Doc Type: If docs needed, set a value
Doc Text:
Clone Of:
Environment:
Last Closed: 2018-10-17 04:47:09 UTC
Embargoed:


Attachments (Terms of Use)


Links
System ID Private Priority Status Summary Last Updated
Github https://github.com/Tendrl ui issues 954 0 None None None 2018-05-03 10:36:01 UTC

Description Neha Gupta 2018-05-03 10:36:01 UTC
Analyze React and Angular and make recommendation for Tendrl UI management framework

Comment 2 Neha Gupta 2018-05-03 10:43:14 UTC
Analysis between React and Angular 2.0

1.New stack to learn
   - For React - learn react
   - For Angular - learn angular and typeScript

2. Performance
   - React performance is better in comparison with Angular 2.0
   - More details - https://www.codementor.io/codementorteam/react-vs-angular-2-comparison-beginners-guide-lvz5710ha#e-speed
   - Benchmark - https://auth0.com/blog/more-benchmarks-virtual-dom-vs-angular-12-vs-mithril-js-vs-the-rest/

3. Community
   - Stackoverflow and stats of github repos show that React is more popular at the moment.
   - Figures for React - https://github.com/facebook/react/stargazers
   - Figures for Angular - https://github.com/angular/angular/stargazers

4. Debugging
   - Debugging in Angular 2 is not straightforward and involves adding additional code or development extensions to the browser. Quite the opposite happens with React, where performing debugging is simpler and more straightforward.

5. Since React is a library,it is highly recommended to know the best practices. Otherwise, the result may be difficult-to-maintain applications, with performance problems and levels of low-quality. Whereas, Angular team made a strong emphasis on this aspect to provide greater transparency to the developer to make it as intuitive as possible.

6. Patternfly support
   - More for React than Angular at the moment

7. Most of the red hat products are leaning towards React - CloudForms, RHV, Satellite, OpenShift (not OpenShift.io), and OpenStack, OCP

For more details, please refer -
- http://www.hexacta.com/2017/07/24/react-vs-angular2-which-technology-should-we-use/
- https://www.bacancytechnology.com/blog/angular2-vs-react


**What it would take to migrate from Angular 1 -> React**

- Migrating the build to webpack is needed or can continue with gulp?(need to do some research)
- Render React components inside AngularJS
   - use React components inside Angular using ngReact
- Share dependencies between both sides
   - To include react dependencies in Angular, wrap the react component in directive and register it in AngularJS
   - To include AngularJS dependencies in React, create an object and a helper function to inject the dependencies and call it inside AngularJS run process.
- Integrate Redux 
- Adopt React bridge
- Move to react-router
- Migrate leaf components to React, working from the bottom up
- Migrating to JEST test framework or can continue with karma (need to do some research)

Details can be found at -
- https://trello.com/c/CMQC1iEV/1132-5-rd-react-techdebt
- https://hackernoon.com/how-to-migrate-an-application-from-angularjs-to-react-and-redux-de0e2d1f70aa
- https://www.smartly.io/blog/how-to-migrate-from-angular-to-react-without-a-massive-rewrite

 
**What it would take to migrate from Angular 1 -> Angular**

- Use Module loader - webpack/SystemJS/Browserify
- Migrate to TypeScript
   -  All existing js files can be renamed from *.js to *.ts
- Use ngUpgrade module
- Make all modules export an NgModule
   - Migrating services is usually straightforward, migrating components can require more work, depending on how the components are implemented. 

Details can be found at -
- https://angular.io/guide/upgrade
- https://vsavkin.com/migrating-angular-1-applications-to-angular-2-in-5-simple-steps-40621800a25b
- https://www.codementor.io/codementorteam/migrating-from-angular-1-x-to-angular-2-upgrade-strategies-a3fgzrhxo

@kmurarka @anbehl @smukherj Please feel free to add/suggest, which can help in deciding the front-end UI designing technologies for Tendrl UI.

Comment 4 Neha Gupta 2018-10-17 04:47:09 UTC
As the analysis is already done, hence closing the issue.

Comment 5 Gourav 2022-07-07 13:14:35 UTC
https://appwrk.com/hire/laravel-developers

Comment 6 websoptimization 2022-07-25 07:12:09 UTC
Out of all the different JavaScript frameworks available, React, and Angular 2.0 are two of the most popular. Both frameworks offer many features and benefits, but which is the best?
To answer this question, we need to look closely at React and Angular 2.0. Let's start with React. React is a popular JavaScript library for building user interfaces. It's declarative, efficient, and flexible. Plus, it works with various programming languages, including JavaScript, TypeScript, and Dart.
Now, let's take a look at Angular 2.0. Angular 2.0 is a robust JavaScript framework for building web applications. It's fast, reliable, and scales well. Plus, it offers many features and benefits, including a powerful component model, a rich template system, and a wide range of language options.
So, which one is the best? React or Angular 2.0?
There is no simple answer to this question. It depends on your specific needs and requirements. If you need a fast, reliable, and scalable framework, then Angular 2.0 is the best choice. If you need a declarative, efficient, and flexible library, then React is the best choice.

For more details, please consider,
https://www.websoptimization.com/blog/best-angular-component-libraries/
https://www.websoptimization.com/blog/whats-new-in-react-native-0-60/

Comment 7 Navjot Kaur 2023-11-01 08:17:05 UTC
I think both are good at its own place and have their own importance in the field of development.
For more details:
click on
https://gcspatiala.co.in/wp/website-designing-company-in-mohali/


Note You need to log in before you can comment on or make changes to this bug.