I recently tried to use a popular UI combo (React + Material UI) and wanted to use static CSS. Just good ol' regular CSS files included in the HTML head. This so I could host my frontend on a static webserver (AKA a CDN) and use Content-Security-Policy.<p>I had to jump deep in a rabbit hole of build systems that no-one seems to understand and a dependency hell that I haven't experienced since my Python days. Any Github/Stackoverflow post I could find on the subject was already obsolete.<p>The 'advise' most devs gave would boil down to disabling CSP by allowing unsafe-inline, or serving the index.html through a NodeJS server and injecting CSP nonces through a templating system. Both are not solutions, but workarounds to a problem that shouldn't exist.<p>Once again, I had to conclude that the modern webdev frameworks are not mature enough to use for any serious work. I'll try again in 2020.
To me, this looks like a solution looking for a problem, especially when the author talks about all the workarounds that become necessary just to get back to square one.<p>It also switches up the pyriamid of reliability[1].<p>[1]:<p><pre><code> /----\
/ CSS \
/--------\
/\
/JS\
/--------\
/ HTML \
/------------\</code></pre>
Personally, I don't mind the concept. I can write CSS on a microwave if I have to. But CSS is supposed to be simple, not to be mixed with JS.<p>There are good designers out there who know HTML and CSS but not JS. This will lead to a problem for those people.<p>Let's be honest, you cannot just jump into a React component and edit CSS if your knowledge of JS is slim to none.
It is all getting a bit silly really. The web needs to be accessible and not restricted to those under thirty that know lots about build tools and little about the world. I prefer the web as originally envisaged with the HTML being essentially human readable rather than obfuscated machine code. It doesn't need to be some data rendered on the frontend by scripts that embed CSS, everything works fine if done old school but properly.<p>After the browser wars, the iPhone, RWD and frameworks we were left with a complicated mess. But CSS Grid, CSS variables and HTML5 semantic tags have came along with Javascript that you can just use without some silly 'jQuery' thing to make it cross browser.<p>The choice is ever more complication - which is not accessible - or back to basics with sensible document structure - Tim Berners Lee style - and everything accessible. By accessible I mean code that mere mortals can edit and update.<p>Nobody is asking if what they make can be edited and maintained in ten years time. If you are making the next app, e.g. Instachat for Squirrels so they can find their nuts then yeah, go with the mountain of here today, gone tomorrow build tools. Otherwise, if you are primarily just writing stuff for people to read then all the assumptions of modern web development have to be questioned.<p>There is a movement out there to 'intrinsic design' and using what the browser does rather than reinventing the wheel. Part of this is to use the CSS Grid layout engine, the HTML5 inputs for validation and CSS variables to make everything responsive. Pages written this way are just plain quicker, easier to maintain and likely to last.