5 ms·
So let's show off what you can do without JavaScript...but also include SCSS as a dependency when the opening paragraph complains about a JavaScript dependency?
by BinaryIdiot 10y ago
So let's show off what you can do without JavaScript...but also include SCSS as a dependency when the opening paragraph complains about a JavaScript dependency? Madness...but I digress.
Some of these are cool examples. Others, like the modal, won't scale very well because now you can trigger modals by tabbing (breaks keyboard navigation) or most of the form examples as you'll likely hit many endpoints that require JSON (which yeah I know "you're making a web app why can't your endpoints accept a form?" but as we all know it's never that simple and you might want to provide different behaviors for, say, showing a progress bar or disabling certain features during the submissions or a THOUSAND other things).
I get axing dependencies. I really do. I wrote msngr.js entirely in ECMAScript 5 using zero dependencies so I'd have the most flexibility possible. But at the same time overcomplicating your code to the point where it's breaking standard practices or making it un-maintainable simply to axe a dependency is the wrong way to go.
But by all means keep making cool stuff that shows off how versatile CSS is! Just don't expect to use all the CSS tricks you learn in a production environment.
- Iv 10y agoAll you need is this motherfucking website: http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/
- legulere 10y agoActually you need a tiny bit more: http://bettermotherfuckingwebsite.com http://bettermotherfuckingwebsite.com
- Jazcash 10y agoGetting there! https://bestmotherfucking.website/ https://bestmotherfucking.website/
- bryanrasmussen 10y agoIf I was the owner of motherfucking.website I would also take requests at better.motherfucking.website and best.motherfucking.website.
- ryangittins 10y agoThe first two were actually making a good point. This website (yours, presumably) is just jumping on the bandwagon and sticking an affiliate link in it. I'm not against affiliate links, but this site lacks substance.
- striking 10y agoThe affiliate link does kind of bother me, but the rest of the page is pretty good. Especially about keeping real black as your font color.
- mrob 10y agoHTTPS and full contrast text are important. The 2nd attempt is a downgrade from the first. This 3rd attempt is an actual improvement.
- egypturnash 10y agoThe second one is the only one that puts any effort into actual legibility. There's a nice comfortable amount of space between the lines! The text doesn't render right at the edge of the page! There are MARGINS and WHITESPACE. If you just take your browser's defaults for all the typographical stuff like that, everything looks like trash.
- Iv 10y agoHonestly, I can't stand websites that decide to waste 70% of screen estate. I can see the first site almost without scrolling. It is 2 to 3 pages on the other iterations. The only things I may agree with is https and zipping. "Fits on all your shitty screens" Does mean that it FITS ON ALL YOUR SHITTY SCREENS. Mine is a 1920x1080 (which is the minimal nowadays) and the 2nd and third iterations DO NOT FIT IT. That thing around the web page, it is called a fucking window. It resizes. I'll do that if I want your fucking column-format.
- dredmorbius 10y agoAnd a very tiny bit of additional polish (which would make a good basis for, say, browser defaults), IMO, even better: https://codepen.io/dredmorbius/full/KpMqqB/ https://codepen.io/dredmorbius/full/KpMqqB/ 14 style rulesets.
- whyever 10y agoI think it would be better without the horizontal lines.
- at-fates-hands 10y agoI remember one of my dev friends showed me this when jQuery was taking off. The site has changed over the years because back in the day when I first saw it, he was railing against using too much javascript - specifically jQuery.
- Sir_Cmpwn 10y agoYou should surely realize that requiring SCSS and requiring JS are two very different concerns.
- BinaryIdiot 10y agoOf course they're different but the article mentions JavaScript as a dependency. SCSS would also be a dependency it just comes into the stack at a different place but it's there nonetheless. Regardless my other points still stand.
- Sir_Cmpwn 10y agoOne is a server-side depencency and one is a client-side dependency. Don't conflate them.
- creshal 10y agoSCSS isn't even server side, it's developer side. Your build pipeline can be ugly as sin, the client should never care.
- jack9 10y agoUntil you need to maintain it (small changes) or worse, (breaking) change it. I'm not going to trade a flexible js dep for a limited css trick.
- BinaryIdiot 10y agoI never did conflate them. I've worked in this industry for 12 years now. I really don't get the disconnect here. I called it a dependency because it is and everyone is trying to tell me it's a different type of dependency. Well no shit but that was never my point to begin with. My point was hijacked and contorted here.
- CodeMage 10y agoWhat everyone's trying to tell you is that your point is beside the point.
- pmlnr 10y agoCompile time requirements and runtime requirements are different things.
- tracker1 10y agoYou could go the other way just as easily, and eliminate the css requirement. Doesn't mean it's the best way to do a given thing. Also, the examples don't support a lot of use cases... the accordian and tab examples, while interesting will submit goofy information if they're containing multi-part forms. The image changer will break other bits of navigation, or similar changers by abusing the target. Similarly, the lightbox example doesn't have a slideshow support, and even if so, would probably be as/more complex than just using JS. Also, how many of these examples work in IE11? This browser will be around a while for public facing sites, and has some really broken implementations of newer css features like calc (which doesn't work in several scenarios).
- Roboprog 10y agoAmen. If you are really good at CSS, you might play to that strength. Or, you might play to different strengths. There's probably more than one way to do it in many cases that doesn't hurt the project.
- agumonkey 10y agoMy 100$ smartphone came from a 5B$ factory.
- kqr 10y agoI agree, but I think you're putting the emphasis in the wrong place. A SCSS dependency isn't that bad because the client will never see it. What is bad is code that's hard to maintain. When I did a stint of front end development recently, I went in with the mindset that "JavaScript is evil for the user and therefore should not be used when avoidable". I discovered after a while that although you can replace JavaScript with CSS sometimes, the resulting code is often much more difficult to understand and modify than the original JavaScript would have been. It's no longer in my interest to avoid JavaScript at all costs, as was the case before. You touch on this with your "overcomplicating" sentence, but I feel like it didn't get the spotlight it deserved in your comment!
- gkya 10y agoJavascript is not evil, evil is when it's used unnecessarily, and when your page displaying 4-5 pages of text starts out 2mb without images and becomes 15mb as I scroll to bottom because you're pinging various third parties for analytics and whatnot, and when I can't view you pages where the essence is a couple paragraphs of text but you wanted to render it via Javascript and I have it blocked and you not whitelisted, and when I hesitate to use my schools web services for important things that may affect my academic career but god knows what's gonna break when on that halfe-arsed website, and especially when you mess with my history (my pet peeve). These "you"s are rhetorical BTW, I'm not addressing kqr directly.
- zeveb 10y ago> Javascript is not evil We-e-ell, it's not a good language. But it's what we have. I agree, though, that it can be used well and does have a place in writing good web pages and sites, but that when it is used to create horrible 'web apps' it is being used for evil.
- robinson7d 10y agoNone of these requires SCSS at all. You may verify by grabbing the SCSS they provide in the codepen and pasting it into http://www.sassmeister.com/ http://www.sassmeister.com/ Most examples are equally compact in plain old CSS. In fact, many of them are just plain CSS displayed in a window labeled "SCSS". The places using SCSS seem like they're simply being more sane in allowing a user to change numbers trivially. Instead of saying "just change all the 400px throughout to 500px", one can change the `$slide-width` definition in one place (usually at the top). There's also the style preference of nesting to group. But neither of those make it a strict dependency. --------- EDIT: I'm not saying that I disagree with your assertion that CSS is a bad place to layer logic from a maintainability standpoint; I'm more pointing out that blaming it on SCSS makes no sense in this context.
- BinaryIdiot 10y ago> I'm not saying that I disagree with your assertion that CSS is a bad place to layer logic from a maintainability standpoint; I'm more pointing out that blaming it on SCSS makes no sense in this context I don't see where I blamed anything on SCSS just found it amusing the page purports to axe dependencies (JavaScript) but uses SCSS. The rest of my post is far more on topic and interesting. Everyone is focusing on my SCSS poke though, heh.
- robinson7d 10y agoI certainly agree that the rest of the post makes sense and is more on topic! It's why I felt the need to add the statement at the end of my own stating that I agree with it, immediately after I posted it ;) Re: requirement - there I was referring to your opening: > So let's show off what you can do without JavaScript...but also include SCSS as a dependency when the opening paragraph complains about a JavaScript dependency? Madness... And explaining that although they used SCSS, it certainly isn't a requirement, nor even much simpler than the plain CSS. I'd guess that most of the responses probably focussed on it because leading statements are often read louder than what follows them. They set the mood/tone in a way.