Angular Tutorial for Beginners: Learn Angular from Scratch | Mosh


This Angular tutorial teaches you the fundamentals of Angular and TypeScript.



00:00 Introduction
02:54 What is Angular?
04:54 Architecture of Angular Apps
08:41 Setting Up the Development Environment
11:25 Your First Angular App
13:50 Structure of Angular Projects
20:43 Webpack
23:57 Angular Version History
27:31 Course Structure
31:55 TypeScript Fundamentals
32:34 What is TypeScript?
34:58 Your First TypeScript Program
37:57 Declaring Variables
42:46 Types
48:29 Type Assertions
51:15 Arrow Functions
52:59 Interfaces
56:54 Classes
01:01:22 Objects
01:05:31 Constructors
01:08:22 Access Modifiers
01:11:18 Access Modifiers in Constructor Parameters
01:12:58 Properties
01:18:15 Modules
01:23:22 Angular Fundamentals
01:23:41 Building Blocks of Angular Apps
01:27:22 Creating Components
01:37:00 Generating Components Using Angular CLI
01:41:40 Templates
01:44:08 Directives
01:47:34 Services
01:52:02 Dependency Injection
01:59:22 Generating Services Using Angular CLI
02:01:32 Exercise



ramamoorthy amaraguru says:


Ahmed Reza says:

Thank You Mosh….Love You,,,,,You are really an awesome programmer….

Joshua Salifu says:

My vscode does not have Shell Command: Install ‘code’ command in PATH. Any help?

somasundaram thanasekaran says:

Such a wonderful teaching method with enough patience which I have never seen anywhere before. Thanks a lot.

Fay schouten says:

11:38 can you do this without having git downloaded?

Ankita Priya says:

Thanks Mosh for the Awesome Tutorial… Here I am getting firebase issue like ” ./node_modules/angularfire2/auth/auth.js
Module not found: Error: Can’t resolve ‘rxjs/Observable”, Kindly help me out

Ankur Garg says:

Thanks for such a awesome tutorial..

Shiva Digital Web says:

First one and half hour is all about typescript… Why did you name it as Angular when you spend more time only in TypeScript?

Akash Sharma says:

Can anyone please tell me, where is the final e commerce application he showed in beginning. I could not find it in any videos

Aaron Mavrou says:

Will there be many differences if I try following the 8 hour tutorial using angular 7?

Harun Raseed says:

Great tutorial i ever gone over… Superb Mosh.

varsha pammi says:

Hi I had an issue hoping you could help me debug
i am getting an error that says ‘The serve command requires to be run in an Angular project, but a project definition could not be found.’ when I tried ng serve

Madhu Sudan Mahanta says:

This tutorial is very good enough to understand. Thanks!!

mudspringer says:

This is *excellent* thanks for doing this!! — BTW — for people using *** Windows 10 *** – you need to run the Command Line as Administrator otherwise you will have issues.


Mosh you are the best teacher!

suresh gogula says:

really superb video …..where the shopping cart project …..bro u r shown starting section i want to do that project

Naumce Ivanovski says:


Mhmd Sh says:

This video about angular lets you be an optimistic angular programmer.
Very lovely and simple

J. Ramiro Rodriguez says:

Has anyone seen this message “‘git’ is not recognized as an internal or external command,
operable program or batch file.” after trying to create a NEW project with “ng new hello-world” command in Windows 10 with Angular CLI: 7.1.0 and Node: 10.13.0?
I am a complete beginner with Angular and I don’t know whether this is expected or it is an error.

Matthew O'Gorman says:

This may well could be the best ever youtube tutorial of all time. Amazing, thanks so much.

Abdinasir Muhumed says:

Thanks, Mosh for downloading this kind of videos. you are awesome

Manish Jain says:

I got an error

$ tsc main.ts | node main.js
Finally: 5
throw er; // Unhandled ‘error’ event

Error: EPIPE: broken pipe, write
at Socket._write (internal/net.js:58:25)
at doWrite (_stream_writable.js:410:12)
at writeOrBuffer (_stream_writable.js:394:5)
at Socket.Writable.write (_stream_writable.js:294:11)
at Object.write (C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:2463:36)
at C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:71949:58
at Array.forEach ()
at Object.emitFilesAndReportErrors (C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:72023:55)
at performCompilation (C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:73789:29)
at Object.executeCommandLine (C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:73731:17)
Emitted ‘error’ event at:
at onwriteError (_stream_writable.js:425:12)
at onwrite (_stream_writable.js:456:5)
at Socket._write (internal/net.js:62:14)
at doWrite (_stream_writable.js:410:12)
[… lines matching original stack trace …]
at Object.emitFilesAndReportErrors (C:UsersMJAppDataRoamingnpmnode_modulestypescriptlibtsc.js:72023:55)

Can you help ?

Niranjan Raju says:

Looks like NG New actually creates 4 source code files and 16 test code files. 🙂 But I like this video. Very comprehensive (as always by Mosh)

victoria aoka says:

Just wanna say, THANK YOU! 🙂

mona mohey el-deen says:

hello all, would someone help me on something, when i add the dependency in providers it didn’t work, it says “is not defined-in the console”.
i don’t get it, it did work without adding it in providers!!!!!!!!!

NH Riddhi says:

Very nice explanation mosh, but i am not getting one thing, where is the ecommerce project with angular?

Ermira Kajtazi says:

Can somebody help me with this problem tsc’ is not recognized as an internal or external command, operable program or batch file.

Sanku Dey says:

Hey Mosh ! How to resolve the url case sensitivity… Eg Home, HOME , home

Fay schouten says:

Is it weird that I don’t see this file? 17:35 and 23:31 I also don’t see those scripts

Mustafa Kursun says:

Hi Mosh! I am planning to buy this course after I finish Nodejs (from you again). But I little bit hesitate as it may be (even to a little extent) outdated since you published the course a year ago and Angular version has changed since then. Can the gap between new versions of Angular and the one you teach here be easily tolerated? By the way, thanks for the great contents you create!

Ganesh Mhaske says:

Hi Mosh,
Thanks for this tutorial, it was awesome to see you teaching flawlessly. But I have one question –
Can you please explain how we can use existing HTML theme to develop the angular app? The main concern here is how we can take its custom JS (In my case the custom js uses chosen.min.js, which modifies DOM element in document.ready function of jquery) and allow to modify dom element, as when we do route through one link to other JS will not be reloaded again in browser, which causes not to apply logic which written in ready function. (this is because the page will not refresh in a browser, because of routerlink behavior).

Nadir Abbas says:


Jahul Hasan says:

hello very good tutorials..
I am facing a problem.
please help me . i wan to remove a module . when i delete routing of that module and also the directory of that module by doing this i am getting error while i hit ng serve command…. please suggest me …

SeJong Jang says:

you are the best Mosh.

rakesh dasari says:

I am getting an error stating that UNABLE TO GET ISSUER CERT LOCALLY

Bao Bui says:

You Sir are awesome, the presentation is pretty clear and certainly easy to learn from the beginner point of view like me, thanks a ton!

 Write a comment


Do you like our videos?
Do you want to see more like that?

Please click below to support us on Facebook!