TopPodcast.com
Menu
  • Home
  • Top Charts
  • Top Networks
  • Top Apps
  • Top Independents
  • Top Podfluencers
  • Top Picks
    • Top Business Podcasts
    • Top True Crime Podcasts
    • Top Finance Podcasts
    • Top Comedy Podcasts
    • Top Music Podcasts
    • Top Womens Podcasts
    • Top Kids Podcasts
    • Top Sports Podcasts
    • Top News Podcasts
    • Top Tech Podcasts
    • Top Crypto Podcasts
    • Top Entrepreneurial Podcasts
    • Top Fantasy Sports Podcasts
    • Top Political Podcasts
    • Top Science Podcasts
    • Top Self Help Podcasts
    • Top Sports Betting Podcasts
    • Top Stocks Podcasts
  • Podcast News
  • About Us
  • Podcast Advertising
  • Contact
Not in our directory?
Add Show Here
Podcast Equipment
Center

toppodcastlogoOur TOPPODCAST Picks

  • Comedy
  • Crypto
  • Sports
  • News
  • Politics
  • True Crime
  • Business
  • Finance

Follow Us

toppodcastlogoStay Connected

    View Top 200 Chart
    Back to Rankings Page
    News

    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.

    Advertise
    • Apple Podcasts
    • Google Play
    • Spotify

    Latest Episodes:
    How We Record, Edit, and Host Our Courses Sep 11, 2019
    Show notes

    In this episode, Scott and Wes talk about how they make courses — recording, editing, hosting, best practices, and more!

    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.

    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

    5:42 - Recording

    • Wes:

      • Screenflow
      • Uberlayer
      • Loopback
      • Heil PR40
      • Heil PL-2T
      • dbx 286s
      • Focusrite Scarlett 2i2
    • Scott:

      • Screenflick
      • iShow HD
      • Divvy
      • Principal for Mac
      • EV RE-20
      • dbx 286s
      • Focusrite Scarlett 2i2
      • Sony a7 III
      • Logic

    33:04 - Editing

    • Wes:

      • Screenflow
      • Speed up slow typing
      • Edit out some goof-ups (but not all)
      • Edit immediately after recording so I’m in the same headspace and can easily re-record
    • Scott:

      • Hire a video editor
      • Cut out all blank spaces in audio, because I know that pauses are typically where I stop to think
      • Normalize audio
      • DaVinci Resolve 16

    42:31 - Hosting

    • Wes:

      • Wistia
      • Vimeo
      • Rev
      • Backblaze
      • Amazon S3
      • My own course platform, with additional controls added via React
    • Scott:

      • YouTube
      • Vimeo
      • Plyr Video Player
      • Backblaze
      • Amazon S3
      • Custom course platform

    52:46 - Common Questions

    Links
    • Syntax 014: Our Stacks Explained
    • Adobe Premier Pro
    • Figma
    • VS Code
    • Audio-Technica AT2020
    • Blue Bluebird
    • BSW
    • Sweetwater
    • Tim Smith - Video Editing
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Hyperdrive
    • Wes: PicQuic Screwdriver
    Shameless Plugs
    • Scott: LevelUpTutorials Pro - Advanced Gatsby & Shopify - Sign up for the year and save 25%!
    • Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off!
    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

    Hasty Treat - Moving from PHP to Node Sep 09, 2019
    Show notes

    In this Hasty Treat, Scott and Wes talk about moving from PHP to Node — pitfalls to avoid, best practices 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”.

    Show Notes

    3:43 - Servers need to be started and baby sat

    4:48 - There is no built-in file system based routing

    6:34 - Some "gotchas"

    7:02 - Functional programming

    8:17 - Async vs sync

    11:11 - Event lifecycles

    12:09 - Dependencies

    14:17 - Keyed arrays

    Links
    • Wes’ tweet thread
    • Forever
    • PM2
    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

    Building Steam Games with React Sep 04, 2019
    Show notes

    In this episode, Scott and Wes talk with Drew Conley about building games with Javascript.

    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.

    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

    1:58 - What is Danger Crew?

    5:25 - Did you have a background in game dev before this?

    8:36 - What were the initial resources you went to to make a game in React?

    10:27 - How much of it is Canvas?

    13:06 - What other libraries are you using?

    14:00 - How did you lay out the environments?

    16:35 - How is text rendered?

    22:40 - How did you do all of the animation?

    26:08 - What performance issues did you run into?

    27:31 - How do you handle user states and saves?

    29:21 - Is there any server side aspect?

    30:42 - What was the process for creating the level editor?

    34:38 - How did you publish the game / wrap it as an executable to sell?

    38:16 - How do you update it?

    39:43 - How difficult was creating the game logic?

    41:20 - The dev theme in the game is super prominent, did that make working on it more fun?

    Links
    • Steam
    • Danger Crew
    • aseprite
    • Buy Danger Crew
    • Drew Conley
    • Pixels to SVG
    • GameMaker
    • Making an editor
    • Electron
    ××× SIIIIICK ××× PIIIICKS ×××
    • Drew: Strange Planet Instagram
    • Wes: MX Master Config Tweet Thread
    • Scott: Figma
    Shameless Plugs
    • Drew: Danger Crew
    • Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off!
    • Scott: LevelUpTutorials Pro - Advanced Gatsby & Shopify
    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

    Hasty Treat - Stump'd Sep 02, 2019
    Show notes

    In this Hasty Treat, Scott and Wes are back with another edition of Stump’d! where they try to stump each other with interview questions.

    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”.

    Show Notes

    3:54 - What is the difference between NULL and undefined?

    5:40 - What is short circuit evaluation in JS?

    7:25 - What is use strict?

    9:07 - What is the only value not equal to itself in JS?

    10:36 - When would you create a static class member?

    11:54 - What is a pure function?

    13:08 - What is JSONP?

    14:24 - Describe the layout of the CSS box model?

    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

    How to Build an API Aug 28, 2019
    Show notes

    In this episode, Scott and Wes talk about creating APIs — what’s happening behind the scenes and why it’s important.

    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.

    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 and using the coupon code “tastytreat”.

    Show Notes

    2:15 - How do you build an API from scratch?

    3:54 - Choose an API type

    • REST
    • GraphQL

    8:15 - Setup some sort of server that will accept requests and send responses

    • Express
    • Koa
    • Meteor

    11:11 - Document the endpoints

    • What is the end point
    • What parameters are required
      • Filters
      • Sorting
    • Headers required
    • What you get back when you hit this endpoint
    • Any request limits
    • Examples in common languages
      • JS
      • PHP
      • Ruby

    21:20 - Naming

    • Make it obvious

    27:39 - Securing

    • Only accept requests from logged-in users
      • oAuth
      • Cookie/Session
      • jwt
    • API key
    • CORS
    • Check roles - access level
    • Syntax 055: Hasty Treat - User Role Systems

    32:42 - Protecting

    • Rate limit
    • Whitelist / blacklist
    • Cloudflare

    36:00 - Write resolvers

    • Modify data if needed
    • Send back the data requested
    • Send back the correct HTTP code
    • Log what happened

    37:56 - Tools

    • Postman
    • Swagger
    Links
    • Stripe
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Hoax Podcast
    • Wes: Solar Lights
    Shameless Plugs
    • Scott: LevelUpTutorials Pro - Advanced Gatsby & Shopify
    • Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off!
    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

    Hasty Treat - Wes & Scott Look At Svelte 3 Aug 26, 2019
    Show notes

    In this Hasty Treat, Scott and Wes talk about Svelte 3 — initial impressions and more!

    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

    2:16 - What is Svelte?

    11:32 - Sapper

    13:05 - Svelte Native

    14:58 - Questions we have

    • What’s the Typescript story here?
    • How hard would it be to convert a large React app to Svelte?
    • Will Svelte be able to capture the market share it needs to grow and compete?
    • Would you (Wes & Scott) use this?
    Links
    • https://svelte.dev/examples#hello-world
    • Mustache
    • Webpack
    • Rollup.js
    • Next.js
    • Sapper
    • Svelte Native
    • React Native
    • Svelte - Typescript support
    • Rethinking Reactivity
    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

    Potluck - Deploying Applications × Typescript × Live Coding with Twitch × Fullstack Architecture × More! Aug 21, 2019
    Show notes

    It’s another potluck! In this episode, Scott and Wes answer your questions about deploying applications, the value of Typescript, live coding via Twitch 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 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

    1:35 - Q: I prefer using grid-row and grid-column instead of grid-area. But is grid-area more performant? For example, in Flexbox, it’s a best practice to use the shorthand flex property instead of writing out flex-grow, flex-shrink and flex-basis.

    4:04 - Q: Do you have any advice how to deploy an application? What do you think about AWS, Zeit, Heroku, Firebase? Do you use automation tools like Circle CI or Buddy.works? I also wonder if we should keep whole application on one server, or split it up.

    9:36 - Q: A career advice question: I’m best at being a front-end/javascript developer - but in a quest to my make job(s) easier, I’ve also been getting into fullstack architecture - namely CI/CD (TravisCI, GitlabCI) and Kubernetes. I’m feeling like I’m spreading myself a little thin, and I guess I’m just finding it a bit frustrating (configuring Kubernetes is a lot of bashing your head against the wall). I know that my skills as a front-end developer are already valuable, whereas I can’t say the same for my Kubernetes/CICD skillset. I’m wondering whether I should narrow my scope a bit. Maybe this is just the frustrating hump I’m climbing over, and in six months I’ll be happy with where I’m at, but interested to hear your thoughts. One thing I’ve been thinking about is, maybe I should step back from the network architecture type stuff (ie. Kubernetes) and focus more on DevOps that is closer to the front-end stack (ie. writing tests, VSCode tooling, commit hooks, CI tools, etc.).

    13:07 - Q: Do you think Typescript adds value to React, or more complexity than value? When should you choose Typescript for a project?

    18:09 - Q: I am in a well known Bootcamp, and as of right now (from what they have taught us) this is what I am working with: HTML/CSS, JavaScript, jQuery, Node, Express, SQL, Auth, MVC, APIs, React, Redux. As we finish off the program, they are going over Java. I do want to learn Java, however I feel like my time would be better spent fine-tuning my knowledge on my stack. And I can learn Java at some other time. Do you recommend that I fully engage with Java and try to absorb some of the basics and fundamentals now, or do you recommend that I take this last month we have here and strengthen my current skills so I do better during my technical interviews? And by the way thanks for everything you do, it helps :)

    22:02 - Q: Have you seen the live coding going on at Twitch? Thoughts? Maybe a Syntax stream in the future? There’s a good list at livecoders.dev. Thanks for all you do. Keep killin’ it!

    26:11 - Q: How do you handle people (i.e. C# bastards) who think JavaScript is a joke and is going to be overthrown by Blazor or some other C# library framework? Can’t we all just get along and live in the same industry? I’m having a hard time being the adult in these kinds of responses around the web, and in random discussions with people I know very well.

    29:55 - Q: There are plenty of places saying that it is important to secure API keys by not embedding them in front-end code. Cool. I’m on board! But there is not many that tell you specifically how to do this. How do you safely use an API key in a CRUD project?

    34:15 - Q: Do you plan to launch a Syntax.fm app?

    45:49 - Q: I was hired as a junior developer at a company in the last year. It’s my first development job and I was so excited. The interview and application were all about React and fullstack development. However now that I’ve been here a while, I have found out the company does primarily dev ops work. None of this was mentioned in the interview or application, but it looks like soon it will be the majority of my workload. I am feeling very discouraged and was wondering what you guys would do in this situation?

    Links
    • Develop Denver
    • AWS
    • Zeit
    • Heroku
    • CircleCI
    • Buddy.works
    • Travis CI
    • Gitlab CI
    • Kubernetes
    • VSCode
    • Typescript
    • Blazor
    • Linkedin
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: VIVO Premium Heavy Duty Arm
    • Wes: AmazonBasics Pro-Style Spring Sprayer Kitchen Faucet, Oil-Rubbed Bronze
    Shameless Plugs
    • Scott: LevelUpTutorials Pro - Gatsby Ecommerce
    • Wes: All Courses - Beginner JS 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

    Hasty Treat - How To Publish A React Component To NPM Aug 19, 2019
    Show notes

    In this Hasty Treat, Scott and Wes talk about documentation libraries, starting and maintaining projects, how to publish React components to NPM, 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”.

    Show Notes

    2:40 - Create React Library

    6:55 - Documentation libraries

    10:54 - What I’m building

    13:13 - Linking library to projects

    14:52 - Improvements and community thoughts

    Links
    • Rollup
    • testing-library/react-testing-library
    • transitive-bullshit/create-react-library
    • leveluptuts/fresh
    • How To Make a React Component Library - Making A React Library
    • React Styleguidist
    • Storybook
    • Docz
    • DocSource
    • npm-link
    • Yarn
    • wesbos/dump
    • wesbos/Waait
    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

    State In React Aug 14, 2019
    Show notes

    In this episode of Syntax, Scott and Wes talk about state in React: local state, global state, UI state, data state, caching, API data and more!

    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.

    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:38 - What is state?

    4:58 - What kind of things are kept in state?

    • Data
      • Temporary client side data
        • From forms, button clicks, etc.
      • Cached server data
      • Data from API
    • UI status
      • AKA isModalOpen
      • isToggled

    12:48 - Global state vs. Local state

    • Ask yourself: does the data need to be accessed outside this component?
      • If data does need to be accessed a little higher, you can simply move where that state lives. React calls this “lifting state”.
    • Do you count Apollo API calls as global state?

    21:15 - Managing Local state

    • useState, setState
    • Passing state & update functions down
    • State machines

    31:12 - Approaches to Global state

    • Redux

      • Complicated, hard to learn
      • Very useful, organized and structured
      • Actions, reducers and more
      • Time traveling do to nature of store
      • Immutability
      • Tons of Redux based hooks libs
    • Mobx

      • Based on Observables
        • An Observable is like a Stream and allows to pass zero or more events where the callback is called for each event. Often Observable is preferred over Promise because it provides the features of Promise and more.
    • Context

      • Functions just work and update global state.
      • Downside is there are no fancy tools
    • Apollo

      • Apollo quires for data in global cache
      • Apollo client for global UI state
        • Not quite there, isn’t super elegant
    Links
    • Thinkso
    • Learn Node!
    • Meteor Session
    • xstate-react
    • React Context
    • Mobx
    • easy-peasy
    • hype.codes
    • providerCompose.js
    • Relay
    • React Podcast
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Command Line Heroes
    • Wes: MASSDROP CTRL MECHANICAL KEYBOARD
    Shameless Plugs
    • Scott: LevelUpTutorials - Gatsby Ecommerce — Subscribe before price goes up!
    • Wes: All Courses — Use the coupon code ‘Syntax’ for $10 off!
    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

    Hasty Treat - Remote Internet Aug 12, 2019
    Show notes

    In this Hasty Treat, Scott and Wes talk about remote internet! Remote internet is an important because it opens up living options to developers as the industry moves toward more remote work.

    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 for more info.

    Show Notes

    4:31 - Remote internet options

    7:55 - Modems and routers

    10:52 - Antennas

    13:47 - Boosters

    14:54 - Plans, data and speeds

    20:11 - Other things to think about

    Links
    • Deadmau5 house
    • ZTE MF288
    • Netgear LB1120
    • Mofi Routers
    • ZBT WE826T
    • Rogers
    • Ubiquiti Networks
    • Tomato Firmware
    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

    Previous 1 86 87 88 89 90 105 Next

    Related Podcasts

    Inside Strategic Coach: Connecting Entrepreneurs With What Really Matters

    1

    Inside Strategic Coach: Connecting Entrepreneurs With What Really Matters Business
    WSJ Your Money Briefing

    2

    WSJ Your Money Briefing Business
    FORTUNE Unfiltered with Aaron Task

    3

    FORTUNE Unfiltered with Aaron Task Business
    FORTUNE OnStage Presents: The Most Powerful Women

    4

    FORTUNE OnStage Presents: The Most Powerful Women Business
    Slate Money

    5

    Slate Money Business
    In The Dark – The New Yorker

    6

    In The Dark – The New Yorker Business News
    footer-logo

    Contact Us

    Toll Free: 844-670-7747

    Links

    • Home
    • Top Charts
    • Networks
    • Apps
    • Independents Podcasts
    • Podcast Advertising
    • Podcast News
    • Contact Us
    • About Us
    • Analytics & Insights

    Stay Connected

      Privacy, Terms of Use & Our Code of Ethics Protecting Content Creators Copyrights