Charles M Wood

Vzdělání

Byznys

Jak na to

Technika

JSJ 352: Caffeinated Style Sheets: Supporting High Level CSS with JavaScript with Tommy Hodgins

JavaScript Jabber

Stay current on JavaScript, Node, and Front-End development. Learn from experts in programming, careers, and technology every week. Become a supporter of this podcast: <a href="https://www.spreaker.com/podcast/javascript-jabber--6102064/support?utm_source=rss&utm_medium=rss&utm_campaign=rss">https://www.spreaker.com/podcast/javascript-jabber--6102064/support</a>.

Sponsors<ul><li><a href="http://sentry.io/" target="_blank" rel="noreferrer noopener">Sentry</a>- use the code “devchat” for $100 credit</li><li><a href="https://www.netlify.com/" target="_blank" rel="noreferrer noopener">Netlify</a></li><li><a href="https://clubhouse.io/jsjabber" target="_blank" rel="noreferrer noopener">Clubhouse</a></li><li><a href="https://www.cachefly.com/" target="_blank" rel="noreferrer noopener">CacheFly</a></li></ul> Episode Summary   In this episode of JavaScript Jabber, the panelists talk with Tommy Hodgins who specializes in responsive web design. He starts with explaining to listeners what it means by a responsive web layout and goes on to discuss the techniques in using JavaScript in CSS in depth.He elaborates on dynamic styling of components, event-driven stylesheet templating, performance and timing characteristics of these techniques and describes different kinds of observers – interception, resize and mutation, and their support for various browsers. He also talks about how to go about enabling certain features by extending CSS, comparison to tools such as the CSS preprocessor and Media Queries, pros and cons of having this approach while citing relevant examples, exciting new features coming up in CSS, ways of testing the methods, caffeinated stylesheets, along with Qaffeine and Deqaf tools.Links<ul><li><a href="https://www.npmjs.com/package/jsincss" target="_blank" rel="noreferrer noopener">JS in CSS</a> – Event driven virtual stylesheet manager</li><li><a href="https://github.com/tomhodgins/qaffeine" target="_blank" rel="noreferrer noopener">Qaffiene</a></li><li><a href="https://github.com/tomhodgins/deqaf" target="_blank" rel="noreferrer noopener">Deqaf</a></li><li><a href="https://twitter.com/innovati?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" rel="noreferrer noopener">Tommy’s Twitter</a></li><li><a href="http://staticresource.com/fizzbuzz.html" target="_blank" rel="noreferrer noopener">Fizzbuzz</a></li></ul> PicksJoe<ul><li><a href="https://boardgamegeek.com/boardgame/159503/captain-dead" target="_blank" rel="noreferrer noopener">The Captain Is Dead</a></li></ul>Aimee<ul><li><a href="https://henrikwarne.com/2018/12/03/developer-on-call/" target="_blank" rel="noreferrer noopener">Developer on Call</a></li><li>Tip – Try to follow a low-sugar diet</li></ul>Chris<ul><li><a href="https://twitter.com/innovati/status/1068998114491678720" target="_blank" rel="noreferrer noopener">Tommy’s snippets on Twitter – JS in CSS</a></li><li><a href="https://bitsofco.de/" target="_blank" rel="noreferrer noopener">All things frontend blog</a></li><li><a href="https://github.com/cferdinandi/gulp-boilerplate" target="_blank" rel="noreferrer noopener">Gulp project</a></li></ul>Charles<ul><li><a href="https://github.com/cmaxw/devchat-eleventy" target="_blank" rel="noreferrer noopener">Coaching by Charles in exchange of writing Show Notes or Tags</a></li></ul>Tommy<ul><li><a href="https://www.npmjs.com/package/jsincss" target="_blank" rel="noreferrer noopener">JS in CSS</a></li></ul>Special Guest: Tommy Hodgins. Support this podcast at — <a href="https://redcircle.com/javascript-jabber/donations" target="_blank" rel="noreferrer noopener">https://redcircle.com/javascript-jabber/donations</a> Privacy & Opt-Out: <a href="https://redcircle.com/privacy" target="_blank" rel="noreferrer noopener">https://redcircle.com/privacy</a> Become a supporter of this podcast: <a href="https://www.spreaker.com/podcast/javascript-jabber--6102064/support?utm_source=rss&utm_medium=rss&utm_campaign=rss">https://www.spreaker.com/podcast/javascript-jabber--6102064/support</a>.

Sponsors<ul><li><a href="http://sentry.io/" target="_blank" rel="noreferrer noopener">Sentry</a>- use the code “devchat” for $100 credit</li><li><a href="https://www.netlify.com/" target="_blank" rel="noreferrer noopener">Netlify</a></li><li><a href="https://clubhouse.io/jsjabber" target="_blank" rel="noreferrer noopener">Clubhouse</a></li><li><a href="https://www.cachefly.com/" target="_blank" rel="noreferrer noopener">CacheFly</a></li></ul> Episode Summary   In this episode of JavaScript Jabber, the panelists talk with Tommy Hodgins who specializes in responsive web design. He starts with explaining to listeners what it means by a responsive web layout and goes on to discuss the techniques in using JavaScript in CSS in depth.He elaborates on dynamic styling of components, event-driven stylesheet templating, performance and timing characteristics of these techniques and describes different kinds of observers – interception, resize and mutation, and their support for various browsers. He also talks about how to go about enabling certain features by extending CSS, comparison to tools such as the CSS preprocessor and Media Queries, pros and cons of having this approach while citing relevant examples, exciting new features coming up in CSS, ways of testing the methods, caffeinated stylesheets, along with Qaffeine and Deqaf tools.Links<ul><li><a href="https://www.npmjs.com/package/jsincss" target="_blank" rel="noreferrer noopener">JS in CSS</a> – Event driven virtual stylesheet manager</li><li><a href="https://github.com/tomhodgins/qaffeine" target="_blank" rel="noreferrer noopener">Qaffiene</a></li><li><a href="https://github.com/tomhodgins/deqaf" target="_blank" rel="noreferrer noopener">Deqaf</a></li><li><a href="https://twitter.com/innovati?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" rel="noreferrer noopener">Tommy’s Twitter</a></li><li><a href="http://staticresource.com/fizzbuzz.html" target="_blank" rel="noreferrer noopener">Fizzbuzz</a></li></ul> PicksJoe<ul><li><a href="https://boardgamegeek.com/boardgame/159503/captain-dead" target="_blank" rel="noreferrer noopener">The Captain Is Dead</a></li></ul>Aimee<ul><li><a href="https://henrikwarne.com/2018/12/03/developer-on-call/" target="_blank" rel="noreferrer noopener">Developer on Call</a></li><li>Tip – Try to follow a low-sugar diet</li></ul>Chris<ul><li><a href="https://twitter.com/innovati/status/1068998114491678720" target="_blank" rel="noreferrer noopener">Tommy’s snippets on Twitter – JS in CSS</a></li><li><a href="https://bitsofco.de/" target="_blank" rel="noreferrer noopener">All things frontend blog</a></li><li><a href="https://github.com/cferdinandi/gulp-boilerplate" target="_blank" rel="noreferrer noopener">Gulp project</a></li></ul>Charles<ul><li><a href="https://github.com/cmaxw/devchat-eleventy" target="_blank" rel="noreferrer noopener">Coaching by Charles in exchange of writing Show Notes or Tags</a></li></ul>Tommy<ul><li><a href="https://www.npmjs.com/package/jsincss" target="_blank" rel="noreferrer noopener">JS in CSS</a></li></ul>Special Guest: Tommy Hodgins. Support this podcast at — <a href="https://redcircle.com/javascript-jabber/donations" target="_blank" rel="noreferrer noopener">https://redcircle.com/javascript-jabber/donations</a> Privacy & Opt-Out: <a href="https://redcircle.com/privacy" target="_blank" rel="noreferrer noopener">https://redcircle.com/privacy</a> Become a supporter of this podcast: <a href="https://www.spreaker.com/podcast/javascript-jabber--6102064/support?utm_source=rss&utm_medium=rss&utm_campaign=rss">https://www.spreaker.com/podcast/javascript-jabber--6102064/support</a>.

Aplikace Youradio Talk

JSJ 352: Caffeinated Style Sheets: Supporting High Level CSS with JavaScript with Tommy Hodgins

Poslechněte si podcast