Wes Bos & Scott Tolinski - Full Stack JavaScrip...

Zpravodajství

Technologické zprávy

Technika

756: CSS Is Getting Mixins + Functions

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

Scott and Wes chomp through CSS Mixins and Functions, discussing the latest features making their way into CSS. From Tailwind-like classes to fluid typography, join us as we explore the possibilities and practical applications of these new tools. <h3 class="code-line" data-line-start="2" data-line-end="3"><a id= "Show_Notes_2"></a>Show Notes</h3> <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <a href="#t=00:00">00:00</a> Welcome to Syntax!</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <a href="#t=01:24">01:24</a> Brought to you by <a href="www.sentry.io/syntax">Sentry.io</a></li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <a href="#t=03:00">03:00</a> CSS Is getting Functions and Mixins!</li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="https://css.oddbird.net/sasslike/mixins-functions/">CSS Mixins and Functions Explainer</a></li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href= "https://github.com/w3c/csswg-drafts/issues/9350#issuecomment-1939628591"> CSS Working Group Discussion</a></li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="#t=06:19">06:19</a> Functions and mixins, how are they different?</li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href="#t=07:26">07:26</a> Don’t get hung up on the syntax, or maybe do.</li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <a href="#t=09:12">09:12</a> CSS Functions.</li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <a href="#t=12:02">12:02</a> Some use-cases.</li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <a href="#t=15:58">15:58</a> CSS Mixins.</li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <a href="#t=16:31">16:31</a> Tailwind-like classes.</li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="#t=17:53">17:53</a> Tailwind-like arbitrary syntax.</li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <a href="#t=20:08">20:08</a> Fluid typography.</li> <li class="has-line-data" data-line-start="17" data-line-end="19"> <a href="#t=21:13">21:13</a> Let’s talk about logic.</li> </ul> <h3 class="code-line" data-line-start="19" data-line-end="20"> <a id="Hit_us_up_on_Socials_19"></a>Hit us up on Socials!</h3> Syntax: <a href="https://twitter.com/syntaxfm">X</a> <a href= "https://www.instagram.com/syntax_fm/">Instagram</a> <a href= "https://www.tiktok.com/@syntaxfm">Tiktok</a> <a href= "https://www.linkedin.com/company/96077407/admin/feed/posts/">LinkedIn</a> <a href="https://www.threads.net/@syntax_fm">Threads</a> Wes: <a href="https://twitter.com/wesbos">X</a> <a href= "https://www.instagram.com/wesbos/">Instagram</a> <a href= "https://www.tiktok.com/@wesbos">Tiktok</a> <a href= "https://www.linkedin.com/in/wesbos/">LinkedIn</a> <a href= "https://www.threads.net/@wesbos">Threads</a> Scott:<a href="https://twitter.com/stolinski">X</a> <a href= "https://www.instagram.com/stolinski/">Instagram</a> <a href= "https://www.tiktok.com/@stolinski">Tiktok</a> <a href= "https://www.linkedin.com/in/stolinski/">LinkedIn</a> <a href= "https://www.threads.net/@stolinski">Threads</a> Randy: <a href="https://twitter.com/randyrektor">X</a> <a href= "https://www.instagram.com/randyrektor/">Instagram</a> <a href= "https://www.youtube.com/@randyrektor">YouTube</a> <a href= "https://www.threads.net/@randyrektor">Threads</a>

Scott and Wes chomp through CSS Mixins and Functions, discussing the latest features making their way into CSS. From Tailwind-like classes to fluid typography, join us as we explore the possibilities and practical applications of these new tools.
 Show Notes  00:00 Welcome to Syntax!
 01:24 Brought to you by Sentry.io

 03:00 CSS Is getting Functions and Mixins!
 CSS Mixins and Functions Explainer

  CSS Working Group Discussion

 06:19 Functions and mixins, how are they different?
 07:26 Don’t get hung up on the syntax, or maybe do.
 09:12 CSS Functions.
 12:02 Some use-cases.
 15:58 CSS Mixins.
 16:31 Tailwind-like classes.
 17:53 Tailwind-like arbitrary syntax.
 20:08 Fluid typography.
 21:13 Let’s talk about logic.
  Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
 Wes: X Instagram Tiktok LinkedIn Threads
 Scott:X Instagram Tiktok LinkedIn Threads
 Randy: X Instagram YouTube Threads

Aplikace Youradio Talk

756: CSS Is Getting Mixins + Functions

Poslechněte si podcast