Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Potluck - Tabs are better? × Coding Music × SEO × Is Angular good? × Biggie Smalls × Soy Sauce × 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 talk about tabs vs spaces, coding music, SEO, React vs Angular vs Vue vs Svelte, Rapping, Soy sauce and more!</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "Sentry__Sponsor_9" name="Sentry__Sponsor_9"></a>Sentry - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11">If you want to know what’s happening with your errors, track them with <a href="https://sentry.io/">Sentry</a>. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting <a href= "https://sentry.io/">Sentry.io</a> and using the coupon code “tastytreat”.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Freshbooks__Sponsor_12" name= "Freshbooks__Sponsor_12"></a>Freshbooks - Sponsor</h2> <p class="has-line-data" data-line-start="13" data-line-end="14"> Get a 30 day free trial of Freshbooks at <a href= "https://freshbooks.com/syntax">freshbooks.com/syntax</a> and put SYNTAX in the “How did you hear about us?” section.</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:18 - Q: I am potentially starting a job as an Angular developer (modern angular). But I am scared that, even though I will continue to stay on the cutting edge in my personal projects, using Angular in my job will make it harder to get a job after that in more modern tech like React. Do you think there is any truth to this?</p> <p class="has-line-data" data-line-start="19" data-line-end="20"> 5:30 - Q: Yo guys, saw soy sauce stirred up quite the controversy…lol. What are some big developer disagreements you guys have?</p> <p class="has-line-data" data-line-start="21" data-line-end="22"> 11:40 - Q: In JavaScript, ! == is the same as ! =, but I was told there was a slight technical difference. I cannot find what the difference is. Could you elaborate on this?</p> <p class="has-line-data" data-line-start="23" data-line-end="24"> 14:17 - Q: What are the rules on using another dev’s repos as a boiler plate? Example: Using Wes’s advanced react starter files to utilize his set up for my own project?</p> <p class="has-line-data" data-line-start="25" data-line-end="26"> 15:35 - Q: What music do you listen to while you code? As an extension, could we crowd source a dev playlist and host it on Spotify?</p> <p class="has-line-data" data-line-start="27" data-line-end="28"> 20:26 - Q: How do you go about working with different technologies and stacks (front-end related) when you have to accommodate for the client or other developers’ biases towards specific things. For example, you have to learn a different set of tools because in a new project someone doesn’t like what you use and says X is a better tool for the job.</p> <p class="has-line-data" data-line-start="29" data-line-end="30"> 23:11 - Q: I know there is no magic SEO silver bullet, but what are some best practices for implementing SEO into your website or web application?</p> <p class="has-line-data" data-line-start="31" data-line-end="32"> 27:26 - Q: When dealing with responsive sites, how do you go about respecting the request in iOS safari to show desktop sites?</p> <p class="has-line-data" data-line-start="33" data-line-end="34"> 28:45 - Q: I get confused about your usage of the word ‘app’. You don’t make iPhone or Android apps, but you often through the word around like “I would create a Node App”, or “Some of the apps I made” etc. Is it just website applications, or how exactly should I interpret “Node App” or “Web App” compared to a mobile app?</p> <p class="has-line-data" data-line-start="35" data-line-end="36"> 31:36 - Q: I wanted to ask your thoughts on transform class properties plugin from Babel? Heard the podcast on react state, I found it mind blowing when setting everything up without constructors.</p> <p class="has-line-data" data-line-start="37" data-line-end="38"> 36:53 - Q: I am a beginner, I have mostly learned front-end so far (HTML/CSS, JavaScript, React). Should I first get pretty good at these before I start learning some back-end? Or, should I actually start learning back-end now and have a basic knowledge of both front-end and back-end?</p> <p class="has-line-data" data-line-start="39" data-line-end="40"> 39:00 - Q: If for some reason React died today and you were no longer able to use it, which framework would you pick up and use full time? Would it be Vue or Angular? Or something new like Svelte?</p> <p class="has-line-data" data-line-start="41" data-line-end="42"> 40:11 - Q: What habits, strategies, or specific tools do you rely on to prevent your hard drives from filling up with useless files?</p> <ul> <li class="has-line-data" data-line-start="43" data-line-end="45"> <code>find . -name "node_modules" -type d -prune -exec rm -rf '{}' +</code></li> </ul> <p class="has-line-data" data-line-start="45" data-line-end="46"> 47:20 - Q: Which JS library is most like the Tesla Cybertruck?</p> <h2 class="code-line" data-line-start="47" data-line-end="48"> <a id="Links_47" name="Links_47"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="48" data-line-end="49"> <a href="https://tailwindcss.com/">Tailwind CSS</a></li> <li class="has-line-data" data-line-start="49" data-line-end="50"> <a href= "https://open.spotify.com/playlist/061zvEAIbt6ZxVZxtkk3ot?si=R74zdIRyScGYph5UiCHFcg"> Syntax Spotify Playlist</a></li> <li class="has-line-data" data-line-start="50" data-line-end="51"> <a href= "https://open.spotify.com/playlist/4sFWRZDOmCiR7abKNRmWjr?si=Kk0vlHtURFuIsPku1pZ-5A"> Head Bob Spotify Playlist</a></li> <li class="has-line-data" data-line-start="51" data-line-end="52"> <a href= "https://open.spotify.com/playlist/6RnddeJf0fd0kwYrLJbm3U?si=f9SFFYntQJ6buGNH1o0Uxw"> Retired Scenester Metalcore Spotify Playlist</a></li> <li class="has-line-data" data-line-start="52" data-line-end="53"> <a href="https://daisydiskapp.com/">DaisyDisk</a></li> <li class="has-line-data" data-line-start="53" data-line-end="54"> <a href="https://macpaw.com/cleanmymac">CleanMyMac</a></li> <li class="has-line-data" data-line-start="54" data-line-end="55"> <a href="https://www.backblaze.com/">Backblaze</a></li> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://www.tesla.com/cybertruck">Tesla Cybertruck</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://rxjs-dev.firebaseapp.com/">RxJS</a></li> <li class="has-line-data" data-line-start="57" data-line-end="58"> <a href= "https://marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode"> SynthWave '84 VS Code Theme</a></li> <li class="has-line-data" data-line-start="58" data-line-end="59"> <a href="http://www.pseudobry.com/robocop.js/">RoboCopJS</a></li> </ul> <h2 class="code-line" data-line-start="61" data-line-end="62"> <a id="_SIIIIICK__PIIIICKS__61" name= "_SIIIIICK__PIIIICKS__61"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="62" data-line-end="63"> Scott: <a href= "https://www.keychron.com/products/keychron-mechanical-keyboard">Keychron K1 Mechanical Keyboard</a></li> <li class="has-line-data" data-line-start="63" data-line-end="65"> Wes: <a href="https://www.everlane.com/uniform">Everlane Uniform Crew Neck</a></li> </ul> <h2 class="code-line" data-line-start="65" data-line-end="66"> <a id="Shameless_Plugs_65" name="Shameless_Plugs_65"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="66" data-line-end="67"> Scott: <a href="https://www.leveluptutorials.com/pro">Black Friday Sale on All Courses</a></li> <li class="has-line-data" data-line-start="67" data-line-end="69"> Wes: <a href="https://beginnerjavascript.com/">Beginner Javascript Course</a></li> </ul> <h2 class="code-line" data-line-start="69" data-line-end="70"> <a id="Tweet_us_your_tasty_treats_69" name= "Tweet_us_your_tasty_treats_69"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="70" data-line-end="71"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="71" data-line-end="72"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="72" data-line-end="73"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="73" data-line-end="74"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="74" data-line-end="75"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="75" data-line-end="76"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="76" data-line-end="77"> 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 talk about tabs vs spaces, coding music, SEO, React vs Angular vs Vue vs Svelte, Rapping, Soy sauce and more!
 Sentry - Sponsor If you want to know what’s happening with your errors, track them with Sentry. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting Sentry.io and using the coupon code “tastytreat”.
 Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section.
 Show Notes 3:18 - Q: I am potentially starting a job as an Angular developer (modern angular). But I am scared that, even though I will continue to stay on the cutting edge in my personal projects, using Angular in my job will make it harder to get a job after that in more modern tech like React. Do you think there is any truth to this?
 5:30 - Q: Yo guys, saw soy sauce stirred up quite the controversy…lol. What are some big developer disagreements you guys have?
 11:40 - Q: In JavaScript, ! == is the same as ! =, but I was told there was a slight technical difference. I cannot find what the difference is. Could you elaborate on this?
 14:17 - Q: What are the rules on using another dev’s repos as a boiler plate? Example: Using Wes’s advanced react starter files to utilize his set up for my own project?
 15:35 - Q: What music do you listen to while you code? As an extension, could we crowd source a dev playlist and host it on Spotify?
 20:26 - Q: How do you go about working with different technologies and stacks (front-end related) when you have to accommodate for the client or other developers’ biases towards specific things. For example, you have to learn a different set of tools because in a new project someone doesn’t like what you use and says X is a better tool for the job.
 23:11 - Q: I know there is no magic SEO silver bullet, but what are some best practices for implementing SEO into your website or web application?
 27:26 - Q: When dealing with responsive sites, how do you go about respecting the request in iOS safari to show desktop sites?
 28:45 - Q: I get confused about your usage of the word ‘app’. You don’t make iPhone or Android apps, but you often through the word around like “I would create a Node App”, or “Some of the apps I made” etc. Is it just website applications, or how exactly should I interpret “Node App” or “Web App” compared to a mobile app?
 31:36 - Q: I wanted to ask your thoughts on transform class properties plugin from Babel? Heard the podcast on react state, I found it mind blowing when setting everything up without constructors.
 36:53 - Q: I am a beginner, I have mostly learned front-end so far (HTML/CSS, JavaScript, React). Should I first get pretty good at these before I start learning some back-end? Or, should I actually start learning back-end now and have a basic knowledge of both front-end and back-end?
 39:00 - Q: If for some reason React died today and you were no longer able to use it, which framework would you pick up and use full time? Would it be Vue or Angular? Or something new like Svelte?
 40:11 - Q: What habits, strategies, or specific tools do you rely on to prevent your hard drives from filling up with useless files?
  find. -name "node_modules" -type d -prune -exec rm -rf '{}' +
  47:20 - Q: Which JS library is most like the Tesla Cybertruck?
 Links  Tailwind CSS

  Syntax Spotify Playlist

  Head Bob Spotify Playlist

  Retired Scenester Metalcore Spotify Playlist

 DaisyDisk

 CleanMyMac

 Backblaze

 Tesla Cybertruck

 RxJS

  SynthWave '84 VS Code Theme

 RoboCopJS

  ××× SIIIIICK ××× PIIIICKS ×××  Scott: Keychron K1 Mechanical Keyboard

 Wes: Everlane Uniform Crew Neck

  Shameless Plugs  Scott: Black Friday Sale on All Courses

 Wes: Beginner Javascript Course

  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 - Tabs are better? × Coding Music × SEO × Is Angular good? × Biggie Smalls × Soy Sauce × More!

Poslechněte si podcast