angular-material-course is the finished Angular Material app behind a video course

One repository, two branches, and a deliberate choice about which to clone

The repository contains the code of the Angular Material In Depth video course, and the first thing the README explains is the branch layout, because cloning the wrong one changes what you get.

The 1-start branch contains the starting point of the course. The master branch contains the final version of the course code, that you can use as a reference if you choose to code along.

That is a deliberate framing. A course repository where the default branch is the finished code is a reference implementation, not a template, and the README is explicit about the intent. If you are working through the course, you want 1-start and you write the code yourself. If you want to see how a Material application is put together end to end, master is the branch.

The repository has been updated to Angular 22, which is stated at the top of the README, and the dependency list in package.json confirms the move. Every @angular package sits at 22.0.0 or above the caret, @angular/material and @angular/cdk are both ^22.0.0, and the build tooling follows with @angular-devkit/build-angular and @angular/cli at ^22.0.0. The TypeScript version is 6.0.3.

So the code here reflects the current generation of Angular rather than the one the course was first recorded against. That is the single most useful thing to know before you spend an afternoon reading it, because much of what Angular Material tutorials show has changed shape in the last few major versions.

A frontend that needs a backend, and why the proxy config matters

The application is not a static demo. It has two halves, and the README is explicit that the frontend connects to a simple Node server that also runs on your local development machine.

The backend is started with its own npm script:

    npm run server

The package.json shows what that script does: it runs tsx with the server's own tsconfig, tsx --tsconfig ./server/server.tsconfig.json ./server/server.ts. So the sample backend is TypeScript executed directly through tsx rather than compiled to JavaScript first, and the repository has a server/ directory holding both the source and the separate tsconfig it uses.

The frontend is then started with the Angular CLI through npm:

    npm start 

And here the README attaches the instruction that matters most in practice: make sure to use command npm start and not ng serve, as npm start adds a couple extra options that are needed for our project. The package.json shows what those options are. The start script is ng serve with a proxy config, ng serve --proxy-config ./proxy.json, and the repository carries a proxy.json file at the root.

That is the whole mechanism for connecting the two halves. The Angular dev server proxies API calls through the proxy configuration to the Node backend, which means the frontend code can call relative URLs and never needs to know the backend's host and port. This is a standard Angular CLI arrangement, and it is the kind of detail that is invisible in a screenshot and fatal when missing, because every data request goes to the wrong place.

The reason to run npm start rather than ng serve is therefore not stylistic. The proxy configuration is what makes the sample application work.

Installing with npm ci, and the Node version the project expects

The installation instructions are short, and two details in them are worth not skipping.

The prerequisite is stated as important: please use Node 24 LTS, the Long Term Support version. The repository does not pin an engines field in package.json, so this is guidance rather than something the toolchain will enforce for you.

The Angular CLI is installed globally with npm install -g @angular/cli. Then the repository is cloned and its dependencies installed:

    git clone https://github.com/angular-university/angular-material-course.git
    cd angular-material-course
    npm ci

The README then adds a note about why the last command matters: it recommends using npm ci, instead of npm install, because this will ensure that you use the exact dependency versions set on package-lock.json, unlike npm install which might potentially change those versions.

That recommendation is well founded for this particular project. The package.json pins a set of versions that are known to work together, including an rxjs at 6.5.4 alongside a zone.js at ~0.15.0 and a core-js at ^2.4.1, with moment and @angular/material-moment-adapter present for date handling. Angular 22 with a legacy RxJS version is exactly the kind of combination where a resolver picking up a different patch release can change behaviour, and the lockfile is the thing that keeps the sample running as the course presents it.

The repository root shows what else is there. There is an angular.json for the workspace, a tsconfig.json, a proxy.json for the dev server, an .editorconfig and a .browserslistrc. There is an e2e/ directory alongside a protractor.conf.js and a karma.conf.js, and a tslint.json. The .mcp.json at the root and the INIT.md file are newer additions to the tree that the README does not describe, and the package.json scripts give the full command surface: ng, start, server, build, test, lint and e2e.

What the repository shows that a tutorial normally would not

The value of a finished course repository is different from a tutorial, and it is worth being precise about where the extra value comes from.

A tutorial shows you a component. A finished repository shows a component in the context of everything around it: how the Material component is wired to a real backend, how the modules are structured, how the data flows. The presence of a server/ directory with its own tsconfig, and of a proxy.json that routes between them, means the sample application is a working application rather than a set of isolated screens.

The scripts also tell you what the course covered. There is a test script running ng test, a lint script, and an e2e script, so the codebase includes the tooling for unit and end-to-end testing with Karma and Protractor rather than just the feature code. The e2e/ directory and protractor.conf.js at the root are from the era when Protractor was the default, and the karma.conf.js with the jasmine packages in the devDependencies is the unit test side.

The dependency set is also a description of what the course touched. Beyond @angular/material and @angular/cdk, there is @angular/forms, @angular/router, @angular/animations and @angular/platform-browser-dynamic, plus @angular/material-moment-adapter with moment for date pickers. cors and express are the backend's own dependencies. If you are wondering which parts of Angular Material the sample actually exercises, the dependency list answers it: forms, routing, animations, date handling and the component kit itself.

One thing the repository does not offer is the teaching. The README is an installation and orientation document, not a lesson. The value is in the code being the finished state of an explanation you can watch, and in having every layer of a real Material application present in one tree.

Where this repository is the wrong thing to reach for

There are clear cases where this is not what you want, and the README itself rules out the most obvious one.

If you are starting a project, this is the wrong repository. The README points you at the 1-start branch for that, and even that is a course exercise rather than a project skeleton, with a sample backend for natality-style data that you would delete. Building an Angular application with Material starts with ng new and ng add @angular/material, and the Angular CLI generates the workspace for you, which is a different thing from what is here.

If you are looking for the Material documentation, this is also the wrong place. The course code shows usage, not the API surface, and the versions of Angular Material have moved on considerably since the course was first made, which is why the README has had to keep updating the repository to Angular 22. A snippet from a course repository is a snapshot of one instructor's approach at one point in time, and Material's API has churned considerably across the versions.

The third case is version mismatch. The package.json pins rxjs at 6.5.4, which is a long way from the current major version, and combines it with zone.js at about 0.15.0 and TypeScript 6.0.3. If your own application is on a current RxJS and you copy patterns from this code, the reactive idioms will not transfer cleanly, and the zone.js dependency tells you the sample is not using the zoneless change detection that the newer Angular University courses cover.

For comparison, the alternatives differ in what they give you. The official Angular Material documentation and the live examples on the Material site show the current API with no application around it. The Angular CLI schematic scaffolds a project with Material wired in, which is the right starting point if you are building something. The other Angular University courses cover the same ground with the Signals-based versions of Angular, and the README's own course list points at those as the current material. This repository is the right thing when you want to see a Material application assembled, and the wrong thing when you want to copy a snippet or start a project.

Editorial conclusion

Adopt this repository as a reference if you are working with Angular Material and want a complete application that exercises the component library rather than isolated snippets, since the master branch holds the finished code for the whole course and includes a working backend. Do not adopt it as a starting point for your own application, because the README points you at the 1-start branch for that, and the master branch is explicitly the final version to read alongside the videos. Before you install, note that the README asks for Node 24 LTS, use npm ci rather than npm install so the lockfile versions are honoured, and use npm start rather than ng serve because the npm script adds the proxy configuration the project needs. The licence is MIT, the repository publishes no GitHub releases, and the last push was on 2026-09-30.

Frequently asked questions

Official sources

1. angular-university/angular-material-course on GitHub
2. Issues
3. License: MIT
4. Project website
5. README