3 Mistakes that I made while learning AngularJS so you don’t.

24 January 2022

About AngularJS

AngularJS is JavaScript Framework, It is quite a weapon to have in your arsenal.It can help you build single-page applications that are maintainable and easy to read, Building an AngularJS application is a form of art itself.

I will share the 3 Mistakes I made while learning AngularJS so you don’t make them.

Mistake #1 – Follow Proper AngularJS Convention:-

One of the major reasons to choose AngularJS is its well-defined documentation, If you want to learn AngularJS from scratch then Angular documentation must be your go-to source.

Every convention is well defined in the documentation, and following those conventions not only brings uniformity to your code but also helps you and other developers to understand your code easily.

One of the most common mistakes I made was not properly naming the files, Every file name in AngularJS must consist of a name followed by structure ex: component, or service followed by file extension.

Here is the complete list of those conventions every AngularJS developer must follow.

Mistake #2 – Combine your code into Modules:-

When I started my journey of AngularJS I was adding all my files into the same App Module and as soon as those files kept increasing it took me minutes to find the correct file and then I realized that I have made a big mistake.

Modules not only make your file structure look pretty but also have countless other benefits.

Modules give you the power of lazy loading, which is a technique in angular that allows you to only load components that are required at that moment, instead of loading the whole application from the start.

In my case Modules helps me to utilize my time for coding instead of finding the files to code into.

In Angular we generally have 3 types of modules:

1. Feature Module: As the name suggests this module has the logic of a specific feature.
2. Core Module: The Core Module is used only in the root Module, Services are placed under the code module to ensure that we only have a single instance of those services to avoid breakdown.
   Ex: We put Auth services in the core module
3. Shared Module: All the Code that you want to make commonly available throughout your application is placed in a shared module.

Mistake #3 – Keep your Logic Separated:-

While making applications we all make errors and in order to fix those errors, we often need to debug our code. Looking for an error in thousand lines of code is like looking for a needle in a haystack it is unless you have separated your logic from the rest of your code.
Having your logic separated not only saves your time in debugging and is easy to read but also helps to reuse your code so that you don’t have to write the code for that header for the 836th time.