Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

CSS + JS Hacks We’re Fine With

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.

<p>In this Hasty Treat, Scott and Wes talk about CSS + JS Hacks that they're ok with using.</p> <h2 id="sponsor---freshbooks" class="code-line" data-line="9"> Sponsor - Freshbooks</h2> <p class="code-line" data-line="11">Get a 30 day free trial of Freshbooks at <a title="https://freshbooks.com/syntax" href= "https://freshbooks.com/syntax" data-href= "https://freshbooks.com/syntax">freshbooks.com/syntax</a> and put SYNTAX in the "How did you hear about us?" section.</p> <h2 id="sponsor---sentry" class="code-line" data-line="13">Sponsor - Sentry</h2> <p class="code-line" data-line="15">If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting <a title="https://sentry.io" href= "https://sentry.io/" data-href= "https://sentry.io">Sentry.io</a> and using the coupon code TASTYTREAT during sign up.</p> <h2 id="show-notes" class="code-line" data-line="17">Show Notes</h2> <ul class="code-line" data-line="19"> <li class="code-line" data-line="19"><strong><a title="#t=00:53" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=00:53" data-href="#t=00:53">00:53</a></strong> What are the things in web dev, that feel wrong or hacky when starting out, but are actually totally accepted to do?</li> <li class="code-line" data-line="20"><strong><a title="#t=02:09" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=02:09" data-href="#t=02:09">02:09</a></strong> Sponsor: Sentry</li> <li class="code-line" data-line="21"><strong><a title="#t=03:12" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=03:12" data-href="#t=03:12">03:12</a></strong> Sponsor: Freshbooks</li> <li class="code-line" data-line="22"><strong><a title="#t=05:32" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=05:32" data-href="#t=05:32">05:32</a></strong> Negative margins in CSS</li> <li class="code-line" data-line="23"><strong><a title="#t=07:53" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=07:53" data-href="#t=07:53">07:53</a></strong> Not Passing a radix to parseInt()</li> <li class="code-line" data-line="24"><strong><a title="#t=10:17" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=10:17" data-href="#t=10:17">10:17</a></strong> -50% translation 50% direction</li> <li class="code-line" data-line="25"><strong><a title="#t=11:27" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=11:27" data-href="#t=11:27">11:27</a></strong> Overwriting Arguments in a function</li> <li class="code-line" data-line="26"><strong><a title="#t=13:20" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=13:20" data-href= "#t=13:20">13:20</a></strong> non-standard-element</li> <li class="code-line" data-line="27"><strong><a title="#t=17:26" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=17:26" data-href="#t=17:26">17:26</a></strong> Button must have a type</li> <li class="code-line" data-line="28"><strong><a title="#t=18:56" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=18:56" data-href="#t=18:56">18:56</a></strong> Triangles out of borders</li> <li class="code-line" data-line="29"><strong><a title="#t=20:40" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=20:40" data-href="#t=20:40">20:40</a></strong> Overflow:hidden to clear a float</li> <li class="code-line" data-line="30"><strong><a title="#t=20:55" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=20:55" data-href="#t=20:55">20:55</a></strong> Always pass noopener to links!</li> <li class="code-line" data-line="31"><strong><a title="#t=22:16" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/423%20-%20CSS%20JS%20Hacks%20We%E2%80%99re%20Fine%20With.md#t=22:16" data-href="#t=22:16">22:16</a></strong> Inline styles</li> </ul> <h2 id="tweet-us-your-tasty-treats" class="code-line" data-line= "33">Tweet us your tasty treats</h2> <ul class="code-line" data-line="35"> <li class="code-line" data-line="35"><a title= "https://www.instagram.com/stolinski/" href= "https://www.instagram.com/stolinski/" data-href= "https://www.instagram.com/stolinski/">Scott's Instagram</a></li> <li class="code-line" data-line="36"><a title= "https://www.instagram.com/LevelUpTutorials/" href= "https://www.instagram.com/LevelUpTutorials/" data-href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="code-line" data-line="37"><a title= "https://www.instagram.com/wesbos/" href= "https://www.instagram.com/wesbos/" data-href= "https://www.instagram.com/wesbos/">Wes' Instagram</a></li> <li class="code-line" data-line="38"><a title= "https://twitter.com/wesbos" href="https://twitter.com/wesbos" data-href="https://twitter.com/wesbos">Wes' Twitter</a></li> <li class="code-line" data-line="39"><a title= "https://www.facebook.com/wesbos.developer" href= "https://www.facebook.com/wesbos.developer" data-href= "https://www.facebook.com/wesbos.developer">Wes' Facebook</a></li> <li class="code-line" data-line="40"><a title= "https://twitter.com/stolinski" href= "https://twitter.com/stolinski" data-href= "https://twitter.com/stolinski">Scott's Twitter</a></li> <li class="code-line" data-line="41">Make sure to include <a title="https://twitter.com/SyntaxFM" href= "https://twitter.com/SyntaxFM" data-href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this Hasty Treat, Scott and Wes talk about CSS + JS Hacks that they're ok with using.
 Sponsor - Freshbooks Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the "How did you hear about us?" section.
 Sponsor - Sentry If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up.
 Show Notes 
00:53 What are the things in web dev, that feel wrong or hacky when starting out, but are actually totally accepted to do?

02:09 Sponsor: Sentry

03:12 Sponsor: Freshbooks

05:32 Negative margins in CSS

07:53 Not Passing a radix to parseInt()

10:17 -50% translation 50% direction

11:27 Overwriting Arguments in a function

13:20 non-standard-element

17:26 Button must have a type

18:56 Triangles out of borders

20:40 Overflow:hidden to clear a float

20:55 Always pass noopener to links!

22:16 Inline styles
 Tweet us your tasty treats Scott's Instagram
 LevelUpTutorials Instagram
 Wes' Instagram
 Wes' Twitter
 Wes' Facebook
 Scott's Twitter
 Make sure to include @SyntaxFM in your tweets

Aplikace Youradio Talk

CSS + JS Hacks We’re Fine With

Poslechněte si podcast