042 JSJ CSS and CSS Superset Languages

JavaScript Jabber

Episode | Podcast

Date: Fri, 11 Jan 2013 08:00:00 +0000

<div class="trix-content"> <div>Panel</div><pre>Brian Turley (twitter blog) Joe Eames (twitter github blog) Merrick Christensen (twitter github) AJ O’Neal (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) <br /></pre><div>Discussion<br /> 02:11 - CSS Gripes</div><div>Sass</div><div>Scalable and Modular Architecture for CSS (SMACSS)</div><div>CSS3</div><div>16:32 - Preprocessors/Compilers</div><div>LESS</div><div>Sass</div><div>Stylus</div><div>Compass</div><div>Chris Eppstein</div><div>20:34 - Basic Features of CSS Preprocessors</div><pre>nib mix-ins <br /></pre><div>23:02 - Usefulness</div><div>27:15 - Mathematics w/ Variables</div><div>Susy</div><div>28:54 - Animation</div><div>Using CSS animations</div><div>31:12 - Nesting</div><div>35:40 - Build Processes</div><div>grunt.js</div><div>42:20 - Distinction</div><pre>Prefixing <br /></pre><div>47:35 - Tightly Coupled<br /> Picks</div><pre>Old Man’s War by John Scalzi (Joe) X-Wing Miniatures Game (Joe) Dave Crowe (Merrick) Utah Software Craftsmanship Group (AJ) Effective JavaScript by David Herman (AJ) SD Card (Chuck) New Media Expo (Chuck) Consumer Electronics Show (Chuck) iOS Development Podcast (Chuck) Grid Systems in Graphic Design by Josef Muller-Brockmann (Brian) IFTTT (Brian) <br /></pre><div>Book Club</div><pre>Effective JavaScript by David Herman <br /></pre><div>Transcript<br /> MERRICK:  You have more technical problems than any other nerd I know.</div><div>[Hosting and bandwidth provided by the Blue Box Group. Check them out at bluebox.net.]</div><div>[This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.]</div><div>CHUCK:  Hey everybody and welcome to Episode 42 of the JavaScript Jabber show. This week on our panel, we have Joe Eames.</div><div>MERRICK:  He’s out to a phone call, terrible timing.</div><div>CHUCK:  We also have Merrick Christensen.</div><div>MERRICK:  That’s me.</div><div>CHUCK:  AJ O’Neal.</div><div>AJ:  Yo! Yo! Yo! Coming at you live from the snow sphere of Provo, Utah.</div><div>CHUCK:  And we have a guest, that’s Brian Turley.</div><div>BRIAN:  That’s right. I’m a designer friend of AJ’s.</div><div>CHUCK:  We’re talking about CSS today so we brought in a designer to set us all straight.</div><div>And I’m Charles Max Wood from devchat.tv. And like I said, we’re talking about CSS today. One of the things I think that’s interesting about CSS is that it converges with JavaScript. Well, there are a couple of things but one is systems like LESS, that kind of compile, they give you some sane options for dealing with some of the dumb stuff that CSS doesn’t include. Then the other one is, I’ve also wound up fighting designers for selectors in the HTML. And so, I thought we could talk through that a little bit as well.</div><div>BRIAN:  Hey, Chuck?</div><div>CHUCK:  Yes?</div><div>BRIAN:  I think those are two like really good points but I think there’s even more areas we can discuss in terms of how JavaScript and CSS are coupled. Like computed styles from JavaScript and also all the CSS methods from JavaScript. And the fact that your JavaScript sometimes doesn’t work, your UI doesn’t work unless the CSS is set up. I think the two tend to be a lot more coupled than people like to think.</div><div>CHUCK:  I agree. That’s fair. So, which avenue or which aspect do you want to tackle first? Should we talk about just CSS and where it kind of doesn’t give us what we want?</div><div>BRIAN:  I would love to complain about CSS. I got some bitterness in that sphere.</div><div>CHUCK:  I know some people consider it programming but it doesn’t have any of the things that classic programming has like variables and functions or methods or anything like that. And I think that’s where a lot of us get frustrated is that we’re used to being able to reuse things, we’re us... Support this podcast at — https://redcircle.com/javascript-jabber/donations Advertising Inquiries: https://redcircle.com/brands Privacy & Opt-Out: https://redcircle.com/privacy