Angular Fast Crash Course

Explore the anatomy of an Angular component, including the component decorator, selectors, templates, and styles, and learn how to import, export, and initialize data via the constructor.

Learn how to manually generate an Angular component from scratch, including creating files, importing, exporting, defining templates, and registering the component in declarations.

Use the cli to generate components quickly with ng generate, which creates the component, its directory, imports, and a pre-configured decorator, along with optional testing files and lifecycle examples.

Master string interpolation in Angular by binding data in templates with curly braces, and conditionally display a city using a ternary expression.

Learn to master Angular event binding by wiring a click handler to a button, attaching a method to perform actions like greeting or logging data.

Continue learning Angular by implementing mouseover, mouse enter, and key down events, styling with classes and ids, and wiring interactive components.

Master two-way databinding in Angular by combining property and event binding with ngModel to keep frontend inputs in sync with backend data through the forms module.

Explore structural directives in Angular by using ngIf to conditionally display elements, bind booleans, and implement else blocks with template references.

Learn to loop through data in Angular using ngFor, iterating an array of objects and displaying titles. Understand that ngFor is a structural directive and syntactic sugar.

Learn to style Angular components with directives by applying dynamic colors based on user status, using conditional logic and the ternary operator, and pulling data from a database or API.

Learn how to use the ng class directive to conditionally apply an active class based on a status flag, and see how Angular updates styles reactively across a component.

Learn to create a bootstrap-styled Angular form with form groups, placeholders and labels, add a submit button, and install and link bootstrap CSS via npm for styling.

Explore submitting data in Angular forms using ngModel two-way binding, the forms module, and the submit event to pass form data to the component without a full page refresh.

Attach a template reference to the form, import the angular forms module, and convert the html form into an ngForm object to access values and enable validation.

Learn how to pull values from a template-driven angular form, using name attributes and ngModel to build a user object with username and password, and prepare data for API submission.

Create a dynamic routing system in Angular that updates page content without a full page refresh, using Bootstrap navigation templates and example links like home and contact.

Register modules and set up a router in an Angular app by importing the router module, defining routes for home and contact components, and generating those components.

Learn to set up Angular routes, dynamically generate navigation in the main app component using router outlet, and enable seamless page changes without full page reloads.

Discover how to prevent page refresh by using the router link in Angular, enabling seamless, dynamic navigation across components and binding links with square brackets to connect to back-end data.

Register HttpClientModule in Angular by importing the HttpClient and injecting it into a component to perform get, post, put, and patch requests against a placeholder API.

Learn to display API data in an Angular app by looping through posts with ngFor, binding userId, id, and title into a Bootstrap table, with functional navigation.

Learn how to send post requests in angular with the http client, including posting data, subscribing to the response, and handling errors.

After completing the Angular course, follow a free six-course path on TypeScript and Angular, then explore the server-side JavaScript course with MongoDB and Express.