![Decoded Frontend](/img/default-banner.jpg)
- Видео 132
- Просмотров 2 632 053
Decoded Frontend
Австрия
Добавлен 1 мар 2020
Decoded Frontend is a source of advanced, in-depth, and pragmatic video tutorials about Angular and Web Development. Every second Tuesday I publish a new video focusing on really advanced topics and tricks that might kick off your carrier and help you to quickly grow from Middle to Senior level.
If you already have some experience with the Angular framework and you are bothered by shallow videos made mostly for beginners - then you are at the right place. Consider subscribing to my channel and I promise that you will not be disappointed!
My name is Dmytro Mezhenskyi, I am a Google Developer Expert in Angular and I will be happy to share my 12 years of experience in Web Development with you. Thanks for your attention and see you in my next video 👋
For any questions, collaboration or suggestions please reach me at dmytro@decodedfrontend.io
If you already have some experience with the Angular framework and you are bothered by shallow videos made mostly for beginners - then you are at the right place. Consider subscribing to my channel and I promise that you will not be disappointed!
My name is Dmytro Mezhenskyi, I am a Google Developer Expert in Angular and I will be happy to share my 12 years of experience in Web Development with you. Thanks for your attention and see you in my next video 👋
For any questions, collaboration or suggestions please reach me at dmytro@decodedfrontend.io
TOP 6 Mistakes in RxJS code
To try everything Brilliant has to offer-free-for a full 30 days, visit brilliant.org/DecodedFrontend.
You’ll also get 20% off an annual premium subscription.
From this video, you will learn the TOP 6 mistakes developers make when writing RxJS code. Watch this video until the end, and you will see how to make your RxJS code more reliable, clear, and performant. If you find this video useful, please share it with your colleagues and friends. Enjoy!
👉 See All Angular Courses - bit.ly/discounted-course-bundle
🕒 Time Codes:
00:00 - Intro
00:00:54 - Project Overview;
00:02:56 - Nested Subscriptions;
00:05:38 - Wrong usage of takeUntil for unsub;
00:07:20 - Manual Subscriptions;
00:09:34 - Observable r...
You’ll also get 20% off an annual premium subscription.
From this video, you will learn the TOP 6 mistakes developers make when writing RxJS code. Watch this video until the end, and you will see how to make your RxJS code more reliable, clear, and performant. If you find this video useful, please share it with your colleagues and friends. Enjoy!
👉 See All Angular Courses - bit.ly/discounted-course-bundle
🕒 Time Codes:
00:00 - Intro
00:00:54 - Project Overview;
00:02:56 - Nested Subscriptions;
00:05:38 - Wrong usage of takeUntil for unsub;
00:07:20 - Manual Subscriptions;
00:09:34 - Observable r...
Просмотров: 13 910
Видео
Reactive Forms in Angular - Dynamic Validation
Просмотров 7 тыс.Месяц назад
Learn Everything About Angular Forms 🚀 bit.ly/advanced-angular-forms_yt In this video about Reactive Forms in Angular, I will show you how you can apply and remove validators to certain form controls dynamically, depending on the values from other form controls in your Angular Form. I will show you how to do that using ReactiveForms. You will see which pitfalls you might encounter while impleme...
Content Projection in Angular - Complete Guide (Beginners/Advanced)
Просмотров 13 тыс.Месяц назад
👉 To try everything Brilliant has to offer for free for a full 30 days, visit brilliant.org/DecodedFrontend You’ll also get 20% off an annual premium subscription. In this video, besides the basics of content projection in Angular, you will also learn more advanced scenarios like multi-slot content projection, Content Re-Projection, Projection aliasing, and ngProjectAs attribute, and last but n...
RxJS Scan Operator - How to Manage the State
Просмотров 9 тыс.2 месяца назад
Learn everything about Angular Forms 🚀 bit.ly/advanced-angular-forms-course-updated 👉 See All Angular Courses - bit.ly/discounted-course-bundle Have you ever had a use case when you had an RxJS data stream and wanted to shape some state from it? Watch this video until the end, and you will learn how you can create and manage the state right in the stream so that you can deliver data right to th...
Component Input Binding in Angular Router
Просмотров 8 тыс.3 месяца назад
Learn everything about Angular Forms 🚀 bit.ly/advanced-angular-forms-course-updated 👉 See All Angular Courses - bit.ly/discounted-course-bundle 🕒 Time Codes: 00:00:00 - Intro; 00:01:19 - Routes handling in Angular; 00:02:14 - Idea behind Component Input Binding; 00:04:39 - Naming conflict resolution 00:05:44 - Real-life use case; 00:09:35 - Outro; 🔗 Source code from the tutorial: github.com/DMe...
Angular Model - The New Signal-Based 2-way Data Binding
Просмотров 20 тыс.4 месяца назад
🔥 Conscious Angular Testing for Beginners with 10%-OFF (For the First 10 Students): bit.ly/conscious-angular-testing_U8YXaWwyd9k Recently, Angular 17.2 was introduced, which brings a new API that enables deeper integration of Signals into Angular components. One of these new functions is a function `model`, which enables the 2-way data binding and which one I am going to cover in this video. Yo...
Input Signals in Angular 17.1 - How To Use & Test
Просмотров 24 тыс.4 месяца назад
Learn more about RxDB - bit.ly/rxdb 🚀 The introduction of Input Signals is another step towards the integration of Signals into Angular Framework Core. From this video, you will learn how to migrate your angular components to input signals smoothly and how to adjust your unit tests. Besides that, you will know how to make your inputs reactive even before Angular 17.1. If you find this video use...
Deferrable Views - New Feature in Angular 17
Просмотров 19 тыс.5 месяцев назад
Level up your Angular skills with my Advanced Courses 🚀 bit.ly/discounted-course-bundle Discover the easy way to load parts of your website only when needed with Angular 17's new feature: Deferrable Views. This video shows you how this cool tool helps to load your website faster and smoother, making your coding life simpler. Great for both new and experienced Angular users. Watch, learn, and sh...
Angular Testing - New Course & Giveaway Teaser 🎉
Просмотров 8 тыс.7 месяцев назад
Angular Testing - New Course & Giveaway Teaser 🎉
Angular 17 - New Build-In Control Flow Overview 🚀
Просмотров 36 тыс.7 месяцев назад
Angular 17 - New Build-In Control Flow Overview 🚀
Scraping Data from Amazon using Scraping Browser API, ExpressJS & Angular
Просмотров 3,9 тыс.8 месяцев назад
Scraping Data from Amazon using Scraping Browser API, ExpressJS & Angular
The Role of "exportAs" Property in Angular [RE-UPLOADED]
Просмотров 13 тыс.8 месяцев назад
The Role of "exportAs" Property in Angular [RE-UPLOADED]
How to Make Forms in Angular REUSABLE (Advanced, 2023)
Просмотров 59 тыс.9 месяцев назад
How to Make Forms in Angular REUSABLE (Advanced, 2023)
Web Workers in Action - Performance Boost for Web Applications (2023)
Просмотров 23 тыс.10 месяцев назад
Web Workers in Action - Performance Boost for Web Applications (2023)
How To Make Angular Code More Reusable
Просмотров 27 тыс.11 месяцев назад
How To Make Angular Code More Reusable
Angular NgRx - How to use Feature Creator (API Overview, 2023)
Просмотров 17 тыс.11 месяцев назад
Angular NgRx - How to use Feature Creator (API Overview, 2023)
Reset Forms in Angular using Reactive Forms
Просмотров 11 тыс.Год назад
Reset Forms in Angular using Reactive Forms
Pitfalls Of Using takeUntil and takeUntilDestroyed RxJS Operators
Просмотров 20 тыс.Год назад
Pitfalls Of Using takeUntil and takeUntilDestroyed RxJS Operators
The new DestroyRef Provider in Angular 16 (2023)
Просмотров 12 тыс.Год назад
The new DestroyRef Provider in Angular 16 (2023)
Change Detection in Angular Pt.3 - OnPush Change Detection Strategy
Просмотров 25 тыс.Год назад
Change Detection in Angular Pt.3 - OnPush Change Detection Strategy
Change Detection in Angular Pt.2 - The Role of ZoneJS (2023)
Просмотров 20 тыс.Год назад
Change Detection in Angular Pt.2 - The Role of ZoneJS (2023)
Change Detection in Angular - Pt.1 View Checking
Просмотров 34 тыс.Год назад
Change Detection in Angular - Pt.1 View Checking
Design Patterns in Angular Source Code - Strategy Design Pattern
Просмотров 17 тыс.Год назад
Design Patterns in Angular Source Code - Strategy Design Pattern
Design Patterns in Angular Source Code - Bridge Design Pattern
Просмотров 24 тыс.Год назад
Design Patterns in Angular Source Code - Bridge Design Pattern
Component-Less and Empty-Path Routes in Angular (2023)
Просмотров 13 тыс.Год назад
Component-Less and Empty-Path Routes in Angular (2023)
Demystifying Angular Two Way Binding (2023)
Просмотров 12 тыс.Год назад
Demystifying Angular Two Way Binding (2023)
NgTemplateOutlet in Angular - Everything You Have to Know (2022)
Просмотров 47 тыс.Год назад
NgTemplateOutlet in Angular - Everything You Have to Know (2022)
Angular Builders - Creating Custom Builder from Scratch (Advanced, 2022)
Просмотров 9 тыс.Год назад
Angular Builders - Creating Custom Builder from Scratch (Advanced, 2022)
Angular Builders - How Do They Work? (2022)
Просмотров 8 тыс.Год назад
Angular Builders - How Do They Work? (2022)
Thank you for this great idea! I use it for loose coupled components (with routing) that work together as a generic form. But i have a problem to make the injection / parentContainer optional. So if i want to use the same component as a single form component or with a parent form. Any Optional( ) or something like deps: [[Optional, NgForm]] is not working (still get an null injection error...). Any tips how to fix that?
Ah, i got it working. I used the Optional syntax wrong. First trys was with deps: [[Optional, NgForm]] Second Try was with an @Optional before the Token. But correct syntax is this: useFactory: () => inject(ControlContainer, {skipSelf: true, optional:true}) Now it works, you only have to adjust the getter for the "parent" Container to use the local formGroup instead of the one from the parent if it not exists. Also adjust the templat to provide a parentFormgroup then. Good Day folks and thx, fopr sharing tips 🙌
Thank you for the detailed ng-content video. Always learn smth new from your videos. In current one it was - the re-projection tricks and using a directive for getting a reference to a template. Thanks.
Watching all of your videos. You have improved my career so much bro, many thanks...🙏
interesting.....
please release a video on creating a best project structure in angular
Great explanation. Thanks a lot
Great video! It solved my split form issue. However, do you mind addressing the test case for this as well?
Excelent explanation! thanks!
Thank you.
For such simple scenarios imo we don't need even to write custom builder, the code can be placed right in the project, however thanks for the video it allow to understand how things work under the hood
Second video of you that I’m watching, you have a great talent making things easy to understand 👌🏼
Thank you
bro, you are pro! Thanks a lot!
Angular signals resemble MobX 🤔
Is this source code shared anywhere?
I have a question. Let's say that I have 8 common inputs in 2 different components. I can't handle them with binding a class or something since they are all object types. How can i handle this case? Should i stick with directives or abstract component?
thank you
Can you make a video about good and bad practices generally in Angular? For templates as well as ts component logics
You are the best, I'm top fan, Could you please make same tutorial but for material v18🙏🙏
2:05 hey what about , unsubscribing !! here form.valuechanges.subs .......
Bravo !! Big thanks <3 bien expliqué, j'apprécie beaucoup votre efforts <3
Hi, could you please explain the benefits of assigning the response results to an observable instead of just using an array? Thank you! loving your vid by the way! :D
Observables created using fromEvent are cold observables.
Wonderful it's still run in my case but when i use chat-app with another root routing look like they conflicts with each other. IT'S STILL WORK FINE but when need 2 click to bootstrapModule app-chat in current app. First click return Cannot match any routes ( with current route url ) . Does anyone has any solution ? Thank you
I have been working as Angular developer for more than three years and I didn't find anything new but distinctUntilKeyChanged) Anyway it is a really cool video as always and it gives good hints and advice)
Hi, What extension do you use for generate a class?
Thanks a lot!
Amazing video. thanks Dmytro, u never disappoint ♥
Damn, so cool !
Great video, thank you
Since we might need to use those handlers in other lists too, I implemented them in a more generic way like this: ```function removeHandlerFn<T>(indexToRemove: number) { return (state: T[]): T[] => state.filter((_element, index) => index !== indexToRemove); } function resetHandlerFn<T>(event: void) { return (state: T[]): T[] => []; } function accumulatorHandlerFn<T>(value: T) { return (state: T[]): T[] => [...state, value]; } function scanHandlerFn<T>(state: T[], stateHandlerFn: (state: T[]) => T[]) { return stateHandlerFn(state); }``` Also used them like this: ```ages$: Observable<number[]> = merge( this.reset$.pipe(map(resetHandlerFn<number>)), this.remove$.pipe(map(removeHandlerFn<number>)), this.debouncedAge$.pipe(map(accumulatorHandlerFn)) ).pipe(scan(scanHandlerFn, []));```
It was really helpful!
wow!!!
Thank you, your videos on Angular are the best.
На самом деле очень круто, мне кажется любой тут найдет что то полезное для себя, находясь на разных уровнях развития. В реальной жизни я придерживаюсь таких правил, но про shareReplay и distingUntilChanges я подчерпнул для себя что то новое
Got to love some good old currying. I'd love to see more videos on more advanced usage of RxJS and how to tie together Signals nicely :)
Thank you so much. It was really helpful for me. ❤
I would have added all the code to the 'valueChange' in the example
Thanks - I've learned a lot from this video!
Great video! Could you give advice how to prorerly split vendor file to chunks?
In mistake nr3 you did mistake. Should add sharereplay to observale if doing more than one async pipe to same observale. Edit. Ok in mistake nr4 you fixed mistake nr3 😅
Great content, as always <3
Who else liked it before even watching the video thinking it's always quality content
Awesome, it's a always brilliant to learn from you
Неймовiрна англiйська!
🥸😎🤓🥸😎🤓🥸😎🤓