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:
    New to JavaScript — ES2022 Sep 15, 2021
    Show notes

    In this episode of Syntax, Scott and Wes talk about all the new stuff in ES2022 — what it is, why you might need it, and how to use it.

    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.

    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.

    Auth0 - Sponsor

    Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below: https://a0.to/syntax.

    Show Notes

    04:50 - Regex indicies

    • New d flag in a regex
    • https://regex101.com/
    • This will tell you the indexes (indicies) of the regex matches
    • Handy if you need to highlight or replaces matches in a string
    • We can ask for the start and end positions of each matched capture group

    07:16 - Class updates

    • Private fields
    • Properties and Methods to be kept private
    • Prefix them with a #
    • =Helpful for internal state and methods which should not be accessed directly or at all by external
    • In React how we have __INTERNTAL_NEVER USE THIS
    class ColorButton extends HTMLElement { // All fields are public by default color = "red" // Private fields start with a #, can only be changed from inside the class #clicked = false } const button = new ColorButton() // Public fields can be accessed and changed by anyone button.color = "blue" // SyntaxError here console.log(button.#clicked) // Cannot be read from outside button.#clicked = true // Cannot be assigned a value from outside
    • Getters and setters introduced in es5
    • https://www.w3schools.com/js/js_object_accessors.asp
    class Person { #hobbies = ['computers'] get #hobbiesGetter() { return this.#hobbies } #getHobbies() { return this.#hobbies } getHobbiesPublic() { return this.#hobbies } } const scott = new Person(); scott.#getHobbies(); // doesn't work scott.getHobbiesPublic(); // works

    09:07 - Class fields

    • This may seem super old because we have been polyfilling it forever
    • Right now if you want an instance field on a class, you need to declare it in the constructor
    • Now we can just declare them inside the class

    10:36 - Static fields and methods

    • As above can also be static with the static keyboard
    • Works for methods too
      • Explain what a static method is

    13:17 - Top level await

    • So handy in modules. Need to pull in some data? Simple.

    15:19 - Ergonomic brand checks for private fields

    • Used for checking if a private field on a class exists using the in keyword

    16:00 - .at() method

    • Strings and arrays - we can use square brackets to reference items of the array
    • Super handy for grabbing the last item of an array
    // 🔥 New .at() method on arrays and strings const toppings = ['pepperoni', 'cheese', 'mushrooms']; // The old way to grab the last item toppings[toppings.length - 1]; // mushrooms // using .at() method with a negative index toppings.at(-1); // mushrooms // works with any index toppings.at(0); // pepperoni toppings.at(-2); // cheese // and with strings! 'Meeting Room: B'.at(-1) // B
    • Why not use array[-1]?
    • We used to use slice(-1)
    • What about indexOf?

    21:34 - Handy hasOwn method

    • https://github.com/tc39/proposal-accessible-object-hasownproperty

    24:51 - Class static block

    • A static block allows you to run code before creating an optional static property during initialization
    • https://github.com/tc39/proposal-class-static-block
    Links
    • https://github.com/tc39/proposals/blob/master/finished-proposals.md
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Ultraloq Smart Lock
    • Wes: Magnatiles
    Shameless Plugs
    • Scott: Web Components Course - 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 - Starlink Rural Internet Sep 13, 2021
    Show notes

    In this Hasty Treat, Scott and Wes talk about Wes’ new satellite internet setup — best use-cases and how to set it up.

    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.

    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

    04:06 - Rural internet is huge for:

    • Access to information
    • Remote work
      • Opens up job opportunities for many residents who can’t relocate due to family
    • Home values
      • Big city folk moving into rural areas and driving prices up is another issue altogether
    • Smart rural home

    05:46 - Previous setup

    • We have a cottage
    • LTE Routers
    • Yagi Antennas
    • Worked well, but slow
    • $4/gig over 100gb
    • Grey market - one went up/down
    • Alternatives
      • WISP - no access
      • XPLORNET @ (hughesnet) - BRUTAL
      • Bell LTE - $$$ - slow

    08:35 - The signup, install, price

    • $129 CAD Deposit ($100 USD)
    • $650 for the dish
    • $120/month
    • Unlimited bandwidth
    • Needs a clear view of the northern sky
    • Clear from obstructions is key
    • Every 1 foot up is 2 foot of obstructions cleared
    • I put it on a 25ft piece of wood
    • Bought a pipe adaptor from Starlink

    09:59 - The performance

    • These numbers are not impressive to anyone with fiber, but are LIFE CHANGING to rural folks
    • From 30mbps - 200mbps down - some users posted ~350 down
    • Upload from 25mpbs - 80mbps (better than you can pay for where I live in the city)
    • Ping is around 40ms
    • Downtime is measured in seconds
    • Youtube streams super smoothly
    • Zoom works great
    • Facebook + Instagram issues
      • Many reported changing DNS fixed it

    14:21 - The equipment

    • Starlink comes with a router
      • Does not support bridge mode
      • Doesn’t have WPS
      • Only one hard-wired port
      • POE-only
    • UniFi Dream Machine
    • Three access points
    • POE switch for Starlink Router
      • Gives you stats
    • The ethernet is hard-wired into the dish, so you have to drill a huge hole in the house
    Links
    • Starlink
    • Wyze
    • UniFi Dream Machine
    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 - Sass × Houdini × No JS? × Solid Project × First Dev Job Tips × Bartering × DRM × Dev Laptops × Databases × Frontity × More! Sep 08, 2021
    Show notes

    It’s another Potluck! In this episode, Scott and Wes answer your questions about Sass, Houdini, JS requirements, tips for your first dev job, dev laptops, databases, Frontity, and more!

    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.

    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.

    Auth0 - Sponsor

    Auth0 is the easiest way for developers to add authentication and secure their applications. They provide features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

    Show Notes

    02:35 - What are the use cases of SASS/SCSS in 2021? Would you still choose it over CSS (or something else?) in a new project?

    05:26 - What ever happened to CSS Houdini?

    08:49 - With all these JS being transferred, have you ever tried to challenge yourself to build a project that doesn’t involve any JS (in the front end alone); (e.g. just HTML+CSS)? I find it funny how I can pretty much use amazon.com with JS disabled, but I literally cannot view the angular docs if I disable it.

    11:40 - As we all know, Tim Berners-Lee made the web. Apparently, after seeing everyone’s data getting harvested by tech companies, he decided to make a project called Solid (https://solidproject.org/) that allows people to own their data and control all permissions to it. So if a user logs into your app with Solid, rather than storing their info on your server, you’d store it in their Solid Pod. Do you think this could save both Web developers’ conscience and disk space in the cloud?

    15:47 - I am about to start my first developer job. What practices can I start to really get off on the right foot and lay down a foundation for a successful career?

    18:57 - Have you guys ever used your dev skills to trade for other goods or services? For instance, helping out an auto mechanic with their website in exchange for brake service on your car or creating a site for a barbershop traded for free haircuts for a year. If so, how do you go about starting that conversation?

    22:14 - What’s your take on DRM? Have you implemented/integrated something like Widevine in any of your platforms/projects? How does one go about doing such a thing? I can’t seem to find any good docs on that. I personally can relate as to why it’s there, but end up hating it anyways. I recently found out that Prime Video only allows SD(sub HD) content on Linux and it had something to do with the Widevine DRM they employ. I got outraged and eventually canceled my subscription!

    29:35 - Have you seen the Framework laptop and, if so, what are your thoughts for web development? I’m a lifelong Mac user but the idea of a higher repairable laptop running Linux (I personally can’t do Windows) sounds like an amazing step forward for consumers.

    32:53 - I know that you both like MongoDB and so do I. But sometimes all these queries to database, especially aggregations gets messy, aren’t they? Prisma has now support for MongoDB. What do you think? Is it a tool that will make requesting MongoDB much easier?

    37:02 - Hey guys, been diving into Svelte a bit recently and had a question about using it with GraphQL. As I recall Scott once deemed React Typescript GraphQL CodeGen “the promised land” and since then I tried it out and have found it awesome. However, I’ve been debating moving a larger personal project from React to Svelte. I see that there is plugin for graphql-codegen-svelte-apollo but with my limited knowledge of Svelte find it hard to decipher if the development experience would be as streamlined. I am wondering if you could shed some light on the developer experience of working with GraphQL in Svelte in Typescript.

    40:58 - Do y’all have any thoughts about Frontity for WordPress? I swear I’m not a plant for Frontity, but I stumbled upon it today and I’m trying to evaluate it vs. other solutions like Next.js for use in a headless WordPress setup. Would love your thoughts if you have any!

    43:40 - Call me weird, but I kind of like fiddling around with webpack configs. I just like the level of control I have here. That being said, is webpack going to die now that the “better” tools out there mature? Or do you think we might see a webpack v6 with esbuild under the hood that makes it compete with Parcel, Vite, Snowpack in terms of speed?

    Links
    • https://sass-lang.com/
    • https://postcss.org/
    • https://ishoudinireadyyet.com/
    • https://astro.build/
    • https://kit.svelte.dev/
    • https://www.widevine.com/
    • https://frame.work/
    • https://www.prisma.io/
    • https://www.mongodb.com/
    • https://www.postgresql.org/
    • https://mongoosejs.com/
    • https://keystonejs.com/
    • https://frontity.org/
    • https://webpack.js.org/
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Hot App
    • Wes: Pet Food Mat
    Shameless Plugs
    • Scott: Web Components Course - 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 - TypeScripts Strict Explained Sep 06, 2021
    Show notes

    In this Hasty Treat, Scott and Wes talk about the Typescript strict flag — what it does and why you might use it.

    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.

    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

    02:50 - What is it?

    • Future versions of TypeScript may introduce additional stricter checking under this flag, so upgrades of TypeScript might result in new type errors in your program. When appropriate and possible, a corresponding flag will be added to disable that behavior.

    03:26 - noImplicitAny

    • The any type in TypeScript is exactly that - it can be anything.
    • TypeScript will try to infer the type. When it can’t it will be any.
    • Sometimes you need any, but if that is the case, you must explicitly type it as any.
    • If something is implicitly any - it might be a mistake, or you forgot to type it. Risky!

    06:01 - noImplicitThis

    • You must type this - it can’t be implicitly inferred.

    06:47 - strictFunctionTypes

    • If you have a type that is a function and it doesn’t 100%.

    07:44 - alwaysStrict

    • Always turns on strict mode. You can’t do things like redeclare var variables.

    09:25 - strictNullChecks

    • Makes you check that the item is actually there before accessing a value or method from it.
    • Imagine you filter or find on an array, or query selector a DOM element. There is a possibility that nothing is there. strictNullChecks makes you check that it’s there - like an if statement.
    • Optional chaining is super handy here.

    11:18 - strictBindCallApply

    12:38 - strictPropertyInitialization

    13:37 - useUnknownInCatchVariables

    Links
    • https://www.typescriptlang.org/tsconfig#strict
    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

    STUMP'D - Coding Interview Questions Sep 01, 2021
    Show notes

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

    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.

    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.

    Auth0 - Sponsor

    Auth0 is the easiest way for developers to add authentication and secure their applications. They provide features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

    Show Notes

    03:10 - What is STUMP’D?

    04:27 - What is a first class function?

    06:27 - What is the purpose of using object is method?

    09:31 - What is the purpose of Error object?

    11:00 - What are the advantages of minification?

    12:37 - How do you declare namespace?

    15:38 - What are JS labels?

    19:20 - List the methods that are available on a WeakSet?

    • What is the difference between a set and a WeakSet?

    23:33 - What is the use of preventDefault method?

    26:15 - What is a spread opperator?

    27:35 - What is the output of below spread operator array?

    • [...'John Resig']

    30:19 - How do you load CSS and JS files dynamically?

    32:00 - What are tasks in event loop?

    34:15 - What is a WeakMap?

    37:35 - How do get query string values in JavaScript?

    40:50 - What is the purpose of some method in arrays?

    42:15 - How do you delete a cookie?

    Links
    • https://30secondsofinterviews.org/
    • https://www.interviewbit.com/javascript-interview-questions/
    • https://github.com/sudheerj/javascript-interview-questions
    • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label
    • https://es6.io/
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Builderment
    • Wes: Lawn Mower Blade Balancer
    Shameless Plugs
    • Scott: All Courses - 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 - Freelance Tips - Toxic Clients Aug 30, 2021
    Show notes

    In this Hasty Treat, Scott and Wes talk about toxic clients — how to identify them, and what to do about them.

    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.

    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.

    Show Notes

    05:33 - Warning Signs of a potential toxic client

    • Doesn’t have project well thought out.
    • Scope creep - Adds on new features while not considering the amount of work required to make them happen. Can be mad when you run out of time or budget.
    • Ill Communicator
      • Contacts you at odd times.
      • Thinks that you should answer every email in an hour.
      • Contacts you in inappropriate ways, via text message, social media. OR doesn’t respond to emails in a timely manner giving you blockers.
    • Jerk
      • The rude client
      • Thinks they can be rude because they are giving you money
      • Hundreds of emails
    • Tries to be flashy upfront (dinners, etc.)
      • Scatterbrain or way too big.
      • Facebook for nurses

    18:06 - What to do about toxic clients

    • Communicate your needs clearly. Set expectations.
      • “I work best when…”
      • “I answer emails once every two days”
      • Set clear deadlines for deliverables, feedback and revisions (one revision backed in, more at x hourly rate, etc.).
      • Just be VERY clear. If something doesn’t work for them, they will hopefully tell you.
    • Get things in writing.
      • Put things clearly in a working agreement for your client to approve. That way you have something to show in case things go south and you can say, “You agreed to the following things”.
    • Fire them
      • You can fire clients. Honestly, some of them just aren’t worth the time and effort. It’s usually the cheapest clients who demand the most from you. Don’t let them take more of your time and energy than they are paying for.
      • Firing clients is very simple.
        • Hi so and so, I don’t feel like we’re a good match for this project, so I’ll be canceling our work agreement. Good luck on your project.
    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

    Advice for New Devs Aug 25, 2021
    Show notes

    In this episode of Syntax, Scott and Wes talk about advice for new devs, our advice and opinions for how new devs can level up.

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

    Cloudinary - Sponsor

    Cloudinary is the best way to manage images and videos in the cloud. Edit and transform for any use case, from performance to personalization, using Cloudinary’s APIs, SDKs, widgets, and integrations.

    Show Notes

    01:59 - Get comfortable with your code not working

    • All of our code is broken much of the time.

    02:40 - Compound learning and momentum is your biggest tool

    • There is no formation without repetition.
    • It sucks to hear, but honestly, if you get a little bit better every single day, you will be WAY ahead in years to come. Keep at it, keep chipping away, take the lows and the highs.

    04:05 - Learn to read error messages

    • Is this error coming from my code?
    • Is this coming from the library? If so, maybe the library wasn’t expecting that.
    • Is this coming from the browser? An extension? Is it even related?
    • Stack trace is a treasure map

    09:42 - Take the time to learn the concepts that scare you

    • They are often easier than they seem (though not every time).

    10:40 - We all struggle

    • This stuff is hard — give yourself a break.

    12:56 - Taking a walk is good for solving bugs

    • It’s hard to walk away from broken code, but it really helps.

    14:33 - Get comfortable with the command line

    • You’ll need it

    18:09 - The ability to replicate a design pixel perfect is a valuable skill

    • You will be shocked at how many devs can’t or don’t do this. If you want to avoid spending extra time on something, don’t make the designers tell you to go back and fix simple spacing, color, and detail things.

    21:26 - You are on a team

    • Don’t get stuck in the "us vs them" mentality of internal company teams (e.g. devs vs designers). You are all working together to make something.

    24:10 - You are not an expert

    • Even if you think you are an expert, you should always be seeking out alternate viewpoints and ideas. You are a student forever in this game.

    26:14 - Scaffold with comments

    • It helps keep you organized once you get into the mess

    28:30 - From Twitter

    • Tweet thread - https://twitter.com/wesbos/status/1417139639861735424

    29:30 - Ben Newton

    • Soft skills are about as important as coding skills if you want to go far.
    • https://twitter.com/BenENewton/status/1417140062211526658

    32:46 - Eric McCormick

    • Don’t be afraid to push yourself beyond your comfort zone.
    • https://twitter.com/edm00se/status/1417140503527792640

    33:31 - Jason Liggi

    • You don’t have to code for fun.
    • https://twitter.com/Liggi/status/1417141600124346371

    35:34 - Andrew Nickerson

    • Start by building a project that’s interesting to you. https://twitter.com/Nickvisual/status/1417140742531674118

    37:15 - Michael Powers

    • Ask questions, break things once in a while, learn vanilla everything even if it feels like a waste of time.
    • https://twitter.com/mgrpowers/status/1417141364525912064

    39:33 - Jason Liggi

    • Doesn’t matter how long you do this job, MOST stuff out there will probably be unknown and confusing.
    • https://twitter.com/Liggi/status/1417141322478235653

    40:14 - Swashata

    • Learn to read documentation
    • https://twitter.com/swashata/status/1417142055436910598

    49:59 - Max Stoiber

    • Know your tradeoffs.
    • https://twitter.com/mxstbr/status/1417142461709828101

    43:34 - Pat Clarke

    • Build a rapport with PMs/clients beyond the technical. https://twitter.com/LeftShotDev/status/1417142505494269954

    44:21 - Musa Barighzaai

    • Leave things better than you found them. https://twitter.com/mbarighzaai/status/1417142734993907715

    45:20 - David Moore

    • Build things that excite you.
    • https://twitter.com/DavidIMoore/status/1417145783581741067
    Links
    • https://johnlindquist.com/
    • https://github.com/albertlauncher/albert
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: Raycast
    • Wes: Amazon iPhone Repair Kits
    Shameless Plugs
    • Scott: Web Components 101 - 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 - Why Do People Hate CSS? Aug 23, 2021
    Show notes

    In this Hasty Treat, Scott and Wes talk about why people hate CSS, some common issues, and how you can level up.

    Prismic - Sponsor

    Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax.

    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:20 - Layout is hard

    • block vs inline vs inline-block
      • Learn what this means!
    • Flexbox
      • https://css-tricks.com/snippets/css/a-guide-to-flexbox/
    • Grid
    • Avoid floats
    • Wes’ Flexbox Course
    • Wes’ CSS Grid Course
    • Scott’s Modern CSS Layouts Course

    07:43 - I can’t get my thing to get the right style

    • Use a scoping system like BEM, CSS in JS, CSS Modules
    • Don’t style via IDs
    • Avoid !important

    11:00 - My thing isn’t looking the way it’s coded

    • Dev tools
    • Write CSS in the browser
    • Check class names

    12:11 - I don’t know if I can delete this CSS

    • Use tools like https://purgecss.com/
    • http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/

    15:51 - Look at things holistically

    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 - Moist code × Memoization × Ready for full-time? × Deadlines × Design ethics × React components × Video hosting × Local fonts × More! Aug 18, 2021
    Show notes

    It’s another Potluck! In this episode, Scott and Wes answer your questions about memoization, how to know when you’re ready for a full-time dev job, what to do when you underestimate projects, design ethics, local fonts, and more!

    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.

    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.

    Cloudinary - Sponsor

    Cloudinary is the best way to manage images and videos in the cloud. Edit and transform for any use case, from performance to personalization, using Cloudinary’s APIs, SDKs, widgets, and integrations.

    Show Notes

    04:07 - Can you explain the concept of memoization in JS?

    07:27 - I’ve been developing for a while now and I was wanting to know if there is some sort of catalyst that I should be aware of that screams “you’re ready for a full-time job”?

    09:26 - I have an ethics question for you. I recently took on a freelance gig that requires a custom admin dashboard, and I wasn’t really sure how to design one of those. My solution was to look up a pre-made Bootstrap dashboard template that can be purchased for $50-$500, and just re-create it myself. I looked at their live demo and reconstructed a very similar dashboard myself, using the same UI library. The outcome is not a perfect copy, although it’s very close, and I never looked at their code base, so there’s probably many differences there. But still, I can understand why some people might be upset by my attempt to copy someone else’s design. I’m not reselling it as a theme, just using it my freelance project with one client. What are your thoughts on this?

    16:36 - How do you decide how specific a (React) component should be?

    22:03 - My question is about the npm run eject feature of React. Is there a place where I should be using this feature or can I keep on ignoring that it exists?

    24:04 - My question is for Scott. In one of the episodes in the past, you mentioned that you use YouTube private videos on leveluptutorials.com using some kind of authentication. If I am not mistaken, you use a different platform to host videos now. Was there any reason to stop using that technique?

    31:13 - I’m setting up a webinar. I’m going to require an iLok drive to access the FTP site, so I head over to Ali Baba, and I’m on Ali Baba to buy the things, and I should mention my main concern would be data miners. I mean they’re just like cyber-crackheads, really. So, I would imagine that any latency issues could be compensated through a registrar handshake with the firmware, and I’d love to see a combination of both flash and HTML5, so my question is, would the eCommerce piece embed on the host platform, as well as the dialogue field for user names? Or, would the gateway socket extension be full duplex, as well as the packet switchover?

    33:33 - How do you allow users to edit text to their profile or to messages they send to other users, without sacrificing the safety and security of your site?

    38:07 - Any tips on how should I use npm packages in Netlify functions? I read that I could commit node_modules (which for me sounds absolutely barbaric) and I also read that I could install netlify-lambda package with an additional postinstall script in the package.json. What’s your approach?

    41:07 - Can you disable local fonts from the OS and check if the site actually loads them?

    46:02 - I have a question related to freelancing. Yesterday I took on a new client project. Price is locked in and contract is signed. Thing is, I am new to web dev freelancing and I now realise I have totally miscalculated the complexity and size of this project. What I initially estimated I could do in 3-4 weeks suddenly looks more like 6-8 weeks of work for me. Do I break the bad news for the client and ask to extend the deadline, outsource part of the work (which might lead to more hassle), or just buckle up and prepare to pull several all nighters to get on top of it? What would you do?

    49:09 - Question to Scott: Have you ever thought of calling your students Scott’s Tots?

    Links
    • https://mux.com/
    • https://vimeo.com/
    • https://github.com/cure53/DOMPurify
    • https://wesbos.com/sanitize-html-es6-template-strings
    • https://svelte.dev/
    • https://vercel.com/
    • https://begin.com/
    • https://en.wikipedia.org/wiki/Scott%27s_Tots
    ××× SIIIIICK ××× PIIIICKS ×××
    • Scott: I Think You Should Leave Season 2
    • Wes: Underground Wire Locator
    Shameless Plugs
    • Scott: 1: Level Up Tuts Pro - Sign up for the year and save 25%! 2: Become a Level Up Tutorials Author
    • 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 - The Weird and Wonderful Link Tag Aug 16, 2021
    Show notes

    In this Hasty Treat, Scott and Wes talk about the tag — why it’s weird and wonderful, and what you can do with it!

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

    Show Notes

    04:16 - What is it?

    • https://ryanflorence.dev/p/ship-weird
    • The link tag is weird.
    • First, it’s not for links! It’s for establishing a relationship between the current HTML document and a resource.

    05:11 - CSS / Media attr

    07:13 - Web fonts

    08:09 - Favicons

    • Syntax 373: Hasty Treat - The Surprisingly Exciting World of Favicons

    08:36 - Preload + Prefetch Resource

    • Audio, document, fetch, font, image, script, style, track, video, worker + more

    10:15 - Fetch request (shoutout Ryan)

    11:27 - Preconnect

    • Consider adding preconnect or dns-prefetch resource hints to establish early connections to important third-party origins.

    13:01 - Module

    13:30 - Integrity

    • SHA
    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 65 66 67 68 69 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