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:
    Voice Coding is Really Good with Josh Comeau Nov 04, 2020
    Show notes

    In this episode of Syntax, Scott and Wes talk with Josh Comeau about coding with your voice, accessibility, bootcamps, animation, 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.

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

    Guests
    • Josh Comeau
    Show Notes

    01:48 - What is your background?

    04:33 - Coding with your voice

    08:32 - How do you code for a living if you can only do it for a few minutes a day?

    21:56 - How has it impacted your productivity?

    22:46 - Is it easier with a typed language like Typescript?

    26:05 - What about accessibility?

    27:14 - How good is the eye tracker?

    29:30 - What got you into animation?

    35:29 - Favorite app for animations?

    40:12 - Being a teacher

    41:44 - Is it worth going to a bootcamp?

    44:57 - Interactivity in teaching

    Links
    • joshwcomeau.com
    • @concordia_btcmp
    • @gatsbyjs
    • @khanacademy
    • @unsplash
    • Talon
    • Using Python to Code by Voice
    • Neuralink
    • Tobii 5
    • Moleskine Apps
    • VLC
    • VSCode
    • freeCodeCamp
    • Syntax 246: Bootcamps, Getting a Job, and Income Share Agreements with Heather Payne
    • https://joshwcomeau.com/css/full-bleed/
    • Nintendo Switch
    • Navigator.vibrate
    • Voice Driven Development
    ××× SIIIIICK ××× PIIIICKS ×××
    • Josh: The Utterly Uninteresting and Unadventurous Tales of Fred, the Vampire Accountant
    • Scott: The Neighborhood Listen
    • Wes: Every Tool’s a Hammer by Adam Savage
    Shameless Plugs
    • Josh: CSS for Javascript Developers | An online course that teaches the fundamentals of CSS for React/Vue devs
    • Scott: Animating Svelte - Sign up for the year and save 25%!
    • Wes: Master Gatsby - 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 - Certifications? Government Specified JavaScript Skills? Nov 02, 2020
    Show notes

    In this Hasty Treat, Scott and Wes talk about web dev certifications — are they worth it, or a waste of time?

    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

    02:12 - Certifications

    05:30 - We have standards, and people move faster than standards.

    • jQuery moved faster than vanilla JS
    • Typescript is sometimes preferred over regular JS
    • We have universities that offer web developer certs and many of them are a joke
    • The point is that programming is the wild west — it’s far too broad and moves far too fast for us to try and fit it in a box

    10:28 - Do certifications mean anything?

    14:30 - How do you know if you have enough skills (when you’re job hunting)?

    19:04 - Some jobs do require a certification

    • AWS
    • Google
    Links
    • https://openjsf.org/certification/
    • https://www.sentiatechblog.com/imposter-syndrome-how-to-display-front-end
    • https://twitter.com/wesbos/status/1318192217824124928
    • https://twitter.com/photonstorm/status/1318193404312944641
    • https://twitter.com/Ky1e_S/status/1318193954085634048
    • https://twitter.com/ArleyM/status/1318194323821912067
    • https://twitter.com/ajitbohra/status/1318194600335470592
    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

    Spooky Web Dev Stories — Part 2 Oct 28, 2020
    Show notes

    In this episode of Syntax, Scott and Wes are back for another episode of spooky web dev stories — listener-submitted stories about web dev gone wrong.

    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.

    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

    03:28 - Jack Rhysider Story

    06:28 - Dirty Dicks JSON

    08:23 - CMS Disaster

    10:58 - Oh No Hotel

    11:19 - FTP

    12:19 - Push Notification Hell

    13:16 - DVD Nightmare

    15:15 - Bad Words Again

    16:23 - Mo Money

    17:01 - Bass Ackwards

    18:17 - Taxi Coding

    19:36 - Bad Env

    21:30 - Login As

    21:50 - Email Subscribers Plugin

    22:33 - 1 in 300 Chance of the C-Word

    24:24 - Production Target

    26:12 - A Happy SEO Ending

    28:26 - Just Oof

    29:48 - I’ve Fallen and I Can’t Get Up

    30:54 - Crypto

    32:34 - rm -rf

    33:42 - Never Deploy on Fridays

    35:31 - Million Dollar Scramble

    36:22 - Deleting Production

    37:11 - 500,000 Concurrent Problems

    39:14 - Deleting a Government Website

    40:36 - You Ruined the Surprise!

    45:23 - Mr. D Hole

    46:48 - One Expensive Race Condition

    48:43 - Yikes

    51:11 - Always Be Closing

    51:44 - Adidas - All Day I Delete A Site

    Links
    • @JackRhysider
    • Darknet Diaries Podcast
    • ExpressionEngine
    • #ghosts
    • chefkoch.de
    • Sendgrid
    • Magento
    • Evite
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Fastify
    • Wes:
      • 🇨🇦 Mr Chefer Meat Thermometer
      • 🇺🇸 Mr Chefer Meat Thermometer
    Shameless Plugs
    • Scott: Level Up Pro - 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 - Temporal Date Objects in JavaScript Oct 26, 2020
    Show notes

    In this Hasty Treat, Scott and Wes talk about Temporal Date Objects in JavaScript — a WICKED AWESOME API for working with times and dates.

    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

    05:11 - Temporal Now

    • You can get now
      • Temporal.now.___

    07:58 - Temporal Instants

    • A Temporal.Instant represents a fixed point in time, without regard to calendar or location.
      • Most common way to show it is nanoseconds since unix epoch.
      • Can be formatted a few different ways.

    09:59 - Calendar

    • Support for different types of calendars

    11:43 - Durations

    • Temporal.Duration
      • There are .from and .add and subtract() methods

    12:47 - Other interesting parts

    • Timezones
      • Temporal.ZonedDateTime
    • Temporal.YearMonth - represents a ym = new Temporal.YearMonth(2019, 6) // => 2019-06

    14:51 - Polyfill (unstable)

    Links
    • Fixing JavaScrip Date - Maggie Pint
    • https://github.com/tc39/proposal-temporal
    • https://github.com/tc39/proposal-temporal/blob/main/docs/calendar.md#methods
    • https://github.com/tc39/proposal-temporal/blob/main/docs/duration.md
    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

    Spooky Web Dev Stories — Part 1 Oct 21, 2020
    Show notes

    In this episode of Syntax, Scott and Wes talk about spooky web dev stories — listener-submitted stories about web dev gone wrong.

    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.

    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

    03:12 - The Most Expensive Boolean Ever

    06:19 - An Actual Logging Issue

    09:37 - Snitches Get Stitches

    10:41 - The Spooky Office Skeleton

    12:04 - Prevent the Default of Making Money

    13:52 - Computer Magic Trick

    14:42 - Update Score

    15:59 - Change Reaction

    19:30 - Personal Mongodb

    20:26 - Hello Rob!

    22:08 - SSN Regex

    23:06 - WordPress Plugins

    23:52 - Loggin Ya In, Ya F’in Dummy

    24:58 - A Hostel Coding Environment

    25:59 - A Graceful Exit

    27:27 - Favicon DDOS

    28:07 - Common Cents

    29:03 - Open Source Vendors

    33:04 - Don’t Leave the Country

    35:09 - Apostrophe Catastrophe

    35:43 - Env

    36:05 - A Christmas Miracle

    36:43 - The One Million Dollar Bill

    39:00 - The Hacker Who Dropped the DB

    40:19 - The Tech Lead Who Uses Alert Statements

    46:14 - Lorem Ipsum

    46:58 - Malicious Compliance

    Links
    • Indigo.ca
    • r/MaliciousCompliance
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Hades Game
    • Wes:
      • LED Flame Bulb
      • Smaller LED Flame Bulbs
    Shameless Plugs
    • Scott: Animating Svelte - Sign up for the year and save 25%!
    • Wes: Master Gatsby - 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 - Stretching For Developers with Scott Oct 19, 2020
    Show notes

    In this Hasty Treat, Scott and Wes talk about stretching for developers — techniques, misconceptions, and how to feel better.

    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

    03:21 - Devs do the following

    • Head forward looking at screen
    • Shoulders forward
    • Sitting a lot
    • Weak core
    • Carpel tunnel from typing

    06:02 - Stretching misconceptions

    • Static holds
    • Dynamic controlled movements first and foremost

    07:52 - Stretches to help

    • Dynamic twists
    • Cat / Cow
    • Flat down / Curl up spine
    • Arm hang to decompress spine
    • Wrist stretches and strengthening for carpel tunnel
    • Horse stance at standing desk to be office weird person
    • Shoulder circles
    • Doorway stretches
    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 Make Freelancing Easier Oct 14, 2020
    Show notes

    In this episode of Syntax, Scott and Wes talk about how to make freelancing easier — how to avoid burnout, and tips and tricks to make it successful.

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

    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

    02:15 - Code

    • Use starters and resets and component libraries
    • Don’t build in something you don’t know, unless you have time and budget to do so — WP is good enough for most projects
    • Feel free to go over time on projects if you are learning something new
    • Re-use code from project to project
    • Target similar types of clients

    13:09 - Communication

    • Often, clear and frequent
      • People won’t be mad for being too informed — just know when to leave out the technical jargon
    • Clients typically don’t care about Git, React, etc. — they care about results
    • Don’t overwhelm them
    • Train your clients that you aren’t available 24/7

    22:19 - Time management

    • Set calendar alerts early and often to not miss communications
    • Set meetings at 9am, don’t wait around all day for meetings
    • Block off large amounts of time for dev — you won’t be able to get meaningful work done in one-hour slots

    27:54 - Contracts + quoting

    • Have a boilerplate contract that you can just fill in
      • Same for a quote
    • Value-based billing

    33:47 - Billing + taxes

    • Don’t be shy when talking about money. Be clear on what you need, when you need it, and on what terms. This is business.
      • This is your art, but it’s also your business
    • Pay quarterly taxes - most likely
      • Or don’t and take the small hit — then you can pay once a year
    • Put taxes into another account if you aren’t good with money
    • Get a billing management system or get an accountant — you need to focus on working on code
      • Wave Apps, Xero, Freshbooks

    42:03 - Marketing

    • Be loud — people need to know what you offer
    • The best marketing is a referral from a previous client
    • If you show up, return emails and do a good job, you’ll kill it
    • Show people what you are excited about: blog posts, videos, tweets, etc.
    • Go where your clients are:
      • Do you want to be serving small businesses? Family and friends
      • Do you want to be a hired gun for a technical team? Conferences/Twitter, blog posts

    48:25 - Final thoughts

    • Scott — It’s ok if freelancing isn’t for you. Not everyone is great at all of these factors, myself included. However, with practice, you can be your own boss, work on your own terms, and make money. Also, don’t be afraid to take on longer contracts with established teams and companies.
    • Wes — Freelancing can be a great filler between jobs or career transitions.
    Links
    • Syntax 117: Hasty Treat - How To Email Busy People
    • Freshbooks - Breaking the Time Barrier
    • Design Is a Job - Mike Monteiro
    • Wave
    • Xero
    • Freshbooks
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Displaced Gamers YouTube Channel
    • Wes: Battery Adapter for DeWALT 20V Max 18v Dock Power Connector
    Shameless Plugs
    • Scott: React For Everyone - Sign up for the year and save 25%!
    • Wes: Master Gatsby - 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 - Updating / Restarting Long-Running Web Apps Oct 12, 2020
    Show notes

    In this Hasty Treat, Scott and Wes talk about updating web apps that have running for a long time — the problems to look out for and how to avoid them.

    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

    01:54 - The problem

    • This only affects the client-side

    05:28 - What are some solutions:

    • Do nothing and hope the user refreshes.
    • Have a list of assets, or commit hashes. Poll the server periodically, and when there is a new version available:
      • Prompt the user to refresh
      • Just refresh the user (store current state in localstorage and restore)
    • Do a custom component, that checks the last time the user has refreshed (or if new version if available). When they click the link, render a regular instead of a pushstate link.
    • Use a service worker. They will emit an event when a new version is available. Use the above methods to refresh the user.
    • Hot code push.
      • Vuepress has “hot reloading” baked in.
    Links
    • https://twitter.com/wesbos/status/1306969658751361024
    • Notion
    • Vuepress
    • Meteor
    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 - Is Angular good? × Stencil.js × Self XSS × SVGs in React × Social Platforms for Devs × Project Handoff × Cleaning Knives × More! Oct 07, 2020
    Show notes

    It’s another potluck! In this episode, Scott and Wes answer your questions about getting your first web dev job, what makes a software engineer senior, handing off projects to clients, Angular vs React, the best social platforms for devs, 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.

    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

    01:58 - You’ve talked a couple times in the past about the security concerns around target="_blank". You mentioned how adding rel="noopener" and / or rel="noreferrer" can secure this functionality, but what’s to stop a savvy person from going into the dev tools and deleting these attributes before clicking a link? Does this defeat the entire purpose or what? Surely browsers have thought of this and it’s not so easy to hack?

    03:48 - Why did you not mention Stencil when talking about web-component in the last Potluck? Can I presume you have not heard of it? It is quite successful and Ionic proves it. We’ve been using it for two years in production. This is the only library that thought web-components through to the end. If you know it, what do you think about it and would you use it?

    • Example of a stencil component:
    import { Component, Prop, h } from '@stencil/core'; @Component({ tag: 'my-first-component', }) export class MyComponent { // Indicate that name should be a public property on the component @Prop() name: string; render() { return (

    My name is {this.name}

    ); } }

    06:12 - Is https://www.syntax.fm supposed to not work? I get a 404.

    07:34 - I’m wondering what advice you’d have for someone self-taught switching from a totally non-tech industry (non profit arts, in my case) where I work in a tech role. I’ve hustled and built a portfolio of projects and learned a ton from both of your courses, but I feel that my experience is seen as less valuable because I don’t work in a traditional software/web development environment. Any tips for getting over the final hurdle of getting a dev job?

    11:11 - What makes a software engineer senior?

    13:08 - I have a Gatsby / Netlify client project about to launch. What’s the best approach in handing over to the (non technical) client? Do I keep in my Github account and just give the client the Netlify CMS login, or create the a Github account for the client that I can access for any maintenance? What do other devs do?

    17:55 - I recently blocked all cookies on my mobile browser (Google Chrome), and I noticed something weird. A couple of sites that I know for a fact to have been built using NextJS weren’t working as expected (surprise surprise). They would load as usual, and after a second or so, all the content on the page disappeared, with the error message “sorry: an unexpected error has occurred”. In some cases, the error was printed in the site’s font, and with the same background color on the body. Why does blocking cookies do this to NextJS sites?

    21:21 - How often do you make commits? I always hear, “commit often”, but I am hesitant because I feel like I may change my code later on before I make a pull request? I really liked your episode on Git Fundamentals, I would love to see a tutorial/deep dive into Git workflows and practices (when to commit / how often) Should I commit even though I know what I’m working on isn’t complete or I need to refactor it?? What is code review etiquette?

    26:59 - Wes, how do you handle captioning and transcripts on your courses? Do you use some tool or service for that or do you do it by hand?

    31:11 - I am a recent graduate of a code school that focused on React and Rails. The company that I currently work for uses Angular for part of their stack. I eventually would like to move into a dev spot, but I am finding that Angular feels a bit stuffy and I am not as excited about it as React, Svelte, Vue, etc. I am afraid that if I dive into Angular, I will become less relevant down the road. I want to learn everything, but I only have so much time and don’t want to stunt my growth as a developer. Any thoughts or advice on this would be sick!

    36:38 - How do you handle SVGs in React? I know that SVGR exists, but I’d like to avoid adding another dependency if it’s something I can roll on my own. In the past, I’ve created functions that take parameters like fill or stroke to control color, and return a string of SVG code with the arguments interpolated in. Then I place that string into a component using dangerouslySetInnerHTML. I haven’t seen this method used anywhere else, and is probably not best practice. But also, it works, so maybe it’s fine?

    39:52 - What social media platforms should you use as a Dev? What is cool to have? What are their benefits?

    48:14 - Have you tried an ultrawide monitor for coding, such as 34" or 38"? I feel the extra width would be great for a single monitor setup, but haven’t been able to see one live where I live.

    Links
    • Syntax 269: Hasty Treat - Target=_blank security issue? What’s the deal with noopener and noreferrer?
    • Syntax 280: Potluck - RIP Firefox? × Safari × Changing Careers × Regression Testing × Google Analytics Alternatives × Malicious Github Users? × Mac vs Windows × More!
    • 8 Mile
    • Syntax 286: Git Fundamentals
    • Rev
    • Angular
    • React
    • Svelte
    • SVGR
    • LevelUp Tuts Discord
    • Dev.to
    • freeCodeCamp
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott:
      • 1: Knife Cleaner
      • 2: Scraper
      • 3: Chainmail Scrubber
    • Wes: Scriptable App
    Shameless Plugs
    • Scott: ReactJS For Everyone - Sign up for the year and save 25%!
    • Wes: Master Gatsby Course - 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 - Enums in JS (GraphQL and Typescript) Oct 05, 2020
    Show notes

    In this Hasty Treat, Scott and Wes talk about enums in JS — what they are, what they do, and how they work in 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.

    Show Notes

    03:11 - What are enums?

    • A type restricting variables to one value from a predefined set of constants
    • Direction = UP / DOWN / LEFT / RIGHT
    • Role = ADMIN EDITOR AUTHOR VIEWER
    • Day of the Week

    05:12 - In GraphQL

    • enum Role { ADMIN EDITOR AUTHOR VIEWER}
    • Then

    07:05 - In TypeScript

    • First, declare the type:
      • enum direction = { UP, DOWN, LEFT, RIGHT }
    • Then when you defined your function, use that type
      • type User { role: Role } or type User { role: [Role] }

    08:49 - In JavaScript

    • Not in JS yet
    • There is a proposal in stage 1
      • https://github.com/rbuckton/proposal-enum
    • And a babel plugin:
      • https://www.npmjs.com/package/babel-plugin-const-enum
    • Can use case/switch
    • Can use Object or Map keys
    Links
    • Syntax 287: Hasty Treat - Records and Tuples in JavaScript
    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 74 75 76 77 78 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