Complete Angular Course 2025 - Master Angular in only 6 days

Create a new Angular project named Hotel Dash app with routing, run ng serve -o, clean the template to keep the router outlet, and begin building components, modules, and services.

Create a reservations interface in Angular to model hotel bookings, stored in a models folder with id, check-in/out dates, guest name, and email, and an optional room number.

Attach an ng submit listener to reservation form and implement on submit. Create inputs for check-in date, check-out date, name, email, and room number with form control names and validation.

Create and manage reservations with an Angular reservation service that stores data in an array and implements CRUD operations (get all, get one, add, update, delete) via dependency injection.

Learn to use ng-template with a local template reference and an ng if directive to conditionally render the reservations list or a no reservation message, improving user experience.

Learn to style a reservation form component using Bootstrap classes, including form-control, btn-primary, form-label, validation messages, and responsive grid layout for fields like check-in, check-out, guest info.

Style the reservation list as an HTML table with thead and tbody, looping rows with ngFor to display guest name, email, room, check-in, and check-out using Bootstrap table and buttons.

Master modern web architecture with angular, learning how front-end apps use http requests and observables to interact with backend APIs via restful services and asynchronous data flow.

Turn your hotel reservation platform into an Angular app using a real mock API with Mockoon, and learn to send HTTP requests via observables in a service for production-ready apps.

Use Mockoon to create a mock backend API for an Angular front end, exposing a /reservations endpoint on port 3000 that returns Hello world.

Prepare an Angular app to connect to a mock backend API, replacing local storage with a backend data flow via the Http client and observables.

Import the http client module, configure the base api url http://localhost:3000, and send a get request to /reservations returning an observable of reservations to be subscribed in ngOnInit.

Show how the product list component fetches products on init by injecting the product service, subscribing to the getProducts observable, and binding results to a products array for ngFor rendering.

Add a hover effect to product cards by scaling the mat-card and showing a pointer cursor. Implement a 0.2 second transition and introduce a container class to offset content.

Extend your product list with search and filter features using Angular Material form controls. Implement a case insensitive search by name and filter by price with input and select components.

Learn to add sorting in Angular by using the Angular Material select, tracking sort order, and sorting the filtered product list by price low-to-high or high-to-low.

Explore reactive development concepts like states, stores, and reducers on day five of the angular course. Build a reactive book management web app using angr with hands-on learning.

Learn how NgRx solves the problem of coordinating data across components with a single source of truth and a flux pattern for reactive Angular apps.

Create add book and remove book actions for the book entity using create action and props. Connect these actions to the reducer to process adding and deleting books.

Set up the global store by registering the book reducer in the root store module, tying actions and current state to a new state.

Apply the app state interface to enforce type safety across the store, ensuring the book property is an array and maintaining immutability in reducers.

Set up a home route to display the book list, render books with async pipe, and add or remove books by dispatching actions to the store.

Explore NgRx effects by building a book service and two actions for success and failure. Connect reducers and component subscriptions to manage data flow.

Learn to set up angular effects by creating a book effects class, injecting actions$ and a book service, and implementing an add book effect with createEffect and ofType.

Master unit testing in angular using jasmine and karma, testing components, services, and pipes, writing specs with describe and it, and running ng test for regression prevention.

Create your first unit test in Angular by scaffolding a new project, writing a spec for the app component, and using Jasmine expectations to verify a defined title.

Create a real-world unit test by building a user service in Angular, implementing getUsers that returns an observable of sample users, and testing that the service returns users.

Create and test an Angular user list component. Implement ngOnInit to fetch users from a service, render with ngFor, and include a refresh button with unit tests.

Isolate an Angular unit test for a user list component by spying on the user service's getUsers method with Jasmine and returning mock data via RxJS of, configured in beforeEach.

Learn angular signals, a reactive wrapper that notifies consumers and enhances change detection with a push approach, illustrated by a dark mode toggle and total price from price and quantity.

Use Angular signals and effects to run code when the signal value changes, update a label with the theme, and toggle dark mode through a constructor-based effect.

Master a real-world angular signals workflow by importing the common module, using signal and computed, and filtering a products array with ng4 and ng for.