Implement Components

Hi Friends, This is Lakshman here.

As part of the Series "Angular Best Practices".

Today, We will go through Practices to be followed for Implement Components

Component

In Angular Application, Only things interact with End Uses are Components via HTML.

Things to know

• There are many ways to Use a Component,
  • Main Component (May uses Both Shared & Entry Components)
  • Shared Component (Such as Header, Footer, Menu's, etc.)
  • Entry Component (Used for Dialog, Panels, etc.)
• Required to know Life-Cycle of Components. Such Life-Cycle are
  • OnChanges
  • OnInit
  • AfterContentInit
  • AfterViewInit
  • OnDestroy, etc.,

Things to do

• Keep components small and function-specific.
• Components should only deal with display logic.
• Avoid logic in templates.
• The code should execute as expected and be testable.
• All files related to the component should be in a single folder.
• Follow linting rules, break up lines that are too long.
• Avoid having subscriptions inside subscriptions.
• Always remove un-used modules from code.
• Structure Code using #region.
• Don't Initialize Value for Variable on Declarations, instead use ngOnInit to Assign Values for Variables
• If your component uses Forms, always create formGroup using FormBuilder instead of using ngModel
• If working with ngFor always use trackBy

On-road head, we will discuss a lot of things.

Looking forward to your comments and share your feedback.

Until that, I am Lakshman, Signing Off.