Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

New Year, New You. What to Focus on in 2022.

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 episode of Syntax, Scott and Wes talk through what to focus on at a beginner, intermediate, and advanced levels of coding skills.</p> <h2 id="sentry---sponsor" class="code-line" data-line="9">Sentry - Sponsor</h2> <p class="code-line" data-line="11">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="linode---sponsor" class="code-line" data-line="13">Linode - Sponsor</h2> <p class="code-line" data-line="15">Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at <a title= "https://linode.com/syntax" href="https://linode.com/syntax" data-href="https://linode.com/syntax">linode.com/syntax</a>. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit <a title="https://linode.com/syntax" href= "https://linode.com/syntax" data-href= "https://linode.com/syntax">linode.com/syntax</a> and click on the “Create Free Account” button to get started.</p> <h2 id="freshbooks---sponsor" class="code-line" data-line="17"> Freshbooks - Sponsor</h2> <p class="code-line" data-line="19">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="show-notes" class="code-line" data-line="21">Show Notes</h2> <ul class="code-line" data-line="23"> <li class="code-line" data-line="23"><strong><a title="#t=02:30" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=02:30" data-href="#t=02:30">02:30</a></strong> Semantic HTML</li> <li class="code-line" data-line="24"><strong><a title="#t=07:36" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=07:36" data-href="#t=07:36">07:36</a></strong> JavaScript Data</li> <li class="code-line" data-line="25"><strong><a title="#t=08:54" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=08:54" data-href="#t=08:54">08:54</a></strong> Issues & technical workflow</li> <li class="code-line" data-line="26"><strong><a title="#t=11:40" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=11:40" data-href="#t=11:40">11:40</a></strong> Emailing People</li> <li class="code-line" data-line="27"><a title= "https://syntax.fm/show/117/hasty-treat-how-to-email-busy-people" href= "https://syntax.fm/show/117/hasty-treat-how-to-email-busy-people" data-href= "https://syntax.fm/show/117/hasty-treat-how-to-email-busy-people">Syntax 117: How to Email Busy People</a></li> <li class="code-line" data-line="28"><strong><a title="#t=13:49" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=13:49" data-href="#t=13:49">13:49</a></strong> Make something animated with CSS</li> <li class="code-line" data-line="29"><a title= "https://open-props.style" href="https://open-props.style/" data-href="https://open-props.style">Open Props Style</a></li> <li class="code-line" data-line="30"><strong><a title="#t=16:04" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=16:04" data-href="#t=16:04">16:04</a></strong> Make a full stack contact form in a framework</li> <li class="code-line" data-line="31"><strong><a title="#t=16:52" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=16:52" data-href="#t=16:52">16:52</a></strong> Sponsor: Sentry</li> <li class="code-line" data-line="32"><strong><a title="#t=18:59" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=18:59" data-href="#t=18:59">18:59</a></strong> CSS Variables</li> <li class="code-line" data-line="33"><strong><a title="#t=22:36" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=22:36" data-href="#t=22:36">22:36</a></strong> Server Side fundamentals</li> <li class="code-line" data-line="34"><strong><a title="#t=24:28" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=24:28" data-href="#t=24:28">24:28</a></strong> Meeting Skills</li> <li class="code-line" data-line="35"><strong><a title="#t=28:36" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=28:36" data-href="#t=28:36">28:36</a></strong> Help organize a codebase or repo.</li> <li class="code-line" data-line="36"><strong><a title="#t=30:26" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=30:26" data-href="#t=30:26">30:26</a></strong> Make something animated with JS</li> <li class="code-line" data-line="37"><strong><a title="#t=31:40" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=31:40" data-href="#t=31:40">31:40</a></strong> Write a bot</li> <li class="code-line" data-line="38"><strong><a title="#t=33:35" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=33:35" data-href="#t=33:35">33:35</a></strong> Sponsor: Linode</li> <li class="code-line" data-line="39"><strong><a title="#t=34:51" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=34:51" data-href="#t=34:51">34:51</a></strong> Write CI / CD actions / tools</li> <li class="code-line" data-line="40"><strong><a title="#t=37:55" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=37:55" data-href="#t=37:55">37:55</a></strong> Advanced Typescript</li> <li class="code-line" data-line="41"><strong><a title="#t=38:32" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=38:32" data-href="#t=38:32">38:32</a></strong> Teach at your company</li> <li class="code-line" data-line="42"><strong><a title="#t=39:35" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=39:35" data-href="#t=39:35">39:35</a></strong> Speak at a conference</li> <li class="code-line" data-line="43"><strong><a title="#t=40:45" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=40:45" data-href="#t=40:45">40:45</a></strong> Make something 3D</li> <li class="code-line" data-line="44"><a title= "https://www.framer.com/docs/three-introduction/#:~:text=%203D%3A%20Introduction%20%201%20%0AOverview.%20Framer%20Motion,animation%20options%20as...%204%20%0AExamples.%20%20More%20" href= "https://www.framer.com/docs/three-introduction/#:~:text=%203D%3A%20Introduction%20%201%20%0AOverview.%20Framer%20Motion,animation%20options%20as...%204%20%0AExamples.%20%20More%20" data-href= "https://www.framer.com/docs/three-introduction/#:~:text=%203D%3A%20Introduction%20%201%20%0AOverview.%20Framer%20Motion,animation%20options%20as...%204%20%0AExamples.%20%20More%20"> Frame 3D</a></li> <li class="code-line" data-line="45"><a title= "https://docs.pmnd.rs/react-three-fiber/getting-started/introduction" href= "https://docs.pmnd.rs/react-three-fiber/getting-started/introduction" data-href= "https://docs.pmnd.rs/react-three-fiber/getting-started/introduction"> React 3 Fiber</a></li> <li class="code-line" data-line="46"><a title= "https://madewithsvelte.com/svelte-cubed" href= "https://madewithsvelte.com/svelte-cubed" data-href= "https://madewithsvelte.com/svelte-cubed">Svelte Cubed</a></li> <li class="code-line" data-line="47"><strong><a title="#t=42:03" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=42:03" data-href="#t=42:03">42:03</a></strong> Scrape and write something to collect data</li> <li class="code-line" data-line="48"><strong><a title="#t=44:15" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=44:15" data-href="#t=44:15">44:15</a></strong> Sick Picks!</li> <li class="code-line" data-line="49"><strong><a title="#t=48:43" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/424%20-%20What%20to%20Focus%20on%20in%202022.md#t=48:43" data-href="#t=48:43">48:43</a></strong> Shameless Plugs</li> </ul> <h2 id= "%C3%97%C3%97%C3%97-siiiiick-%C3%97%C3%97%C3%97-piiiicks-%C3%97%C3%97%C3%97" class="code-line" data-line="51">××× SIIIIICK ××× PIIIICKS ×××</h2> <ul class="code-line" data-line="53"> <li class="code-line" data-line="53">Scott: <a title= "https://www.netflix.com/browse/genre/840232?jbv=81464765" href= "https://www.netflix.com/browse/genre/840232?jbv=81464765" data-href= "https://www.netflix.com/browse/genre/840232?jbv=81464765">14 Peaks: Nothing Is Impossible - Netflix</a></li> <li class="code-line" data-line="54">Wes: <a title= "https://amzn.to/3teDSYa" href="https://amzn.to/3teDSYa" data-href= "https://amzn.to/3teDSYa">Booty Slippers</a></li> </ul> <h2 id="shameless-plugs" class="code-line" data-line="56">Shameless Plugs</h2> <ul class="code-line" data-line="58"> <li class="code-line" data-line="58">Scott: <a title= "https://www.leveluptutorials.com/pro" href= "https://www.leveluptutorials.com/pro" data-href= "https://www.leveluptutorials.com/pro">Astro Course</a> - Sign up for the year and save 50%!</li> <li class="code-line" data-line="59">Wes: <a title= "https://wesbos.com/courses/" href="https://wesbos.com/courses/" data-href="https://wesbos.com/courses/">All Courses</a> - Black Friday sale!</li> <li class="code-line" data-line="60"><a title= "https://www.gitpod.io/blog/psychology-of-devx" href= "https://www.gitpod.io/blog/psychology-of-devx" data-href= "https://www.gitpod.io/blog/psychology-of-devx">Psychology of Devx</a></li> <li class="code-line" data-line="61"><a title= "https://www.gitpod.io/community" href= "https://www.gitpod.io/community" data-href= "https://www.gitpod.io/community">Gitpod Community</a></li> <li class="code-line" data-line="62"><a title= "https://www.gitpod.io/blog/workshops-as-code" href= "https://www.gitpod.io/blog/workshops-as-code" data-href= "https://www.gitpod.io/blog/workshops-as-code">Workshops as Code</a></li> <li class="code-line" data-line="63"><a title= "https://ghuntley.com" href="https://ghuntley.com/" data-href= "https://ghuntley.com">Ghuntley.com</a></li> </ul> <h2 id="tweet-us-your-tasty-treats" class="code-line" data-line= "65">Tweet us your tasty treats</h2> <ul class="code-line" data-line="67"> <li class="code-line" data-line="67"><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="68"><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="69"><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="70"><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="71"><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="72"><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="73">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 episode of Syntax, Scott and Wes talk through what to focus on at a beginner, intermediate, and advanced levels of coding skills.
 Sentry - Sponsor 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.
 Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started.
 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 
02:30 Semantic HTML

07:36 JavaScript Data

08:54 Issues & technical workflow

11:40 Emailing People
 Syntax 117: How to Email Busy People

13:49 Make something animated with CSS
 Open Props Style

16:04 Make a full stack contact form in a framework

16:52 Sponsor: Sentry

18:59 CSS Variables

22:36 Server Side fundamentals

24:28 Meeting Skills

28:36 Help organize a codebase or repo.

30:26 Make something animated with JS

31:40 Write a bot

33:35 Sponsor: Linode

34:51 Write CI / CD actions / tools

37:55 Advanced Typescript

38:32 Teach at your company

39:35 Speak at a conference

40:45 Make something 3D
 Frame 3D
 React 3 Fiber
 Svelte Cubed

42:03 Scrape and write something to collect data

44:15 Sick Picks!

48:43 Shameless Plugs
 ××× SIIIIICK ××× PIIIICKS ××× Scott: 14 Peaks: Nothing Is Impossible - Netflix

 Wes: Booty Slippers

 Shameless Plugs Scott: Astro Course - Sign up for the year and save 50%!
 Wes: All Courses - Black Friday sale!
 Psychology of Devx
 Gitpod Community
 Workshops as Code
 Ghuntley.com
 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

Pro přehrání dalších podcastů se prosím registrujte.

New Year, New You. What to Focus on in 2022.

Poslechněte si podcast