Logo
    Search

    Podcast Summary

    • Exploring JavaScript coding interview questions with Syntax hostsThe Syntax podcast's Stumped episode challenges hosts with JavaScript interview questions, helping listeners prepare for the unpredictability of real interviews.

      The Syntax podcast, hosted by Scott Talinski and Wes Boss, is where you can find the most delicious web development insights. In this episode, they tried something new: a Stumped episode, where they challenge each other with JavaScript coding interview questions. They were sponsored by FreshBooks, Cloud Accounting; LogRocket, a JavaScript session replay tool; and Auth0, an easy authentication solution for apps. Scott shared that he had spent the weekend working on a GraphQL code generator plugin for himself, which he found surprisingly easy to do. He aimed to remove the dependency on Apollo, as they weren't using most of its features. Scott wrote his own GraphQL fetcher, which was a significant dependency removal for their project. The hosts then dived into the interview questions from a large GitHub repository by Sudhir Jay. They started by randomly selecting questions and tried to stump each other. These questions ranged from basic concepts like "what is a constructor?" to more complex topics. The goal was to replicate the unpredictability of interview questions and help listeners prepare for the unexpected. Without any preparation, they attempted to answer these questions, sometimes struggling and other times acing them. Scott shared his experience of being caught off guard by seemingly simple questions during interviews. The Stumped episodes aim to provide listeners with a glimpse into the interview process and help them prepare for the unexpected.

    • Functions as values in functional programmingFunctions can be assigned to variables, passed as arguments, or returned as results, making them first-class values in functional programming. The object dot equals method in JavaScript can be used for various comparisons, including strings, numbers, and objects, but it behaves differently than the triple and double equals operators.

      A first class function is a function that can be treated like any other value in programming languages that support it. This means that a function can be assigned to a variable, passed as an argument to another function, or returned as a result from a function. The ability to manipulate functions in this way is a fundamental aspect of functional programming. Additionally, the object dot is method in JavaScript can be used for various comparisons, including comparing two strings, two numbers, the polarity of two numbers, and two objects. This method is not the same as the triple equals or double equals operators, as it treats signed zeros and NaN differently. While it may seem like a niche feature, understanding the differences between these comparison methods can be important in specific use cases.

    • Comparing Identical Objects, Numbers, and Strings vs Creating New OnesObjects, numbers, and strings with the same properties return true when compared, but they're not the same entities. Creating new ones is necessary for unique variables or functions, while minification reduces code size by removing redundancies.

      Objects, numbers, and strings with the same properties will return true when compared, but they are not the same entities. Instead, new objects, numbers, or strings will return false. Regarding error objects, they can be created new or reused to track specific errors, allowing error handling and passing along the chain. Minification is a process that reduces the size of JavaScript code by removing unused spaces, renaming variables, and eliminating duplicates, resulting in faster loading times for web applications or websites. JavaScript does not have built-in namespaces, but they can be created using classes, providing a scope for variables and functions.

    • JavaScript Namespaces and OrganizationJavaScript offers classes, objects, IIFE, and label statements for creating namespaces and organizing code. Encapsulating data and methods in classes and objects, using IIFE for avoiding global pollution, and labeling loops and blocks for easier navigation are effective techniques.

      JavaScript offers various ways to create namespaces and organize code, such as creating classes, objects, Immediately Invoked Function Expressions (IIFE), and using label statements. Namespacing is essential when creating reusable code and allowing others to use and extend it. A class is a common way to create a namespace, where you can encapsulate data and methods, and call them using a dot notation. Objects can also be used for the same purpose. IIFE creates a new scope and is useful for avoiding the pollution of the global namespace. Label statements, on the other hand, allow you to name loops and blocks, making it easier to break or continue them when nested. Understanding these techniques can help you write more organized, maintainable, and reusable code.

    • Discovering Weak Sets and Simplifying Invoicing with FreshBooksLearn about weak sets, a new JavaScript data structure for holding objects with weak references, and streamline your invoicing process with FreshBooks, a cloud accounting solution for small businesses and freelancers.

      During their discussion, the speakers discovered a new JavaScript concept called a "weak set." This is a data structure that holds only objects and sets weak references to them. The difference between a weak set and a regular set is that weak sets do not prevent the garbage collection of their contained objects. This means that when an object is no longer referenced anywhere else in the application, it will be automatically removed from the weak set during the garbage collection process. They also discussed FreshBooks, a cloud accounting solution designed for small businesses and freelancers. FreshBooks simplifies the process of sending invoices, collecting payments, tracking time, and managing expenses. The speakers highly recommended it, offering a 30-day free trial for their audience. During the conversation, they also touched upon the topic of week sets, which led to some confusion. Week sets are a type of set that has unique methods such as add, delete, has, and length. However, they could not recall all the methods off the top of their heads and did not have definitive answers for some of the related questions. In summary, the speakers introduced the concept of weak sets and discussed their unique properties. They also highlighted the benefits of using FreshBooks for managing invoices and finances. Despite some uncertainty, they acknowledged the importance of continuous learning and exploration in the ever-evolving world of technology.

    • Understanding WeakSet, WeakRef, preventDefault and Spread Operator in JavaScriptLearn how to use WeakSet and WeakRef for managing objects and references, preventDefault for controlling event behavior, and Spread Operator for merging arrays and objects in JavaScript.

      In JavaScript programming, there are various techniques and methods that can be used to achieve specific functionalities. Two such techniques discussed were WeakSet and WeakRef, which are used for managing objects and references respectively. While they can be useful, it's important to understand their implications and use them judiciously as they may not be necessary for all use cases. Another important concept discussed was the use of the preventDefault method in event handling. This method allows developers to prevent the default behavior of an event, such as a form submission or button click, and take control of the interaction. This is particularly useful in modern JavaScript applications where much of the interactivity is handled client-side. Additionally, the spread operator was introduced as a way to spread out the contents of an array or object into a new one. This can be a powerful tool for creating new objects or arrays with the combined properties of multiple existing ones. Overall, it's essential for developers to have a solid understanding of these techniques and others like them to effectively build and interact with modern JavaScript applications. While some may seem obscure or unnecessary, they can make a significant difference in the functionality and performance of your code.

    • Identifying and diagnosing errors in older browsers with LogRocketLogRocket helps developers diagnose errors in older browsers by providing a scrubbable video replay feature, allowing them to see exactly what happened and why their code didn't work. It can also help identify issues with spread syntax and emojis in arrays, and dynamically loading CSS and JavaScript files.

      LogRocket is a valuable tool for developers to diagnose errors and exceptions in their code, especially when dealing with older browsers or syntax that may not be supported. The platform provides a scrubbable video replay feature, allowing developers to see exactly what happened and why their code didn't work. For instance, if a user tries to use spread syntax with an old browser like IE 11, an error will occur, and LogRocket can help identify the issue. Additionally, the output of spreading a string into an array will result in every single letter, including spaces, being an item in the array. However, be cautious with emojis, as they can be made up of multiple characters and may not display correctly when spread. For CSS and JavaScript files, they can be loaded dynamically by adding a link tag for CSS or using a dynamic import function for JavaScript, which returns a promise after being given a path.

    • Understanding JavaScript's event loop and tasksJavaScript's event loop manages tasks, including new programs and event callbacks. Understanding tasks and the event loop is crucial for JavaScript development. Weak maps automatically remove keys when objects are no longer referenced, making them useful for dealing with objects that may be garbage collected.

      During the discussion, the importance of understanding JavaScript's event loop and tasks was emphasized. Tasks are any JavaScript code scheduled to be run by standard mechanisms, including starting a program, event callbacks, and intervals or timeouts. They are added to a task queue when a new JavaScript program is executed or when an event fires. Understanding the event loop and tasks is crucial for JavaScript development as it demonstrates a deeper understanding of the language beyond just writing code. Additionally, the concept of a weak map was introduced. A weak map is a collection of key-value pairs where the keys are weakly referenced, meaning that if the object goes away, the key will be removed from the map, allowing for garbage collection. This is different from a regular map, where keys can be anything, including objects. When comparing a weak map and a map, one key difference is that a map can have anything as keys, while a weak map requires objects as keys. Weak maps are useful when dealing with objects that may be garbage collected, as the weak map will automatically remove the key when the object is no longer referenced in JavaScript. Overall, the discussion highlighted the importance of understanding the event loop and tasks in JavaScript, as well as the benefits of using a weak map when dealing with objects that may be garbage collected.

    • Managing metadata for DOM elements with WeekMap and WeekSetUse WeekMap and WeekSet for tracking events or properties in DOM elements, simplifying storage and automatic garbage collection. Extract query string values easily with URLSearchParams.

      Using WeekMap and WeekSet in JavaScript can be an effective way to manage metadata for DOM elements, especially for tracking events or properties. This approach allows for easy storage and automatic garbage collection when the DOM element is deleted. Another key takeaway is the use of URLSearchParams to access query string values in JavaScript. This built-in browser feature simplifies the process of extracting query string values, saving time and effort compared to manually parsing the query string. Additionally, Auth0 is a valuable solution for handling authentication, authorization, roles, and permissions for applications, making it an essential tool for developers. Overall, these topics highlight useful techniques and tools for enhancing JavaScript development and optimizing workflows.

    • Auth0 for easy application authentication and various featuresAuth0 simplifies app auth with providers, compatible with various frameworks, and offers features like biometrics and customizable login pages. Array method dot sum tests if array values meet criteria, not for creating new arrays. To delete a client-side cookie, parse, remove, and update document.cookie.

      Auth0 simplifies application authentication by providing a service that makes it easy to add login functionality with various providers like Twitter, Google, Discord, and more. It's compatible with various frameworks like Node, Express, React, Next, and has an SDK for different languages. Auth0 also offers features such as biometrics and customizable login pages. Another important topic discussed was the Array method dot sum. It's not for creating a new array with some values of the old array, but rather for testing if some values in an array meet a certain criteria. For instance, it can be used to ensure that at least one family member in an array is over 18 years old. Regarding cookies, deleting a client-side cookie involves parsing the document.cookie string, removing the desired cookie, and then setting the document.cookie to the updated string. Alternatively, setting it to an empty string or deleting it via a library might also work. Overall, the discussion covered various topics related to application development, including authentication, array methods, and cookies. These insights can be valuable for developers looking to enhance their skills and build better applications.

    • New lawnmower blade discovery and iPhone game enjoymentSharpening and balancing lawnmower blades enhances grass appearance, while Builderment, an iPhone game, offers programming and automation challenges for enjoyment.

      The speaker discovered two new things during their recent experiences: the importance of keeping lawnmower blades sharp and balanced, and the enjoyment of playing a programming and automation game called Builderment on their iPhone. Regarding lawn care, the speaker was intrigued by the difference in grass appearance when using a sharp and balanced blade compared to a dull one. They were determined to learn how to sharpen their lawnmower's blades themselves, as their tractor model has six blades, each with a unique function. They also mentioned the existence of a blade balancer, a handy tool to ensure even cutting and prevent rattling. As for the iPhone game, the speaker shared their excitement about Builderment, a factory building and automation game they discovered on an airplane. Despite initially thinking it was a simple mindless game, they were surprised to find it challenging and engaging, especially as a computer programmer. The game allowed them to think about systems and creating complex processes, making it an enjoyable way to scratch their programming itch. Overall, the speaker's experiences highlighted the importance of keeping tools in good condition and the potential enjoyment of discovering new games or skills.

    • Learning Web Development with Level Up TutorialsLevel Up Tutorials teaches web development using JavaScript and HTML, focusing on fundamentals before advanced concepts, and offers team accounts for organizations.

      Level Up Tutorials is offering a unique approach to learning web development by focusing on real web components using just JavaScript and HTML. They emphasize the importance of understanding the fundamentals before diving into advanced concepts. The team is excited to release new courses in the coming months, and they even offer team accounts for larger organizations. If you're interested in this method and want access to their content for your team, visit leveluptutorials.com/forward/pro. For more information and past episodes, check out syntax.fm.

    Recent Episodes from Syntax - Tasty Web Development Treats

    789: Do More With AI - LLMs With Big Token Counts

    789: Do More With AI - LLMs With Big Token Counts

    Join Scott and CJ as they dive into the fascinating world of AI, exploring topics from LLM token sizes and context windows to understanding input length. They discuss practical use cases and share insights on how web developers can leverage larger token counts to maximize the potential of AI and LLMs.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    CJ: X Instagram YouTube TwitchTV

    Randy: X Instagram YouTube Threads

    788: Supabase: Open Source Firebase for Fullstack JS Apps

    788: Supabase: Open Source Firebase for Fullstack JS Apps

    Scott and CJ chat with Paul Copplestone, CEO and co-founder of Supabase, about the journey of building an open source alternative to Firebase. Learn about the tech stack, the story behind their excellent documentation, and how Supabase balances business goals with open-source values.

    Show Notes

    • 00:00 Welcome to Syntax!
    • 00:30 Who is Paul Copplestone?
    • 01:17 Why ‘Supa’ and not ‘Super’?
    • 02:26 How did Supabase start?
    • 08:42 Simplicity in design.
    • 10:32 How do you take Supabase one step beyond the competition?
    • 12:35 How do you decide which libraries are officially supported vs community maintained?
      • 15:17 You don’t need a client library!
    • 16:48 Edge functions for server-side functionality.
    • 18:51 The genesis of pgvector.
    • 20:59 The product strategy.
    • 22:25 What’s the story behind Supabase’s awesome docs?
    • 25:26 The tech behind Supabase.
    • 35:46 How do you balance business goals with open source?
    • 42:01 What’s next for Supabase?
    • 44:15 Supabase’s GA + new features.
    • 48:24 Who runs the X account?
    • 50:39 Sick Picks + Shameless Plugs.

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    CJ: X Instagram YouTube TwitchTV

    Randy: X Instagram YouTube Threads

    787: You Should Try Vue.js

    787: You Should Try Vue.js

    Scott and CJ dive deep into the world of Vue.js, exploring what makes this frontend framework unique and why it stands out from React and Svelte. CJ gives a comprehensive tour, covering everything from getting started to advanced features like state management and Vue’s built-in styles.

    Show Notes

    Vue.js: The Documentary.

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    786: What Open Source license should you use?

    786: What Open Source license should you use?

    Scott and CJ dive into the world of open source, breaking down its meaning, benefits, and the various types of licenses you’ll encounter. From permissive licenses like MIT and Apache 2.0 to copy-left licenses such as GNU GPLv3, they’ll help you choose and apply the right license for your project.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    785: What’s Next for NextJS with Tim Neutkens

    785: What’s Next for NextJS with Tim Neutkens

    Scott and Wes dive into the world of Next.js with special guest Tim Neutkens from Vercel. They explore the latest updates, including the React Compiler and React Server Components, discussing their impact on developer workflows and the future of Next.js development.

    Show Notes

    • 00:00 Welcome to Syntax!
    • 00:30 What does the React Compiler do?
    • 05:04 Will React Compiler help with managing Context?
    • 06:39 What happens if you’re not using a React Compiler?
    • 09:30 Will this work on any NextJS version?
    • 12:18 What are React Server Components?
    • 16:28 Shipping all the data inside an encapsulated component.
    • 20:17 Clearing up the frustrations around retrofitting server components.
    • 23:13 Handing migration.
    • 28:30 Is this just a fetch request with props?
    • 36:41 How closely are the NextJS and React teams working?
    • 41:53 Will we ever get Async Client Components?
    • 43:52 Async Local Storage API.
    • 45:31 Turbopack.
    • 57:51 Sick Picks & Shameless Plugs.

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    784: Logging × Blogging × Testing × Freelancing

    784: Logging × Blogging × Testing × Freelancing

    In this Potluck episode, Scott and Wes tackle listener questions on modern blogging, website environmental impact, and using LangChain with LLMs. They also cover CSS hyphens, unit vs. integration testing, and balancing web development with new parenthood.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott: X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    783: How We Built a Netflix Style “Save for Offline” Feature Into Syntax

    783: How We Built a Netflix Style “Save for Offline” Feature Into Syntax

    Scott and Wes dive into the world of browser caching for audio files, exploring the File System API and the Cache API. They discuss size restrictions across different browsers, how tools like Riverside.fm leverage IndexedDB, and walk through code examples for creating, retrieving, and managing cached audio data.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott:X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    782: The Developer’s Guide To Fonts with Stephen Nixon

    782: The Developer’s Guide To Fonts with Stephen Nixon

    Scott and CJ are joined by Stephen Nixon of ArrowType to delve into the world of fonts and type for developers. They explore the intricacies of font creation, the utility of variable fonts, and offer tips for making visually appealing typography on the web.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott:X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    781: Potluck - The Value of TypeScript × Vue vs Svelte × Leetcode

    781: Potluck - The Value of TypeScript × Vue vs Svelte × Leetcode

    In this potluck episode of Syntax, Scott and CJ serve up a variety of community questions, from the nuances of beginner vs. advanced TypeScript to the pros and cons of SvelteKit. They also discuss falling out of love with React, shipping private packages via NPM, and the eternal struggle of always starting but never finishing projects.

    Show Notes

    Sick Picks

    Shameless Plugs

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott:X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    780: Cloud Storage: Bandwidth, Storage and BIG ZIPS

    780: Cloud Storage: Bandwidth, Storage and BIG ZIPS

    Today, Scott and Wes dive into cloud storage solutions—why you might need them, how they use them, and what you need to know about the big players, fees, and more.

    Show Notes

    Hit us up on Socials!

    Syntax: X Instagram Tiktok LinkedIn Threads

    Wes: X Instagram Tiktok LinkedIn Threads

    Scott:X Instagram Tiktok LinkedIn Threads

    Randy: X Instagram YouTube Threads

    Related Episodes

    JavaScript Fundamentals (Over)Simplified

    JavaScript Fundamentals (Over)Simplified

    Dude, in this epic podcast episode, Seth and Jake totally share their coding journeys and break down some rad concepts in JavaScript, bro. They talk about data types, variables, arrays, objects, and booleans, dude. It's all about understanding the basics and how these things work together, you know?

    Then they get into functions, loops, and conditionals, man. These are like the building blocks of programming logic, where you can make things happen and repeat code, dude. They also drop some knowledge on objects and arrays, showing how they fit into loops and conditionals, bro. Just remember, loops and conditionals are crucial, but you gotta master other stuff too, like HTML, CSS, and backend integration, to ride the wave of building complete applications, dude. Catch you on the coding side!

    Special thanks to Diarrhea Planet for our intro and outro music and @SkratchTopo for our artwork.

    Hasty Treat - Web Dev Resource Sick Picks

    Hasty Treat - Web Dev Resource Sick Picks

    In this Hasty Treat, Scott and Wes talk about all of their favorite web dev resources — a full episode of sick picks!

    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.

    Show Notes

    2:03 - Twitter Accounts

    5:00 - Web Dev Resources

    7:37 - Design Resources

    11:36 - Desktop Tools

    14:59 - YouTube

    Links

    Tweet us your tasty treats!

    Tech Interview 101: Crack The Coding Interview

    Tech Interview 101: Crack The Coding Interview

    Parth's YouTube: https://www.youtube.com/DestinationFAANG/ 

    Most asked Technical Questions: https://docs.google.com/spreadsheets/d/1hzP8j7matoUiJ15N-RhsL5Dmig8_E3aP/edit#gid=1377915986

    Github Repo with all the Solutions: https://github.com/DestinationFAANG/Destination-FAANG-Java-Solution 
     
    Book: Cracking the Coding Interview, Programming interviews exposed

    Preparation Schedule: https://www.techinterviewhandbook.org/coding-interview-study-plan/

    Master Technical Interviews: https://youtu.be/-LVmKNvflnY?si=jrXIS8uzf9haBVED

    In this episode, Parth joins me to delve deep into the heart of technical interviews, a critical gateway in the tech industry. Our comprehensive discussion covers the various formats of technical interviews across different companies, highlighting the diversity and commonalities in these crucial assessments. We explore the typical pitfalls and mistakes that candidates often encounter, providing practical advice on how to avoid them. Our conversation also navigates through effective strategies for tackling tough technical questions, even when the answer seems elusive. 

    Potluck - Where to start with JS × Freelancing × Cron jobs × Split testing × Frameworks in 2019 × More

    Potluck - Where to start with JS × Freelancing × Cron jobs × Split testing × Frameworks in 2019 × More

    It’s another potluck episode in which Wes and Scott answer your questions! This month - thoughts on frameworks for 2019, React Native, when should you start freelancing, where to start with JS, cron jobs, split testing and more!

    DevLifts — Sponsor

    DevLifts - Thad and JC are on a mission to make web developers healthy. They’re currently offering two options: The first is Fit.Start - perfect for beginners or those looking to get back at it.
    Use the coupon code “syntax” to get 50% off the fit.start plan. The second is DevLifts Premium - for those looking for a laser-focused approach and maximum accountability. Use the coupon code “tasty” to get 50% off the premium plan. Check it out today! Just for January their eight-week plan is back. Use the coupon code “newyear19” to get $50 off.

    Kyle Prinsloo’s Freelancing & Beyond — Sponsor

    Kyle Prinsloo teaches you everything you need to know about freelancing, including how to quit your job, earn a side-income and start taking control of your life. Check it out at https://studywebdevelopment.com/freelancing and use the coupon code “syntax” at checkout to get 25% off.

    Show Notes

    1:40

    • Where is the best place to start with JS coming from WordPress?

    5:36

    • How do you set up cron jobs? What are the best tools to use, should they run on their own server or on the application server, etc.?

    17:13

    • What new skills, frameworks, projects are you look forward to learning in 2019?

    21:35

    • Do you use any software for tracking analytics on your site and do you ever use this data to run split tests? If so, what is your preferred method for running split tests?

    28:24

    • What’s your best tip for young coders to stay productive and not lose time?

    32:08

    • I’m 17 and learning web dev. I’m pretty concerned about my skills and feeling some impostor syndrome. Is it ok to start freelancing?

    37:26

    • What is React Native? How do people tend to use it? If you want a native and web app, do they share code?

    Links

    ××× SIIIIICK ××× PIIIICKS ×××

    Shameless Plugs

    Tweet us your tasty treats!