What is the difference between @Directive and @Component in Angular?

Hello everyone! I just started learning Angular and TypeScript, and I got confused with the @Directive and @Component decorators. I understand that both are used to create some kind of "entities" in Angular, but I don't fully understand when to use which. For example, I created a simple component to display a button: ```typescript import { Component } from '@angular/core'; @Component({ selector: 'app-my-button', template: `{{ label }}` }) export class MyButtonComponent { label = 'Click me'; } ``` And then I tried to do the same thing through a directive: ```typescript import { Directive } from '@angular/core'; @Directive({ selector: '[appMyButton]' }) export class MyButtonDirective { // How to add template and styles here? } ``` I read that