Angular Signals Example - Learn Them by Doing

Рет қаралды 11,319

Күн бұрын

Learn how to build an Angular project from scratch by Angular signals example. In this video we will fully implement the todo list with filtering, editing, deleting and competing features.
TIMESTAMPS
0:00 Introduction
1:21 Initial project
1:52 Adding components
3:22 Splitting project
6:10 Adding interfaces
7:07 Service with Angular signals
10:04 Implementing header section
14:01 Implementing main section
16:05 Filtering todos
20:13 Implementing footer section
28:59 Implementing a single todo
31:29 Implementing editing
39:55 Removing todos
41:36 Completing todo
44:21 Adding autofocus
45:53 Toggle all todos
► CHECK MY COURSES - monsterlessons-academy.com/co...
MOST POPULAR COURSES
► Building real project with Angular + NgRx - monsterlessons-academy.com/co...
► Building real NestJS API - monsterlessons-academy.com/co...
► Javascript interview questions - monsterlessons-academy.com/co...
► Angular Interview Questions monsterlessons-academy.com/co...
► Building real fullstack project - monsterlessons-academy.com/co...
► Mastering Git - monsterlessons-academy.com/co...
► Mastering Docker and Docker Compose - monsterlessons-academy.com/co...
► Building real project with React Hooks - monsterlessons-academy.com/co...
► Building real project with Vue + Vuex - monsterlessons-academy.com/co...
FOLLOW ME
► TWITTER - / monster_lessons
► INSTAGRAM - / monsterlessonsacademy
► TIKTOK - / monsterlessonsacademy
REFERENCES
► Source code - github.com/monsterlessonsacad...

Пікірлер: 52

@LukeAvedon 11 ай бұрын

Thank you for all the videos with signals examples. I am super jazzed about signals.

@MonsterlessonsAcademy 11 ай бұрын

Glad you like them!

@valerigogichashvili 11 ай бұрын

Amazing as always!

@MonsterlessonsAcademy 11 ай бұрын

Thank you! Cheers!

@Brendan2Alexander 11 ай бұрын

Your channel is ridiculously helpful. I always feel jacked to get into my angular projects after watching a few of your videos

@MonsterlessonsAcademy 11 ай бұрын

Glad to help!

@user-iu7de2ji6b 11 ай бұрын

your tutorials have such a nice understandable pace.

@MonsterlessonsAcademy 11 ай бұрын

Glad to hear that!

@user-cx7wz9mm1q 4 ай бұрын

Impeccable, as always.

@MonsterlessonsAcademy 4 ай бұрын

Wow, thank you!

@tomozi1 10 ай бұрын

Best channel and lessons. Thanks

@MonsterlessonsAcademy 10 ай бұрын

Glad you think so!

@Santon-Motho 11 ай бұрын

Thanks for another awesome video on Angular. Your channel and courses are top notch 💯

@MonsterlessonsAcademy 11 ай бұрын

Glad you like them!

@tinodueppotell4869 11 ай бұрын

Thanks - great Tutorial

@MonsterlessonsAcademy 11 ай бұрын

Glad it was helpful!

@henrik3098 11 ай бұрын

this is a good angular channel

@MonsterlessonsAcademy 11 ай бұрын

Thanks!

@muthu1046 11 ай бұрын

Thanks!

@MonsterlessonsAcademy 11 ай бұрын

Thank you so much for your support! It means a lot to me

@tinodueppotell4869 11 ай бұрын

Danke!

@MonsterlessonsAcademy 11 ай бұрын

Vielen dank für Ihre Unterstützung. Das ist sehr wichtig für mich!

@manojv2893 2 ай бұрын

Thank you

@MonsterlessonsAcademy 2 ай бұрын

You're welcome

@KushanShanuka 11 ай бұрын

while watching this, i feel angular signals feature is seems like vue refs. by the way you explained well. thank you

@botondvasvari5758 6 ай бұрын

what if there are more complex filters that can come from different components ?

@MonsterlessonsAcademy 6 ай бұрын

Then you need to change your code acording to requirements.

@denysbilas3670 11 ай бұрын

HI! Thanx for sharing! I want ask you about architecture for front end application. What architecture do you use for your pet projects or work?

@MonsterlessonsAcademy 11 ай бұрын

Typically by feature architectured like I showed here kzfaq.info/get/bejne/f6yEpMmAxMvanJc.html

@jorgen180 5 ай бұрын

What is recommended approach to implementing custom input field validation while using Signals? Functionality provided in Reactive Forms doesn't yet seem to be reflected to Signals.

@MonsterlessonsAcademy 5 ай бұрын

I don't use signals for custom validation. Just plain reactive form

@dimitridoroshko 11 ай бұрын

Hey, man. What is your favorite framework out of the top three: angular, react, Vue?

@MonsterlessonsAcademy 11 ай бұрын

I don't really like one of them more then others. Most importantly for me is to get paid for any of them. My personal preference is Elm but unfortunately it is not that popular.

@moegreen8543 5 ай бұрын

Are there already any standards (generally accepted rules) for writing variable names for signals?

@MonsterlessonsAcademy 5 ай бұрын

Nope. It's wild west.

@AdelBasiony 6 ай бұрын

can you please make a video using singals and Ngrx together in a project. Thanks.

@MonsterlessonsAcademy 6 ай бұрын

I will add it to the list of ideas. Thanks

@vk19148 11 ай бұрын

🙏🙌

@christopheradolphe 4 ай бұрын

Hi Oleksandr, thank you for this great tutorial about Angular signals. I've read some articles over the web about when to use signals vs observables. Some of them advise to keep using observables in services and use signals in components. Your video clearly shows that a service can entirely work with signals. I'd really like to know what are your thoughts about this. Also what's that code editor you are using ?

@MonsterlessonsAcademy 4 ай бұрын

I see zero reasons to use something in either service or comp. Don't read these articles :) Use signals for simple state. Use RxJS when you need RxJS methods like distincUntilChanged, etc

@christopheradolphe 4 ай бұрын

@@MonsterlessonsAcademy Thank you for your response and the great content!

@AdelBasiony 6 ай бұрын

Isn't it better to move all computed signals to the service and just call them in the component? even if the signal is used once in a single component. I'm really confused about which is the best practice. Highly appreciate your videos.

@MonsterlessonsAcademy 6 ай бұрын

Sure. If it is shareable than move it to comp. If not then not.

@AdelBasiony 6 ай бұрын

Thanks a lot.@@MonsterlessonsAcademy