Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Hasty Treat - Getting Buy-in for a Tool Like Prettier From Your Team

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 class="has-line-data" data-line-start="7" data-line-end="8">In this Hasty Treat, Scott and Wes talk about getting buy-in from your team when using new tools.</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "LogRocket__Sponsor_9" name="LogRocket__Sponsor_9"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at <a href= "https://logrocket.com/syntax">logrocket.com/syntax</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Show_Notes_12" name="Show_Notes_12"></a>Show Notes</h2> <p class="has-line-data" data-line-start="14" data-line-end="15"> 02:53 - Q: "I wrote a long message to our architect asking if I could install prettier into our component generator for new projects moving forward, and the response I got was: “Don’t auto-format, not all devs want that and prettier doesn’t always format the way I like, I don’t want to enforce that on devs.”</p> <p class="has-line-data" data-line-start="16" data-line-end="17"> This sucks because I know the codebase would benefit so much. Right now every time I visit a project so much of the code is not spaced out that it makes it hard to read quickly for me, lots of the React code is bunched up with no spacing - it’s a mess to read for me especially because I am very organized. If this was your situation where you know a new tool/standard is something that can help a lot but it’s shot down, do you just give up? I don’t know how to respond to this because I am the only dev who has ever proposed this at my company and I just started here.</p> <p class="has-line-data" data-line-start="18" data-line-end="19"> 05:03 - Lots to unpack here</p> <ol> <li class="has-line-data" data-line-start="20" data-line-end="21"> Some senior devs don’t like getting suggestions from other devs. There is a sense that these things change quickly and I bet there is some anxiety over that at play here.</li> <li class="has-line-data" data-line-start="21" data-line-end="23"> Senior devs know better than to slap new tools into the codebase because they have probably done it and regretted it. What if it broke your code.</li> </ol> <p class="has-line-data" data-line-start="23" data-line-end="24"> 08:20 - So what can you do?</p> <ol> <li class="has-line-data" data-line-start="25" data-line-end="26"> Ask for their thoughts on a tool instead of suggesting it - it seems you have done this already</li> <li class="has-line-data" data-line-start="26" data-line-end="27"> Show the dev that even though it looks weird, it’s better for readability.</li> <li class="has-line-data" data-line-start="27" data-line-end="28"> Look at existing guidelines and try to match the settings as close as possible (not always an option with prettier).</li> <li class="has-line-data" data-line-start="28" data-line-end="29"> Put together a solid argument for it, written down.</li> <li class="has-line-data" data-line-start="29" data-line-end="30"> Use it in a smaller project. Everyone is against prettier at first, but once they use it, they realize how amazing it is.</li> <li class="has-line-data" data-line-start="30" data-line-end="32"> Can you just Prettier the code yourself and then format it otherwise before you check it in? This depends on if you have existing formats.</li> </ol> <h2 class="code-line" data-line-start="32" data-line-end="33"> <a id="Links_32" name="Links_32"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="33" data-line-end="34"> <a href="https://prettier.io/">Prettier</a></li> <li class="has-line-data" data-line-start="34" data-line-end="36"> <a href= "https://github.com/beautify-web/js-beautify">js-beautify</a></li> </ul> <h2 class="code-line" data-line-start="36" data-line-end="37"> <a id="Tweet_us_your_tasty_treats_36" name= "Tweet_us_your_tasty_treats_36"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="38" data-line-end="39"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="39" data-line-end="40"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="40" data-line-end="41"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="41" data-line-end="42"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="42" data-line-end="43"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="43" data-line-end="44"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this Hasty Treat, Scott and Wes talk about getting buy-in from your team when using new tools.
 LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
 Show Notes 02:53 - Q: "I wrote a long message to our architect asking if I could install prettier into our component generator for new projects moving forward, and the response I got was: “Don’t auto-format, not all devs want that and prettier doesn’t always format the way I like, I don’t want to enforce that on devs.”
 This sucks because I know the codebase would benefit so much. Right now every time I visit a project so much of the code is not spaced out that it makes it hard to read quickly for me, lots of the React code is bunched up with no spacing - it’s a mess to read for me especially because I am very organized. If this was your situation where you know a new tool/standard is something that can help a lot but it’s shot down, do you just give up? I don’t know how to respond to this because I am the only dev who has ever proposed this at my company and I just started here.
 05:03 - Lots to unpack here
  Some senior devs don’t like getting suggestions from other devs. There is a sense that these things change quickly and I bet there is some anxiety over that at play here.
 Senior devs know better than to slap new tools into the codebase because they have probably done it and regretted it. What if it broke your code.
  08:20 - So what can you do?
  Ask for their thoughts on a tool instead of suggesting it - it seems you have done this already
 Show the dev that even though it looks weird, it’s better for readability.
 Look at existing guidelines and try to match the settings as close as possible (not always an option with prettier).
 Put together a solid argument for it, written down.
 Use it in a smaller project. Everyone is against prettier at first, but once they use it, they realize how amazing it is.
 Can you just Prettier the code yourself and then format it otherwise before you check it in? This depends on if you have existing formats.
  Links  Prettier

 js-beautify

  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

Hasty Treat - Getting Buy-in for a Tool Like Prettier From Your Team

Poslechněte si podcast