Complete Angular Course 2024 – Master Angular in only 6 days

About Course

Learn Angular from scratch and in depth in just 6 days with this comprehensive course. **Completely free** and available on platforms like Udemy, Udacity, Coursera, MasterClass, NearPeer, and more, this course is perfect for busy developers and anyone wanting to learn Angular quickly.

This course will teach you how to:

Build robust front-end applications using Angular
Create maintainable applications with Angular components, modules, and services
Leverage essential Angular features for building real-world applications
Communicate with web servers for data posting, retrieval, and deletion within your Angular application
Utilize the latest features like Angular Signals and Effects

This course covers:

Setting up the Angular development environment
TypeScript overview
Angular CLI
Components
Modules
Services (Injection and provider scopes)
Validation
Data Binding
Adding Packages
Routing
Template Driven Form Binding (NgModel)
Pipes
Angular Material
Building web apps with user experience (UX) in mind

You will also learn advanced concepts like:

NgRx for building reactive web applications
State management using actions, reducers, store, effects, and selectors
Reactive extensions like observables for asynchronous tasks
Unit Testing using Karma and Jasmine
HTTP RESTful API communication
Setting up Mock servers using Mockoon
Global Error Handling
Directives
Sending Data to Child Components (Input binding)
Sending Data to Parent Components (Output binding)
Smart vs Presentational Components
Component and Directive Selectors
Angular Signals
Angular Effects

Enroll now and master Angular in just 6 days!

Learn Angular in-depth in a short amount of time
Build comprehensive web apps like an e-commerce store
Use Angular components, services and modules to create a maintainable code base
Use NgRx to build reactive web applications using state management
Write Unit Tests using Karma and Jasmine to test your Angular applications
Learn how to communicate with web servers for posting, getting, or deleting data
Setup a real-world mock evironment
Use the latest features like Angular signals and effects

Course Content

1 – Introduction to Angular and TypeScript

A Message from the Professor
001 – How you easily master Angular.mp4

00:00
002 – Before you get started.html

00:00
003 – Angular building blocks.mp4

00:00
004 – What you will build.mp4

00:00
005 – Source Code Appointment App.html

00:00
006 – Building Angular applications in a web browser.mp4

00:00
007 – Installing Nodejs and Visual Studio Code.mp4

00:00
008 – Installing the Angular CLI.mp4

00:00
009 – Creating and serving an angular application.mp4

00:00
010 – Angular under the hood.mp4

00:00
Section Quiz

2 – Components DataBinding and the general development process

011 – Components.mp4

00:00
012 – Creating the appointmentlist component.mp4

00:00
013 – Introduction to typescript.mp4

00:00
014 – Oneway data binding with appointment property.mp4

00:00
015 – Creating an appointment interface.mp4

00:00
016 – Visual Studio Code Angular extension.mp4

00:00
017 – Adding twoway data binding.mp4

00:00
018 – Adding a button click event listener.mp4

00:00
019 – Adding an appointment to the array.mp4

00:00
020 – Adding an appointment list using ngFor.mp4

00:00
021 – Removing appointments.mp4

00:00
022 – Storing appointments in the local storage.mp4

00:00
023 – Using ngOnInit to load appointments from local storage.mp4

00:00
024 – Adding bootstrap.mp4

00:00
025 – Styling the application.mp4

00:00
026 – The most commonly used commands in Angular

00:00
027 – Angular-Components-Handouts.pdf

00:00
Section Quiz

3 – Services Forms Form Validation and Routing

028 – The hotel reservation app.mp4

00:00
029 – Source Code.txt

00:00
030 – Creating the hotel app project.mp4

00:00
031 – Project architecture hotel app.mp4

00:00
032 – Creating all modules services and components.mp4

00:00
033 – Creating the reservation interface.mp4

00:00
034 – Creating routes.mp4

00:00
035 – Building a simple navigation.mp4

00:00
036 – Creating a form group.mp4

00:00
037 – Creating the reservation form.mp4

00:00
038 – Validating a form using reactive form validation.mp4

00:00
039 – Dynamically toggle html attributes based on form state.mp4

00:00
040 – Showing validation messages.mp4

00:00
041 – Creating the reservation service.mp4

00:00
042 – Injecting the reservation service into the form component.mp4

00:00
043 – Using the localStorage in the reservation service.mp4

00:00
044 – Showing all reservations in a list.mp4

00:00
045 – ngtemplate and local reference.mp4

00:00
046 – Using the router navigate method to redirect the user.mp4

00:00
047 – Deleting reservations.mp4

00:00
048 – Creating unique ids for reservations.mp4

00:00
049 – Adding the edit route with parameter.mp4

00:00
050 – Editing reservations.mp4

00:00
051 – Combining components from different modules.mp4

00:00
052 – Styling the home component.mp4

00:00
053 – Styling the reservation form component.mp4

00:00
054 – Styling the reservation list component using a table.mp4

00:00
055 – Angular-Modules-Handouts.html

00:00
Section Quiz

4 – Reactive programming with Observables HTTP and Mock APIs

056 – Modern web architecture.mp4

00:00
057 – What you will create during this section.mp4

00:00
058 – Using Mockoon as a mock backend api.mp4

00:00
059 – Preparing the project for the mock backend api.mp4

00:00
060 – Calling the mock api using the http client and observables.mp4

00:00
061 – Returning reservations from the mock api.mp4

00:00
062 – Setting up all mock api endpoints.mp4

00:00
063 – Finishing all CRUD operations with observable implementation.mp4

00:00
064 – Handout Observables.html

00:00
Section Quiz

5 – Building an ecommerce web application

065 – Project overview.mp4

00:00
066 – Angular-AmazingAnimalPaiting-Material.zip

00:00
067 – Switching to a new angular version.mp4

00:00
068 – Creating the product module service and component.mp4

00:00
069 – Creting the product class and clearing the template.mp4

00:00
070 – Setting the product route.mp4

00:00
071 – Setting up the mockoon api.mp4

00:00
072 – Creating environments.mp4

00:00
073 – Getting products from our product service.mp4

00:00
074 – Product list displaying products.mp4

00:00
075 – Serving for environments.mp4

00:00
076 – Installing angular material and exploring cards.mp4

00:00
077 – Creting matcards for products.mp4

00:00
078 – Applying the angular material style and product images.mp4

00:00
079 – Responsive product grid.mp4

00:00
080 – Adding an eyecatching hover effect.mp4

00:00
081 – Adding a container css class.mp4

00:00
082 – Adding a navbar.mp4

00:00
083 – Adding a description.mp4

00:00
084 – Creating the cart module component and service.mp4

00:00
085 – Setting up the cart service methods.mp4

00:00
086 – Getting all cart items.mp4

00:00
087 – Using matlist for cart items.mp4

00:00
088 – Calculating the total cart price.mp4

00:00
089 – Adding the clear cart and checkout button.mp4

00:00
090 – Exercise Adding the checkout logic.mp4

00:00
091 – Adding products to cart and popup.mp4

00:00
092 – Adding the search functionality Part 1.mp4

00:00
093 – Adding the search functionality Part 2.mp4

00:00
094 – Adding the sort functionality.mp4

00:00
Section Quiz

6 – NgRx Building reactive web applications with Angular

095 – The problem NgRx can solve.mp4

00:00
096 – NgRx explained.mp4

00:00
097 – Creating a project for our reactive application.mp4

00:00
098 – Creating the application state.mp4

00:00
099 – Creating actions for adding and deleting books.mp4

00:00
100 – Creating the book reducer part 1 Creating a reducer.mp4

00:00
101 – Creating the book reducer part 2 Change functions.mp4

00:00
102 – Creating the store.mp4

00:00
103 – Creating a component and methods to dispatch our actions.mp4

00:00
104 – Loading books from the store.mp4

00:00
105 – Using the AppState interface for type safety.mp4

00:00
106 – Creating the UI to see our reactive application in action.mp4

00:00
107 – NgRx effects recap.mp4

00:00
108 – Creating success and failure actions.mp4

00:00
109 – Adjusting the reducer for effects.mp4

00:00
110 – Creating the service for the effect.mp4

00:00
111 – Creating the effect part 1.mp4

00:00
112 – Creating the effect part 2.mp4

00:00
113 – Registering the effect and using Angular Dev Tools to test the application.mp4

00:00
Section Quiz

7 – Unit Testing Angular applications with Karma and Jasmine

114 – Unit Testing in Angular.mp4

00:00
115 – Creating our first unit test.mp4

00:00
116 – Running unit tests using Karma.mp4

00:00
117 – Creating a service to test.mp4

00:00
118 – Unit testing the service.mp4

00:00
119 – Creating a component to test.mp4

00:00
120 – Component fixture for unit testing.mp4

00:00
121 – Handling dependencies for component tests.mp4

00:00
122 – Testing a component property that loads from ngOnInit.mp4

00:00
123 – Testing a components UI functionality.mp4

00:00
Section Quiz

8 – Your Angular Exercise

9 – Bonus

Add this certificate to your resume to demonstrate your skills & increase your chances of getting noticed.

Student Ratings & Reviews

No Review Yet

About Course

What Will You Learn?

Course Content

1 – Introduction to Angular and TypeScript

A Message from the Professor

001 – How you easily master Angular.mp4

002 – Before you get started.html

003 – Angular building blocks.mp4

004 – What you will build.mp4

005 – Source Code Appointment App.html

006 – Building Angular applications in a web browser.mp4

007 – Installing Nodejs and Visual Studio Code.mp4

008 – Installing the Angular CLI.mp4

009 – Creating and serving an angular application.mp4

010 – Angular under the hood.mp4

Section Quiz

2 – Components DataBinding and the general development process

011 – Components.mp4

012 – Creating the appointmentlist component.mp4

013 – Introduction to typescript.mp4

014 – Oneway data binding with appointment property.mp4

015 – Creating an appointment interface.mp4

016 – Visual Studio Code Angular extension.mp4

017 – Adding twoway data binding.mp4

018 – Adding a button click event listener.mp4

019 – Adding an appointment to the array.mp4

020 – Adding an appointment list using ngFor.mp4

021 – Removing appointments.mp4

022 – Storing appointments in the local storage.mp4

023 – Using ngOnInit to load appointments from local storage.mp4

024 – Adding bootstrap.mp4

025 – Styling the application.mp4

026 – The most commonly used commands in Angular

027 – Angular-Components-Handouts.pdf

Section Quiz

3 – Services Forms Form Validation and Routing

028 – The hotel reservation app.mp4

029 – Source Code.txt

030 – Creating the hotel app project.mp4

031 – Project architecture hotel app.mp4

032 – Creating all modules services and components.mp4

033 – Creating the reservation interface.mp4

034 – Creating routes.mp4

035 – Building a simple navigation.mp4

036 – Creating a form group.mp4

037 – Creating the reservation form.mp4

038 – Validating a form using reactive form validation.mp4

039 – Dynamically toggle html attributes based on form state.mp4

040 – Showing validation messages.mp4

041 – Creating the reservation service.mp4

042 – Injecting the reservation service into the form component.mp4

043 – Using the localStorage in the reservation service.mp4

044 – Showing all reservations in a list.mp4

045 – ngtemplate and local reference.mp4

046 – Using the router navigate method to redirect the user.mp4

047 – Deleting reservations.mp4

048 – Creating unique ids for reservations.mp4

049 – Adding the edit route with parameter.mp4

050 – Editing reservations.mp4

051 – Combining components from different modules.mp4

052 – Styling the home component.mp4

053 – Styling the reservation form component.mp4

054 – Styling the reservation list component using a table.mp4

055 – Angular-Modules-Handouts.html

Section Quiz

4 – Reactive programming with Observables HTTP and Mock APIs

056 – Modern web architecture.mp4

057 – What you will create during this section.mp4

058 – Using Mockoon as a mock backend api.mp4

059 – Preparing the project for the mock backend api.mp4

060 – Calling the mock api using the http client and observables.mp4

061 – Returning reservations from the mock api.mp4

062 – Setting up all mock api endpoints.mp4

063 – Finishing all CRUD operations with observable implementation.mp4

064 – Handout Observables.html

Section Quiz

5 – Building an ecommerce web application

065 – Project overview.mp4

066 – Angular-AmazingAnimalPaiting-Material.zip

067 – Switching to a new angular version.mp4