A Hands-on Guide to Angular

Discover Angular's core concepts and advance to building a complete SPA. Gain hands-on experience by creating modules, components, forms, routing, and APIs in an e-commerce app.

Intermediate

34 Lessons

16h

Certificate of Completion

Discover Angular's core concepts and advance to building a complete SPA. Gain hands-on experience by creating modules, components, forms, routing, and APIs in an e-commerce app.

AI-POWERED

Explanations

AI-POWERED

Explanations

This course includes

33 Playgrounds

This course includes

33 Playgrounds

Course Overview

In this course, you will cover the most fundamental concepts of Angular, a popular JavaScript framework. You will learn everything about building a complete Angular app, setting up the development environment, and building your own single-page application (SPA). You’ll start off by covering the basic building blocks of Angular such as modules, components, and directives. After that, the course will introduce you to some more advanced material that focuses on forms, routing, and dealing with APIs. By the ...Show More

TAKEAWAY SKILLS

Typescript

Front End Development

Angular

Course Content

Course Overview

Get familiar with the Angular framework and build an e-commerce app.

Who is This Course for?

Introduction to the Framework

Look at Angular's powerful framework, SPAs efficiency, and the Angular CLI for project setup.

Welcome to Angular

Introduction to SPAs

Working with Angular CLI

Building Blocks of Angular

Examine Angular modules, components, directives, and services to build structured applications.

Basic Concepts in an Angular Application

Grasp the fundamentals of data binding, component communication, lifecycle hooks, and custom directives in Angular.

Binding the Data

Communicating Between Components

Component Lifecycle Hooks

Creating custom directives

Forms in Angular

Solve problems in Angular forms with template-driven, reactive forms, and custom validations.

Template-driven vs. Model-driven forms

Developing the Best Forms Using Reactive Forms

Custom Validation

Routing in Angular

5 Lessons

Tackle routing, route parameters, route guards, and lazy loading for optimized Angular navigation.

Services and Dependency Injection

2 Lessons

Practice using Angular services for component communication and dependency injection.

Dealing with APIs

3 Lessons

Try out Angular's HttpClient service, in-memory-web-api, and performing CRUD operations efficiently.

Implement the Above in a E-commerce App

4 Lessons

Get started with building an Angular e-commerce app using components, routing, services, and state management.

10.

2 Lessons

Go hands-on with creating secure authentication and login in Angular applications.

11.

Summary and Resources

3 Lessons

Apply your skills to build Angular apps, explore resources, and leverage helpful development extensions.

Course Author

Trusted by 1.4 million developers working at companies

Anthony Walker

@_webarchitect_

Evan Dunbar

ML Engineer

Carlos Matias La Borde

Software Developer

Souvik Kundu

Front-end Developer

Vinay Krishnaiah

Software Developer

Eric Downs

Musician/Entrepeneur

Kenan Eyvazov

DevOps Engineer

Souvik Kundu

Front-end Developer

Eric Downs

Musician/Entrepeneur

Anthony Walker

@_webarchitect_

Evan Dunbar

ML Engineer

Hands-on Learning Powered by AI

See how Educative uses AI to make your learning more immersive than ever before.

Instant Code Feedback

Evaluate and debug your code with the click of a button. Get real-time feedback on test cases, including time and space complexity of your solutions.

AI-Powered Mock Interviews

Put your skills to the test in a simulated interview setting. Receive personalized feedback based on your performance. Available in Premium & Premium Plus plans.

Adaptive Learning

At various checkpoints throughout Educative courses, you will be prompted to take a quick assessment. Receive a condensed curriculum tailored to your strengths and skill gaps.

Explain with AI

Select any text within any Educative course, and get an instant explanation — without ever leaving your browser.

AI Code Mentor

AI Code Mentor helps you quickly identify errors in your code, learn from your mistakes, and nudge you in the right direction — just like a 1:1 tutor!

FOR TEAMS

Interested in this course for your business or team?

Unlock this course (and 1,000+ more) for your entire org with DevPath