A visual guide to why DECLARATIVE code is better

[@JoshuaMorony]

Extra content around 3D scenes and cameras for Angular apps going out in the newsletter tomorrow: mobirony.ck.page/4a331b9076

[@tarquin161234]

I am the only reactive programmer in my team. They have asked me to do a presentation explaining why declarative is better. I think I will start off with this vid. Thanks!

[@larrycoleman8149]

Must be nice. My team used to block my declarative code during code review. Such a pain. Share your secret to push declarative code😂

[@vivmaniaa]

Hi Joshua, you do not know how much I've been struggling to understand what are both of them, this video really resolved my confusion. I thank you with respect and love from the bottom of my heart❤

[@itzmeys]

Love this video as a visual learner, please make more videos like this! It really helps visual learner like me to understand and learn so much better.

[@gcancino]

A simple code to understand it better would be great.

[@jaypatel-dt8bw]

Kudos to your grate efforts for Angular community....

[@MeadAlsorani]

Honestly, this is the first time I understand the real and the specific meaning of "Declarative" and "imperative", thanks a lot

[@shaylevinzon540]

That's a cool representation of those concepts. People are so afraid of curry/pipe functions they just never attempt to use it, maybe your next diagrams could explain this process the functions go through.

[@br3nto]

Awesome vid and explanation. It drives me nuts seeing the type of code that you describe as imperative, for exactly the reasons you describe. I think there is a lack of resources showing/teaching people alternatives.

[@samantwi1313]

I bought your course, Its Brilliant

[@wahoobeans]

I think easiest explanation is… have you ever worked with a large excel workbook? Yes? Typically there’s a main tab with variable values defined. Update those variables and then the rest of the workbook is updated accordingly everywhere else. It’s the same thing with frontend code.

[@iligol3]

Although I am completely on your side in this matter, the explanation is very abstract, understandable mostly to those who already use it. I don't understand how this video will encourage a user of the imperative approach to try to apply the declarative approach without some code example.

[@JoshuaMorony]

Whether it's effective or not I don't know, but my goal was to be abstract here. I have a lot of code focused explanations in videos and I feel like the point often gets lost because people think the declarative code is harder/overly complex and it's *easier* to just write imperative code. My goal here was just to explain conceptually why declarative code is actually easier, without getting lost in the details, and then if people can be convinced of that they can then move on to the how (even though at a small scale the declarative approach might seem harder/unnecessarily complex)

[@Cheesyonmytoasty]

Same, I found this way too abstract.

[@NehalHasnayeen]

well it made sense to me and encouraged me to keep it in mind from now on about declarative approach when coding

[@TayambaMwanza]

Very nice and simple explanation.

[@vorant94]

What is your opinion on stuff like effects? They seem to bring declaration fragmentation into reactive code… like now you have your variable declaration with some logic, but this variable can also be changed inside effects hence bringing back jumping between variable usage places

[@JoshuaMorony]

Generally I will use effects for side effects that don't affect the data flow in the application, things like triggering a save or playing a sound or playing a video. Although I generally avoid it I do still on occasion use effects that affect the data flow in the application, but in these cases I still won't be reassigning values I would have the effect trigger some source which other declarations would then react to.

[@jeffnikelson5824]

totally on your side when it comes to declarative vs imperative code. looking back at the past I would even say that an imperative approach is much more prone to errors than a declarative one. In my current project, I have had the experience that a more declarative approach just forces the developer more to think about error states ahead of time in comparison to an imperative implementation which overall resulted in a more robust implementation

[@msacket]

Great explaination!

[@adamlawrence3651]

Fighting the fight in a large enterprise app. the real pain I find is when the 2 approaches meet 🤢. For example a non serializable class going into an ngrx store, and things being mutated sometimes despite being in a store. the app was originally written in angular 2, so it's easy to see how it's happened. but now it's my job to unf**k it 😅. I could still see value in imperative to knock out an admin portal quickly for example. but once you go reactive/declarative you never go back.

[@MrDrogoyonk]

what are the difference between reactivity and declarative?

[@JoshuaMorony]

You can't have a declarative application (at least one that does anything) without reactivity. Reactivity is another one of those things people disagree on the definition of, but the simplest way to think of it imo is that reactivity enables declarative code by allowing declarations to react to changes. Take the "isHot" example, that is declarative and to be declarative it needs the ability to "react" to "temp" changing - that is the reactivity part.

[@MrDrogoyonk]

@@JoshuaMorony thanks for your answer!!

[@olegsubik]

Makes total sense!

[@richardholguin3481]

Great content

[@_Greenflag_]

what would you recommand as library(ies) for declarative code outside of Angular?

[@aravindmuthu5748]

rxjs...

[@ИвоСпасов-й5ш]

Simple rxjs, you don't need anything more. RxJS also will allow you to carry out complex data flow processing that is based on array functionalities like filter, map and so on, as well as rxjs specific operators. This is beneficial when you need to provide multicasting (multiple components can "subscribe" to your reactive source), and again when you need to do complex manipulations on your data stream. If you need something more simple and restricted, then use one of the angular's newer features - signals. You can still observe the way a value changes, but at the cost of making simpler data manipulations and having only one "subscriber".

[@zero14111990]

this is what i have to read in the actual project im working 😭 is a big codebase and the client do not want to give us the total codebase to be able to implement new modules that they pay us to do 🙃

[@motbus3]

For such bold remarks, presenting with boxes is quite biased

[@KatJay-i9y]

animations are out of this world, can anyone tell me wt kind of tool or software was used?

[@JoshuaMorony]

I'm using Motion Canvas, which lets you create animations with TypeScript/JSX

[@TayambaMwanza]

Maybe people tend to do imperative code, because declarative code forces you to consider most of the links in your code upfront. Imperative at first glance makes you feel like there's less links, so while you're writing it feels easier but the reality is you will have to do the work of linking your code over and over again when you read it.

[@JoshuaMorony]

Yes I think this is exactly it

[@rkokie]

I have been stuck in imperative code for a long time, mainly due to the fact I had a hard time really understanding the mental map for declarative with RxJS. Thanks for your teachings Josh!

[@tranquillityEnthusiast]

Rxjs everywhere everywhere 😅😅😢

[@message59]

thanks again joshua for all the effort and thoughts you put in your videos it helped me so much grasping concepts and find my way through all this (sometimes complicated) stuff you are the man 🫡👍🏻