Switching to angular after working with react?

This is the world of javascript frameworks right! Numerous frontend frameworks are available and there is a good chance that when you move to a different project or switch to a different company the framework being used is different. It is important to be flexible and be comfortable working with multiple frameworks because all these frameworks have one thing in common: JAVASCRIPT

In this article I have added some points which might be helpful if you are switching from react to angular.

One of the first thing you might have noticed is that in angular, typescript is used. If you do not have experience with typescript then there is no need to worry. You can disable typechecks easily.

The second major difference is that react uses JSX whereas in angular pure HTML along with a few angular-based attributes are used. So be ready to use class instead of className.

To create a component in react, we simply create a corresponding js file along with any supporting files (like .css). In angular we have to runng g c <name> to create a component. This basically generates a component in the current directory. By default it creates four files:

.html file

.ts file

.css file (or .scss depending upon your selection while creating the angular project)

.spec.ts file You can ignore the .spec.ts or even delete it at the beginning Unlike React the UI and the supporting Javascript and its functions are in two separate files (.ts and .html)

Another thing you which I have observed is that attributes in angular is very important. All the conditional rendering and loops used in the UI is done using angular-specific attributes. Here's a really good example:
Suppose you want to display all the names in an array using a <li>. In react one can directly use a forEach like this:

Whereas in angular you have to use *ngFor attribute:

For making API calls, I use either fetch or axios and write the code in the component itself. For larger applications I make a custom http hook and reuse it. In angular we use the httpModule and unlike react all the api calls for a component are written in services.
Same as components in angular we need to generate services using ng g s <name>. This creates a service file and then add your api calls in this file.
To use the api calls in our component we just need to import the service file.
Here's a sample service file:

Now one can import this service file in component and use it this way:

You might see a function block called ngOnInit(). This function is executed every time the component is loaded on the page.

These were some of the basic differences which might help you to start with angular.
Let me know if you want to add something!