Why is modern web development so complicated?

That really depends on how quickly you can deprecate browsers that don't support modern features.

https://en.wikipedia.org/wiki/Microsoft_Edge

Edge is supposedly an option even back to Windows 7, though I don't believe it's a required security update. I haven't used a Windows 7 system in long enough that I'm not sure.

https://caniuse.com/css-grid

At this point it is reasonable to tell people they NEED to install a more modern (and more security up to date!) web browser, be it Google Chrome, Microsoft Edge, or Mozilla Firefox.

The main reasons web development is complicated:

* Javascript has evolved from simple requirements e.g. flashy text to a full blown application environment, but there is relatively little base functionality included (e.g. compared to what you get in Java or C#) so people need to write those libs separately.

* The separate libraries above need to be included in your code, and copy/paste is not maintainable so some kind of module system is needed but JS doesn't come with one, so various people rolled their own and they competed for mindshare. 10 different standards.

* As above for UI frameworks. JS only has a basic framework included: the DOM. It's pretty good but doesn't scale "naked" to more complex apps, so again the community creates a whole bunch of those.

* As above for application frameworks (UX frameworks)? such as routers so that you can press the back button.

* Ah the back button - an example of where apps on the web have to care about something that desktop apps don't. There are other examples. Mixing http/https. Mobile responsive.

* CSS - I imagine originally designed for "documents" - now has to work well with "web apps".

* Javascript again - no static typing, many devs find it too easy to make mistakes, we have Typescript and other compile to JS languages.

* Because of the above complexity with have Babel, Browserify, Webpack etc. (one is never enough!)

* Then some genius decides to use JS for the back end and we have Node, NPM, and then because Node is so useful it becomes the front-end tool chain provider. So you use NPM to install Webpack, and the newbie has to figure out difference between dev dependencies and ordinary ones etc.

* git clone https://github.com/... and who knows what stack they've used. Oh they are using Browserify. Never used that. 2 hours reading the docs.

* Each framework then finds ways to get more complex organically. React, Redux etc. and all that.

* Again every other programmer is using 10^10 different combinations of frameworks and techs. Compare to C# Desktop development where it might be they are using Winforms or WPF - that's your only problem!

I could go on. I still copy and paste my favorite templates for getting started with NPM/Webpack/Typescript. Not sure I could demo how to get there from scratch again. All the recommended ones online seem to have beartraps in them and stuff I don't understand.

But remember you all you need is a ! It's easy!

It's definitely not about the environment. Yes, there are browser inconsistencies, but for the most part, this is not a major issue today. The problem of js apps is handling asynchronicity, having to fetch data from the server and managing UI state and in the case of an SPA, having to take care of routing, permissions, timeouts, errors etc. When you sum it all up, you end up with a front-end that mostly needs to replicate all logic from the server, apart from running the sql queries.

On the other side, when you render on the server, everything is already there. It's easy to write logic when the data you need is an sql query away and all you need to do is spit out some html. What gets a bit complex is keeping working state between pages and this usually requires handling sessions, cookies etc.

Wait that some manager hears about Angular 3000.

For somebody who just wants to pick up a useful programming language/set of languages these days - should I engage with modern web development or avoid it entirely?