Angular Over React?

I know right now you are thinking "Is he mad?" "Has he gone crazy?" "Why on Earth would someone that has been using React for almost the past 3 years decide Angular is the winner?" Well I will tell you why. As I mentioned above I have been using React for almost 3 years now. I love React. However I also really love TypeScript. I know that you can use TypeScript with React and that it's not as hard to implement as one might think. TypeScript works well with React. The problem that I have with React isn't that it's terrible or that Angular is better and you should stop using React right this second. My post isn't even meant to persuade you to use Angular over React if you are already using React. My purpose is to just say why I prefer Angular over React and see if I can help someone out who might be struggling with which one to pick.

So Why Choose Angular?

First and foremost I have chosen Angular because it uses TypeScript by default and has basically since it's inception. Which is pretty cool. The other reason is it's a platform not necessarily a framework. Which means I can use it to build out my web site. Then run a quick little command to convert this code to a PWA, for those that aren't sure what that stands for it's Progressive Web App, which allows one to download the website as a mobile app without having to use the play store or app store. Which is pretty cool. But the main reason. Numero uno if you will is because I use NestJS as my backend framework. It's a great framework that has everything one would need to create a scalable, enterprise level application or website that could easily go up against something you would see with Java and Springboot.

NestJS?

For those that have seen NestJS or have heard of it but aren't sure if they should use it or not I will give you a brief run down of the framework. The framework is modeled after Angular. There is a CLI just like Angular CLI that allows you to generate all of the files that you will need for your project as well as the directories/folders for your files to reside in. All by running a simple command from your terminal. It makes productivity much much faster. If you have ever worked with say Ruby on Rails or even Django you know that having a framework scaffold much of your code and handle creating new files from easy to use commands on your terminal speeds up your ability to create code and get that project finished a tad bit faster than if you were to create everything from scratch. Pretty awesome right? Nest also has built in libraries for just about everything. Need to use an ORM to connect to a database? It's there and has support for it already.

Back to Angular

Now back on the subject of Angular, after using NestJS for a year now and seeing my back end skills and speed improve from using the framework I wanted to give Angular another shot. A few years ago I created a basic Angular application which was actually a lot of fun. However I was stuck on React at the time. I liked how simple it was to use React. You didn't have to create a bunch of HTML files or anything like that. So I went back to React and that was that. Nest made me appreciate the CLI and when I found out that Angular does the same thing I realized that I would be able to speed up my production time as well as hopefully improve my skills on the front end if I switched. I started reading a few books on Angular. YouTube tutorials were somewhat helpful depending on the year they were made. I might have had to do some Googling to solve a few issues I was having since the YouTube videos weren't updated for the latest version of Angular. But that's all part of the process. By figuring that out I was able to gain knowledge for the next time I needed to implement something in my project or a new project for that matter. You almost have to do that with any framework you choose.

Hooking Nest to the Front End

Nest is a great back end framework as I mentioned earlier it has a lot of features one of those features that, unless you use Angular, you might not know about is something called Angular Universal. This allows you to embed your Nest back end code with your Angular front end code into the same repo. Now I didn't know about this I was using React of course and I am still learning about this feature for Angular and Nest to be joined together. The process is supposed to be seamless. I have watched a few examples of it and it's almost like magic. React does not have this luxury. It was a huge pain in the you know what for me to get my front end with React and TypeScript to talk to my back end with Nest. It wasn't impossible as it is working however it was definitely not as easy as the Angular to Nest join with Angular Universal. I know what you're thinking, "But Jonathan, you said that Nest is modeled after Angular. Wouldn't it make sense for them to be easy to connect both pieces together?" Technically yes. But when I first started using Nest, as my boss was the one that mentioned using it and after watching a few tutorial series on it, didn't mention the Angular aspect of Nest and why the framework does things the way it does. It wasn't until about 4 months in that I found that out. Do I think that we made the wrong choice for the project? No, React is a great library to use for creating your front end apps. However the ease of connecting your Nest back end with an Angular front end is too awesome to not be acknowledged as a reason to use Angular over another framework if you are using Nest.

What Framework Is Better?!

There isn't really a one framework fits all type of situation. However if you master one framework then you can make it work for all of your needs. However, if you are looking for a front end framework to start with because you are new to web development I would say learn Vanilla JavaScript first. Become very proficient using no framework. Then try to learn a bit of TypeScript and recreate what you did with JavaScript with TypeScript. Once you have sufficient knowledge of both then it's time to pick a framework/library. The choice you make should be determined by whether or not you like TypeScript. If you do then I would suggest Angular and use Nest as your back end framework. The two go hand in hand. The concepts used to create your files and structure are the same in both front and back end frameworks. If you aren't using Nest as the back end framework of choice then you could definitely still choose Angular as your choice but React is just as good of a choice. However if you aren't interested in TypeScript and you only want to use JavaScript then I would definitely say that you would be better off choosing React.

Conclusion

At the end of the day the framework of choice doesn't really matter. What matters if whether or not you are comfortable learning the framework of choice. Go to the official pages for React: https://reactjs.org/ and Angular: https://angular.io/ and look over the examples in the get started section for each. Make sure you are comfortable reading the examples and understand what is going on in the code and make your choice by which one seems more readable to you. As always enjoy.