3d cartoon hands holding a phone

Unlock full course by purchasing a membership

Lesson 1

The best way to learn Angular?

An introduction to the philosophy and goals of this course

STANDARD

Welcome!

Hello and welcome to Angular Start! This course will teach you everything you need to know about Angular, from the basics right through to building complete professional-grade applications.

Our goal here isn’t just to learn the bare minimum to get up and running, it is to build a solid foundation of knowledge and modern best practices that are used by highly skilled professionals today.

But there’s a problem…

There are two distinct ways that you can go about learning Angular: one easier and one harder.

The easier approach uses a more intuitive imperative style of programming, whilst the harder approach uses a reactive/declarative style of programming that can be harder to wrap your head around initially but pays off in a big way in terms of developer experience and code quality.

We can broadly think of the imperative approach as being easy and then hard, whereas the declarative approach is hard and then easy.

No idea what these terms mean? Imperative and declarative? Don’t worry, we’ll get to that later. I am just trying to make a point here as to why we are going to learn the “hard” way.

The easier approach is quicker and easier to learn for most people (naturally), but the harder approach is how — at least in my opinion — the best Angular developers today build their apps. I used the imperative approach for more than a decade before beginning to code the declarative way, and it has made me enjoy programming a lot more. I write better code, with less bugs, that is easier to understand and maintain.

The problem is that these two styles are so different, that it’s not a simple shift from one to the other. A lot of the time we can start the easy way and then build up to the harder way — but that’s not really the case here. Starting with the easier approach is going to lead you to learn quite a lot that you will need to unlearn later when switching to the other approach — it requires a completely different mental model.

It’s always going to be a bold claim to say that one approach is “better” than another. But, I do strongly believe that the approach we will be learning is the approach that is best for Angular applications. It is an approach that works with concepts that are deeply baked into Angular. Once you get the concepts down it becomes much easier to code this way, because in a sense you are using Angular the way it was designed to be used.

At least in my view, Angular developers will tend to move toward the “hard way” as their skills with the framework improve. But there is no reason why you can’t start down that path immediately.

What does the “best” approach look like?

Maybe you already have some Angular knowledge, or maybe you are a complete beginner. In any case, I don’t want to dive too deep straight away into what the difference between imperative and declarative is, or what coding reactively means, or what the benefits of RxJS and observables are. We will build these concepts up over time and explain them as we go.

But, I don’t want to just leave you with this wishy-washy notion of the easy way and the hard way (which I am claiming is the “best” way) to create Angular applications.

This is a general outline of the concepts we will be using to create our applications, which you might not find in a more typical approach to building Angular applications at a beginner/intermediate level.

These are the concepts that make this the “hard” way:

  • Reactive/Declarative style coding
  • RxJS Operators
  • TypeScript strict mode
  • Smart/Dumb component architecture
  • Feature based project structure
  • SOLID programming principles

Again, maybe you are already familiar with some of these concepts, maybe you’ve never heard of any of them. Either way, it doesn’t matter at this point. We are going to address all of these in detail throughout the course as we learn the standard Angular concepts like:

  • Components
  • Services
  • Signals
  • Templates
  • Dependency Injection
  • Forms
  • Change Detection
  • Decorators
  • Routing
  • Styling
  • …and a lot more

A quick test!

What?! We haven’t even learned anything yet. Throughout this course, you will find little quizzes like this to help reinforce things we learn in particular lessons. Usually, these will be used to test your knowledge. However, for now, this is going to serve as a little check to make sure you have the prerequisite knowledge to complete this course.

If you answer No for any of these, it doesn’t mean that you can’t start the course. However, you may need to seek out additional resources as these are concepts that will not be explained in this course.

I understand the basics of HTML/CSS

I understand the basics of programming with modern JavaScript

I have used a terminal/CLI and am at least somewhat familiar with npm