Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Potluck - Terminal Configs × CSS Reset × Flexbox × Freelancing × NPM Dependencies × Project Hand-off × More!

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">It’s another potluck! In this episode, Scott and Wes answer your questions about freelancing, handing off projects to other developers, terminal configs, podcast apps, how much flexbox is too much flexbox, npm dependencies, and more!</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "Sanity__Sponsor_9" name="Sanity__Sponsor_9"></a>Sanity - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> <a href="http://sanity.io/">Sanity.io</a> is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at <a href= "https://www.sanity.io/create">sanity.io/create</a>. Get an awesome supercharged free developer plan on <a href= "https://www.sanity.io/syntax">sanity.io/syntax</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Netlify__Sponsor_12" name="Netlify__Sponsor_12"></a>Netlify - Sponsor</h2> <p class="has-line-data" data-line-start="13" data-line-end="14"> Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up <a href= "https://netlify.com/syntax">netlify.com/syntax</a> for more info.</p> <h2 class="code-line" data-line-start="15" data-line-end="16"> <a id="Show_Notes_15" name="Show_Notes_15"></a>Show Notes</h2> <p class="has-line-data" data-line-start="17" data-line-end="18"> 3:49 - Q: I’m interested in freelancing full-time and have some projects, big and small, lined up over the next few months to work on the side. How much work is a good amount of work to transition into freelancing full-time?</p> <p class="has-line-data" data-line-start="19" data-line-end="20"> 9:52 - Q: How much flexbox is too much flexbox? Is it a bad idea to use a dozen flexboxes for a viewport-filling application?</p> <p class="has-line-data" data-line-start="21" data-line-end="22"> 13:19 - Q: Can you explain the “potential” benefit of resetting CSS and whether it’s necessary? In which circumstances should we use such an approach?</p> <p class="has-line-data" data-line-start="23" data-line-end="24"> 15:26 - Q: I would love to hear an episode, or potluck segment, about your shell/fish/zsh configs. Maybe explain little tweaks you’ve made and why you’ve chosen the shell you use.</p> <p class="has-line-data" data-line-start="25" data-line-end="26"> 23:26 - Q: I always get confused on when and how to use .bind() method. Any pointers on when I should use .bind(), like in what situations? I also see it used a lot in React apps, but have no idea why they are using it. Could you explain this in detail?</p> <p class="has-line-data" data-line-start="27" data-line-end="28"> 27:02 - What are your suggestions for handing off client sites for freelance work? I don’t take many contracts (I have another full time job) but I’ll take one here or there during summer to supplement a little bit. I’m finding it difficult to make a clean hand-off when the project is finished. The contractual requirements are met and like anything, there are always tweaks to be made. I’ll handle some minor deployment issues without billing, but I struggle with where to draw the line. What suggestions do you have?</p> <p class="has-line-data" data-line-start="29" data-line-end="30"> 35:19 - This question is for Wes. I live in Central New York, and every time I go on the highway heading north or south I see several Ontario license plates. Where are ya’ll going all the time? Is there a secret Canadian spot down here?</p> <p class="has-line-data" data-line-start="31" data-line-end="32"> 38:20 - Each time I re-open an old project I lose so much time with npm dependencies being outdated and it drives me mad! I’m starting to dislike npm and everything around it, but is it npm only? How does other languages like php, python or GO handle this mess of dependencies? Are we better today than yesterday and I’m just complaining about nothing?</p> <p class="has-line-data" data-line-start="33" data-line-end="34"> 43:50 - Which podcast player do you use (Android, PC, or other phone/tablet), and why? Where do you listen to them?</p> <h2 class="code-line" data-line-start="35" data-line-end="36"> <a id="Links_35" name="Links_35"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href= "https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox"> Flexbox</a></li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="https://facebook.github.io/react-native/">React Native</a></li> <li class="has-line-data" data-line-start="38" data-line-end="39"> <a href= "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid</a></li> <li class="has-line-data" data-line-start="39" data-line-end="40"> <a href= "https://necolas.github.io/normalize.css/">Normalize</a></li> <li class="has-line-data" data-line-start="40" data-line-end="41"> <a href="https://www.iterm2.com/">iTerm2</a></li> <li class="has-line-data" data-line-start="41" data-line-end="42"> <a href="https://ohmyz.sh/">zsh</a></li> <li class="has-line-data" data-line-start="42" data-line-end="43"> <a href="https://fishshell.com/">Fish</a></li> <li class="has-line-data" data-line-start="43" data-line-end="44"> <a href="https://hyper.is/">Hyper</a></li> <li class="has-line-data" data-line-start="44" data-line-end="45"> <a href="https://commandlinepoweruser.com/">Wes’ Command Line Power User Course</a></li> <li class="has-line-data" data-line-start="45" data-line-end="46"> <a href="https://overcast.fm/">Overcast</a></li> <li class="has-line-data" data-line-start="46" data-line-end="47"> <a href="https://www.pocketcasts.com/">Pocket Casts</a></li> <li class="has-line-data" data-line-start="47" data-line-end="48"> <a href="https://www.npr.org/podcasts/510289/planet-money">Planet Money</a></li> <li class="has-line-data" data-line-start="48" data-line-end="49"> <a href="http://podcasts.joerogan.net/">Joe Rogan</a></li> <li class="has-line-data" data-line-start="49" data-line-end="51"> <a href= "https://www.npr.org/podcasts/510325/the-indicator-from-planet-money"> The Indicator</a></li> </ul> <h2 class="code-line" data-line-start="51" data-line-end="52"> <a id="_SIIIIICK__PIIIICKS__51" name= "_SIIIIICK__PIIIICKS__51"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="52" data-line-end="53"> Scott: <a href="https://amzn.to/2oyCuA3">Garmin vivoactive 3</a></li> <li class="has-line-data" data-line-start="53" data-line-end="55"> Wes: <a href= "https://www.youtube.com/watch?v=9LL2AtHo1gk">Untitled Goose Game</a></li> </ul> <h2 class="code-line" data-line-start="55" data-line-end="56"> <a id="Shameless_Plugs_55" name="Shameless_Plugs_55"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="56" data-line-end="57"> Scott: <a href="https://www.leveluptutorials.com/pro">Svelte For Beginners</a> - Sign up for the year and save 25%!</li> <li class="has-line-data" data-line-start="57" data-line-end="59"> Wes: <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> </ul> <h2 class="code-line" data-line-start="59" data-line-end="60"> <a id="Tweet_us_your_tasty_treats_59" name= "Tweet_us_your_tasty_treats_59"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="60" data-line-end="61"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="61" data-line-end="62"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="62" data-line-end="63"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="63" data-line-end="64"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="64" data-line-end="65"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="65" data-line-end="66"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="66" data-line-end="67"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

It’s another potluck! In this episode, Scott and Wes answer your questions about freelancing, handing off projects to other developers, terminal configs, podcast apps, how much flexbox is too much flexbox, npm dependencies, and more!
 Sanity - Sponsor Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.
 Netlify - Sponsor Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info.
 Show Notes 3:49 - Q: I’m interested in freelancing full-time and have some projects, big and small, lined up over the next few months to work on the side. How much work is a good amount of work to transition into freelancing full-time?
 9:52 - Q: How much flexbox is too much flexbox? Is it a bad idea to use a dozen flexboxes for a viewport-filling application?
 13:19 - Q: Can you explain the “potential” benefit of resetting CSS and whether it’s necessary? In which circumstances should we use such an approach?
 15:26 - Q: I would love to hear an episode, or potluck segment, about your shell/fish/zsh configs. Maybe explain little tweaks you’ve made and why you’ve chosen the shell you use.
 23:26 - Q: I always get confused on when and how to use.bind() method. Any pointers on when I should use.bind(), like in what situations? I also see it used a lot in React apps, but have no idea why they are using it. Could you explain this in detail?
 27:02 - What are your suggestions for handing off client sites for freelance work? I don’t take many contracts (I have another full time job) but I’ll take one here or there during summer to supplement a little bit. I’m finding it difficult to make a clean hand-off when the project is finished. The contractual requirements are met and like anything, there are always tweaks to be made. I’ll handle some minor deployment issues without billing, but I struggle with where to draw the line. What suggestions do you have?
 35:19 - This question is for Wes. I live in Central New York, and every time I go on the highway heading north or south I see several Ontario license plates. Where are ya’ll going all the time? Is there a secret Canadian spot down here?
 38:20 - Each time I re-open an old project I lose so much time with npm dependencies being outdated and it drives me mad! I’m starting to dislike npm and everything around it, but is it npm only? How does other languages like php, python or GO handle this mess of dependencies? Are we better today than yesterday and I’m just complaining about nothing?
 43:50 - Which podcast player do you use (Android, PC, or other phone/tablet), and why? Where do you listen to them?
 Links  Flexbox

 React Native

 CSS Grid

 Normalize

 iTerm2

 zsh

 Fish

 Hyper

 Wes’ Command Line Power User Course

 Overcast

 Pocket Casts

 Planet Money

 Joe Rogan

  The Indicator

  ××× SIIIIICK ××× PIIIICKS ×××  Scott: Garmin vivoactive 3

 Wes: Untitled Goose Game

  Shameless Plugs  Scott: Svelte For Beginners - Sign up for the year and save 25%!
 Wes: Wes’ Instagram

  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

Potluck - Terminal Configs × CSS Reset × Flexbox × Freelancing × NPM Dependencies × Project Hand-off × More!

Poslechněte si podcast