Angular Tutorial for Beginners – Web Framework with Typescript Course
Learn the basics of Angular in this full course for beginners. Angular is a TypeScript-based free and open-source web application framework created by Google.
✏️ Slobodan Gajic created this course. Check out his channel:
⭐️ Course Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:05:26) Components
⌨️ (0:08:56) Lifecycle hooks
⌨️ (0:11:21) Text interpolation
⌨️ (0:13:31) Components Communication
⌨️ (0:19:01) Component Styles
⌨️ (0:23:36) Ng-Content
⌨️ (0:26:31) Template Statements
⌨️ (0:28:49) Pipes
⌨️ (0:32:22) Property Binding
⌨️ (0:34:56) Attribute, Class & Style
⌨️ (0:39:16) Event Binding
⌨️ (0:41:36) Two-way Binding
⌨️ (0:47:57) Directives
⌨️ (0:52:52) Attribute directives
⌨️ (0:56:36) Structural directives
⌨️ (1:01:15) Dependency Injection
⌨️ (1:04:14) Routing
⌨️ (1:13:19) Template-Driven Form
⌨️ (1:20:26) Reactive Forms
⌨️ (1:26:04) Form Validation
⌨️ (1:30:57) HTTP Client
⭐️ Video Resources ⭐️
? Learn more about Pips:
? Cocktail API endpoint: www.thecocktaildb.com/api/json/v1/1/search.php?f=a
? LoR API endpoint:
? LoR API docs:
? Thanks to our Champion and Sponsor supporters:
? Wong Voon jinq
? hexploitation
? Katia Moran
? BlckPhantom
? Nick Raker
? Otis Morgan
? DeezMaster
? AppWrite
—
Learn to code for free and get a developer job:
Read hundreds of articles on programming:
And subscribe for new videos on technology every day:
Thank you for posting my tutorial. I hope you guys can learn a thing or two.
Happy coding ???
@Sol Ise You’re welcome!
Thanks a lot for this tutorial!!!
@Mauricio Henao Rua Thank you I’m glad you like it
@Del Y You are welcome
marvelous explanation proffesor i love your course thanks so much , hands down
OMG you guys just made it at the right time, I am really trying to learn this for my current project!
same. was a react jun dev and now i got a job as an ang jun dev.
right with ya brother
I hope it helps you ?
A very concise tutorial but just what I needed to know what’s up with angular!
I’m glad you liked it! Feel free to checkout more tutorials like this
I understood some of this stuff because I work with Angular but I don’t think the language used is so user-friendly for a beginner: “Use this, do that”. At least to me, when I am learning, I like to know why it’s this or that.
@Attila Vén the fireship tutorial is really good. I’m an angular beginner and it was very straight to the point
Correct. I had to watch another tutorial (by Fireship) how to get started with an angular project. If something is for beginners, it should explain everything from the basics.
i agree, there are a lot of things that i coulnd’t understand
@Code with Sloba It’s ok, some things are really hard to explain, especially in coding. When I started 4 years ago I had a really bad time because people never explained to me the “why’s”. “Put this here.” – “Why?” – “Doesnt matter.”…..lol
Thank you for feedback, I tried to explain as much as I can, but I guess it can be better.
Thank you Sloba so much! This tutorial so great for quick fast forward of documentation! Documentation very slow to read through, this very nice because it take documentation and go through it very fast without much explain. Documentation explain too much. Thank you Sloba for saving the day!
Awesome tutorial for angular newbies. Great Job.
I’m glad you like it
BUENISIMO! Exacto, conciso y al grano!
Thank you I’m glad you like it!
The context of beginner here can be misleading. IMO to understand this video, you need to at least handle a project using typescript + other framework (react, vue, svelte). And you still need to read angular documentation after watching this.
But If you use this video as quick refresher, this video is really good one.
Perfect timing as always. Thanks FCC❤️
I hope you enjoy it
@Code with Sloba Thanks sloba!
Great teacher, great teaching.
Thank you so much!
Great series Slobodan! In an land of coffee tutorials, this was an espresso! Appreciate cha!
Haha I love it! Thank you! Feel free to checkout more on my channel
Really needed this for my upcoming project. Thank you Slobodan gajic???
@Thiyagesh Kanna S Thank you
@Code with Sloba yess subscribed
I’m glad you like it ? Feel free to check more tutorials on my channel
FYI at 15:01 there needs to be a ! following the childMessage input. Here is that line @Input() childMessage!: string; Hope this helps!
Lately I’ve been doing this A LOT since it’s the only solution I found at google, since putting an | undefined would bring me some errors sometimes… but I’m not even knowing how this is called so I can’t investigate about it, do you know WHY do I need to do this, and why some people doesn’t even if I’m doing the same as them?
Does it have any consecuences? And in short, what is that ! for that doesn’t bring problems like the | undefined and how could I avoid having to use it all the time?
Sorry if it was too long and too much questions, but I’m just doing it because I know I need to, and not because I know why :s
For anyone getting “Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.”, hit ctrl+c, then run ng serve again.
At the end of the Lifecycle Hooks section, I get a compile error due to no type being set for intervalSub. This can be resolved by setting type to any but my understanding is any should always be avoided. Can you advise what type should be set here?
@bear. In that case I highly recommend the Mozilla tutorials first. Check out the MDN (not MSN) and you’ll find comprehensive tutorials for HTML, CSS and JS. Their front end developer course I’d the best of its kind that I’ve found.
@Horus Of Oz Thank for this, I was getting confused by the videos, the Angular.io is easy to understand for me
You can do it like this: intervalSub: ReturnType
@Horus Of Oz I will do that, thank you.
@Horus Of Oz Nice one, I was actually just looking at it and planned on starting with that instead. I think my main problem is that I know some Python and Java but no JS, TS, HTML and CSS; this makes these ‘beginner’ Angular tutorials quite challenging 🙂
Greate tutorial! Thank you!
Can you create advertisement system for advertiser in some environment or system? I just curious about what tools or saas can do it effectively
Msg for proper guide
Finally a latest Angular course from FCC! ?
I hope you like it ?
Routing: when adding children be aware about the :id wildcard as second parameter. If is not added in URL, children will not work propely
Great tip
Thank you so much ???? , I have been following so long on YouTube and other social media
Awesome! I hope you enjoy the tutorial!