Syntax - Tasty Web Development Treats

Alle afleveringen

1.049 afleveringen, van nieuw naar oud

  1. 749: Coding Shopify with Anne and Trudy of Design Packs

    29 maart 2024 · 58 min

    Afspelen
    Scott and Wes are joined by special guests Trudy MacNabb and Anne Thomas from Design Packs, diving into the nitty-gritty of Shopify design. Tune in as they dissect the pros and cons, challenges, and unveil their daily toolkit for crafting stunning Shopify websites.
    Show Notes 00:00 Welcome to Syntax!
    00:59 Who is Anne Thomas?
    02:30 Who is Trudy MacNabb?
    04:06 Shopify themes, how does one build a theme?
    05:34 Do you have enough control with LiquidJS?
    07:52 Changing components of a liquid template.
    08:58 LiquidJS improving their dev tools.
    09:29 LiquidJS email marketing.
    10:32 Can you make your own LiquidJS methods?
    Too Many Tabs
    Lees meer

    11:34 How would you create a theme from scratch using modern tools?
    13:30 What about local dev and live reload?
    Shopify Tools CLI

    15:17 Is Shopify improving?
    17:13 What do you hate about Shopify themes?
    Shopify Tools Theme Kit

    18:59 Have you used Hydrogen?
    Shopify Hydrogen

    20:09 Headless has sacrifices.
    22:02 Are people building full websites in Shopify?
    23:56 Apps and integrations.
    25:56 Are people creating businesses around these integrations?
    29:16 What are design packs?
    31:26 Do you run your own servers?
    31:57 How does billing work with clients?
    33:18 Apps being ‘Sherlocked’.
    ‘Sherlocking’ Explained

    35:21 Where is the data stored?
    36:35 Can you make a custom UI?
    38:40 What are the downsides of building apps on Shopify?
    39:17 Are you expected to maintain versions?
    40:46 Do you manage all the support independently?
    42:01 How do you match with their existing themes?
    43:54 What are the most popular blocks?
    45:17 Does Shopify provide bundlers or compilers?
    46:47 Shopify moving to blocks.
    47:38 Living as a digital nomad.
    Syntax Episode 586 on Nomad Developing

    49:48 A new app Anne and Trudy launched.
    51:35 Limited by block size.
    54:08 Sick Picks + Shameless Plugs.
    Sick Picks Trudy: Bar of Shampoo

    Anne: Alie Ward Ologies Podcast

    Shameless Plugs Trudy: 25% off using SYNTAX25 at Design Packs

    Hit us up on Socials! Syntax: X Instagram Tikto…

  2. 748: Fitness Will Make You a Better Developer

    27 maart 2024 · 55 min

    Afspelen
    Level up your coding game -and your gains! Today, Scott and Wes weigh in on the importance of physical fitness for developers, covering motivation, diet, lifting basics, routines, and swole-inducing supplements.
    Show Notes 00:00 Welcome to Syntax!
    01:14 Brought to you by Sentry.io.
    03:10 A very quick disclaimer.
    03:32 A brief view of our fitness history.
    06:19 Why is fitness important for developers?
    09:12 Setting your goals.
    13:06 Getting started with fitness. 13:13 Body-weight.
    13:58 Stretching.
    16:47 Fun activities that don’t feel like workouts.
    17:48 Lifting weights.
    Stronglifts
    Lees meer

    StartingStrength

    25:47 Home gym gear.
    Rogue Stall Bar

    37:14 Fitness programs.
    40:53 I guess we have to talk about diet.
    MacroFactorApp

    46:37 Motivation.
    47:42 Supplements.
    BulkSupplements.com Creatine

    51:23 Sick Picks.
    Sick Picks Wes: Wikday Pull Up Bands

    Scott: Booty Bands

    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

  3. 747: Middleware Explained

    25 maart 2024 · 28 min

    Afspelen
    Join Wes and Scott for a hasty episode of Syntax as they unpack the power of middleware for developers, covering caching, authentication, A/B testing, error handling, and user redirection in a quick, punchy rundown to supercharge your backend skills!
    Show Notes 00:00 Welcome to Syntax!
    00:41 Syntax on YouTube.
    01:28 What is middleware?
    05:04 Some real-world examples of middleware. 05:10 Authentication.
    07:44 Redirecting users to a specific instance.
    08:28 Logging + statistics.
    09:41 Debugging.
    10:00 Timers.
    10:46 A/B testing.
    11:59 Error handling + logging.
    12:23 Caching.
    13:02 Multi-tenant applications.
    Lees meer

    15:08 Where does it run?
    18:07 What are the limitations?
    21:52 Next.js middleware is one file only.
    NextJS Middleware

    23:35 Sveltekit solution.
    Sveltekit Hooks

    24:31 Connect style.
    Fastify Express

    Fastify Middle

    25:28 One last thing, NPM Installing.
    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

  4. 746: Infrastructure for TS Devs: Kubernetes, WASM and Containers with David Flanagan

    22 maart 2024 · 59 min

    Afspelen
    Deploy your own tech stack: Wes and Scott are joined by Kubernetes expert David Flanagan to be schooled on how Kubernetes, Docker and even WASM containers work.
    Show Notes 00:00 Welcome to Syntax!
    01:55 Should developers know how to run their own servers?
    04:57 What is “bare metal”?
    11:49 What the hell is Kubernetes?
    12:25 Why would somebody need Kubernetes?
    15:37 Using Kubernetes to spin up different instances on cloud providers.
    etcd
    Lees meer

    16:43 Kubernetes managing traffic spikes.
    18:46 How much downtime can you handle?
    22:11 What exactly is a container?
    24:06 What containers do you prefer?
    Docker

    Containerd

    25:28 Some additional terminology.
    OCI Open Container Initiative

    26:43 What about WASM?
    WASM WebAssembly

    29:31 Building a Docker container.
    31:11 Why would someone want to use a WebAssembly container?
    32:12 Are people shipping this technology?
    33:36 What functions would you put in WASM?
    36:57 How does someone make a WASM image?
    39:22 A little more about Spin.
    Fermyon Spin

    39:56 What type of processors are used in these servers?
    42:27 What are home servers running on?
    Turing Pi 2

    Daniel Mangum

    Universal Blue

    46:40 How should someone get started with Kubernetes?
    Kubernetes.io

    Rawkode YouTube

    Kubesimplify

    Learnk8s

    48:51 Infrastructure as code.
    CDK for Terraform

    GraalVM

    55:19 Sick Picks & Shameless Plugs.
    Sick Picks David: Golem.cloud

    Restate.dev

    Shameless Plugs David: Rawkode YouTube

    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

  5. 745: Modern JS Toolchains (Biome, Oxc + More)

    20 maart 2024 · 48 min

    Afspelen
    Wes and Scott dive deep into the world of JavaScript toolchains, exploring everything from linters and compilers to transpilers and formatters. Tune in as they shed light on cutting-edge technologies like Biome, UnJS, and Ezno that are shaping the future for developers.
    Show Notes 00:00 Welcome to Syntax!
    01:37 Syntax is on YouTube.
    02:09 Do we really need tooling?
    04:02 Popular tools are predominantly plug and play.
    06:15 What can tooling do for us?
    07:16 The tools in today’s workflow. 07:21 Linters.
    11:29 Compilers and transpilers.
    13:30 Formatters.
    16:18 Tokenizers and Parsers.
    16:46 Bundlers.
    17:59 Macros.
    Lees meer

    20:26 The new tools in the space. 20:47 Biome, one toolchain for your web project.
    28:27 Oxc, the JavaScript oxidation compiler.
    33:01 Deno, code formatting.
    34:13 ESBuild, an extremely fast bundler for the web.
    34:37 Rolldown, fast Rust-based bundler for JavaScript.
    38:34 Ezno, TypeScript type checker.
    40:24 UnJS, Unleash JavaScript’s Potential.
    41:45 Lightning CSS, CSS parser, transformer, bundler, and minifier.

    42:31 Is JavaScript good enough to handle these tools?
    43:26 Sick Picks + Shameless Plugs.
    Sick Picks Scott: Shinobi-Geddon: The 1980s Ninja Craze

    Wes: Bachans Japanese Barbecue Sauce

    Shameless Plugs Scott: Syntax on YouTube

    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

  6. 744: Docker For Developers

    18 maart 2024 · 26 min

    Afspelen
    Join Scott and CJ on a rapid-fire journey through Docker. From unraveling containerization to practical advice on incorporating Docker into your workflow, this quick-paced episode has everything you need to navigate the world of container technology.
    Show Notes 00:00 Welcome to Syntax!
    01:19 Brought to you by Sentry.io.
    02:20 Easily reproducible environments.
    02:57 Containerization technology.
    Containerization
    Lees meer

    OS-level Virtualization

    04:42 Docker is brand name containerization, there are others. Podman

    Containerd

    Buildah

    LXD

    05:26 Why would a web developer want to use Docker?
    08:19 How do you get started with Docker? Download Docker Desktop

    Start With Docs

    Docker 101

    09:14 How does Docker work?
    Docker Sentry

    Docker Registry

    Docker Layers

    16:46 Adding Docker to an existing project.
    SvelteKit Dockerfile

    Node.js / Express

    CLI Runner Twitchbot

    Development PHP / Mongodb Dockerfile

    21:37 What is Docker Compose?
    Docker Compose

    22:50 What are some ‘gotchas’ or things to look out for when setting up a project?
    Coding Garden Example

    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 Tiktok TwitchTV YouTube
    Randy: X Instagram YouTube Threads

  7. 743: JavaScript Figma Plugins & Working at GitHub With Cameron McEfee

    15 maart 2024 · 57 min

    Afspelen
    Wes and Scott welcome Cameron McEfee, a seasoned creative director whose journey spans GitHub, Sentry.io, and the innovative realm of JavaScript plugins with his creation, GuideGuide. Cameron explores plugin building, iterating on the iconic Octocat for GitHub, and shedding light on the multifaceted roles of a creative director.
    Show Notes 00:00 Welcome to Syntax!
    01:06 Who is Cameron McEfee?
    03:00 What does a Creative Director do?
    09:47 In a creative and collaborative field, how do you deal with hurt feelings?
    12:32 Experiences at GitHub (404/500 pages).
    15:35 Who is responsible for all the Octocat variations?
    GitHub Octodex
    Lees meer

    17:18 Did you ever get in trouble for using famous IP?
    21:07 Working at Sentry.io.
    25:08 What is your illustration process?
    27:04 What is GuideGuide?
    GuideGuide

    Moo Tokenizer/Lexer

    33:13 Grid Notation.
    36:10 Can ‘good colors’ be calculated, can good design be math’d?
    40:46 What was the process of building your own plugin?
    43:37 Adding guides with JavaScript APIs.
    44:44 Recreating application UIs within plugins.
    GoodHertz

    50:22 How are you architecting these plugins?
    52:44 Sick Picks & Shameless Plugs.
    Sick Picks Cameron:
    Ember Mug

    Waterparks Spotify

    Execute Program

    Shameless Plugs Cameron: GuideGuide 50% off

    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

  8. 742: Potluck: Migrating to Typescript, Semver Explained, Accurate Timers and Countdowns

    13 maart 2024 · 57 min

    Afspelen
    Scott and CJ dive into a potluck of developer queries, from their favorite tech reads to essential web dev fundamentals. Tune in as they dish out expert advice on migrating React projects to TypeScript, crafting precise timers for countdown apps, and navigating the world of free-tier plans.
    Show Notes 00:00 Welcome to Syntax!
    01:20 Brought to you by Sentry.io.
    02:16 What book changed your life? Whatever you think, think the opposite
    Lees meer

    It’s not how good you are, it’s how good you want to be

    Crucial Conversations thanks @benvinegar

    04:58 What are the web development fundamentals for beginners? Command Line Power User

    08:39 What are your thoughts on Chris Coyer’s post on his sale of CSS-Tricks? Chris Coyer’s Post

    11:51 Advice for migrating an existing React project to TypeScript.
    20:38 Countdown apps, performance vs accuracy.
    25:19 Are you listening to podcasts? Which ones?
    31:46 With AI on the rise, will free-tier plans become a thing of the past? Coolify

    Syntax 730: Own Your Own Paas

    35:59 What is SemVer anyway? semver.org

    npmjs

    TypeScript on Semantic Versioning

    40:14 A question on ergonomics, home office aesthetics and productivity.
    47:59 Do you ever stop to consider VueJS in 2024? Why or why not? unjs.io

    52:12 Sick Picks + Shameless Plugs.
    Sick Picks Scott: Ellenos Yogurt

    CJ: Flat Iron Pepper

    Shameless Plugs Syntax.fm YouTube

    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

  9. 741: TypeScript Interview Questions - STUMP’d

    11 maart 2024 · 25 min

    Afspelen
    Wes and Scott tackle TypeScript trivia, from combining string literal types to unraveling the mystery of d.ts files. Join them as they challenge each other on conditional types, interfaces, triple-slash directives, and TypeScript records.
    Show Notes 00:00 Welcome to Syntax!
    TypeScript
    Lees meer

    01:05 Brought to you by Sentry.io.
    03:20 How do you combine string literal types?
    Template Literal Types

    06:34 What is a TypeScript Generic and why would you use one?
    TypeScript Generics

    08:12 How do you write a conditional type?
    TypeScript Conditional Types

    09:58 Generating TypeScript type from a function.
    Stricter Generators

    14:09 How do d.ts files work?
    Module .d.ts

    16:25 Name one difference between a type and an interface.
    Types vs Interfaces

    19:15 What is a tripple-slash directive and why would you use them?
    Tripple-Slash Directives

    20:52 What is a TypeScript record and what is it used for?
    Utility Types

    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

  10. 740: Local AI Models in JavaScript - Machine Learning Deep Dive With Xenova

    8 maart 2024 · 1 uur 20 min

    Afspelen
    Scott and Wes are joined by special guest Xenova to explore local AI models in JavaScript. From Hugging Face to Transformers.js and practical applications like real-time speech recognition and object detection, this episode dives deep into the world of machine learning.
    Show Notes 00:00 Welcome to Syntax!
    00:41 Brought to you by Sentry.io
    Lees meer

    01:05 Who is Xenova?
    02:08 What is Hugging Face?
    03:29 What is Transformers.js?
    06:16 How was the library developed?
    SponsorBlock

    09:04 How is it able to run?
    10:09 Do they have to run in Python and how does Onnx work?
    Onnx.ai

    Hugging Face Optimum

    14:19 What are some things you can do with this tech?
    16:15 Vision tools.
    17:38 This is actually running locally.
    18:35 Doodle Dash

    21:09 They currently run on CPU, what is required to make it run on GPU?
    24:44 Can you run in JavaScript?
    28:32 How it works with image vectors.
    34:23 Why would people want to run it in another language?
    35:55 Resizing images in the browser instead of on the server.
    38:55 Applications distributed on the web vs running locally.
    43:54 Electron has Node and Chrome, where would you run Transformers.js?
    44:32 The API of Transformers.js
    46:30 Object Detection.
    Semantic Image Search Client

    Real-Time Object Detection

    Background Removal Tool

    48:33 What is the easiest way to get started?
    51:26 Real-time speech recognition on the horizon?
    52:08 Will we ever be able to run Stable Diffusion via JavaScript?
    56:10 The Web LLM.
    57:22 Practical applications for YouTube.
    59:39 What we want to build for Syntax.fm.
    01:06:43 Mean pooling, why it’s necessary.
    01:09:30 Stopping YouTube spam comments.
    01:10:34 K-Means Clustering.
    Text Clustering

    01:13:49 Quantization.
    01:17:35 Sick Picks + Shameless Plugs.
    Sick Picks Xeonva: WebGPU

    Shameless Plugs Xenova: Xenova on X

    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

  11. 739: The LoFi Movement: Building Local First Apps

    6 maart 2024 · 52 min

    Afspelen
    Join Wes and Scott as they explore LoFi (local first) web development, delving into CRDT, Websockets, IndexedDB, SQLite, and more. Discover when Local-First shines and when it’s better to steer clear in this episode packed with practical insights.
    Show Notes 00:00 Welcome to Syntax!
    03:18 Brought to you by Sentry.io.
    04:08 What is LoFi?
    localfirst.dev
    Lees meer

    05:02 The Seven Ideals for Local-first. 05:29 1: No Spinners.
    06:48 2: Your work is not trapped on one device.
    07:56 3: The network is optional.
    08:50 4: Seamless collaboration with your colleagues.
    09:35 Oops, we for got to read 5: The Long Now.
    09:37 6: Security and privacy by default.
    09:45 7: You retain ultimate ownership and control.
    Actual Budget Finance App

    Ink & Switch

    13:01 Sounds great, let’s go! Not so fast, this stuff is hard.
    14:07 The technology involved. 14:30 CRDT (Conflict-free Replicated Data Types).
    Wikipedia Definition

    James Long dotJS 2019 dotconfrences

    17:48 How does it prioritize conflict resolutions?
    19:36 Websockets.
    20:17 IndexedDB + SQLite.
    21:23 Service Workers.

    22:16 The software involved. 22:24 Replicache.
    24:48 YJS.
    25:06 Electric SQL.

    25:51 The most basic LoFi application.
    31:26 Some bigger concepts.
    32:34 Answering some common questions.
    35:19 Some real-world examples of LoFi.
    Habit Path by Scott Tolinski

    37:18 What about Apple PWA nonsense?
    38:20 This seems similar to real-time software and multiplayer.
    38:47 Sounds like too much work.
    Triplit Fullstack Database

    Electric SQL

    Evolu

    40:46 Some useful links. Local-First Web Development

    Local-First Lo.fi YouTube

    Local-First Ink & Switch

    Local-First Reddit

    Syntax GitHub Local-First

    43:30 Sick Picks + Shameless Plugs.
    Sick Picks Wes: Dresscode.dev

    Scott: Monarch Money

    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

  12. 738: Little Scripts: Coding for your Co-workers

    4 maart 2024 · 23 min

    Afspelen
    Process is important. This show is dedicated to examples of non-developer tasks that can be improved by coding scripts. Join Scott and Wes for a deep dive into automation magic.
    Show Notes 00:00 Welcome to Syntax!
    02:11 Brought to you by Sentry.io.
    Lees meer

    03:02 FFmpeg, a tool for video producers.
    FFmpeg

    FFprobe

    06:35 Markdown validation.
    Syntax Markdown Validation

    09:21 AI timestamps for inform editing process.
    Episode 456 Transcript

    12:19 Generating clips for social media.
    13:31 YouTube find and replace tool.
    YouTube Find & Replace - work in progress

    15:03 What other scripts can you create?
    16:17 Packaging a tool for a non-developer to use. 16:54 Apple Scripts
    17:45 Stand-alone website.
    19:25 Script Kit: Shortcut to Everything
    20:19 Other ways to run scripts.
    ZX

    Dax

    22:05 Get in touch with your tips.
    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

  13. 737: JSR: The New TypeScript Package Registry (NPM Killer)

    1 maart 2024 · 59 min

    Afspelen
    Get ready to learn all about the JSR package registry with Wes, Scott, and special guest Luca Casonato of Deno, as they discuss its benefits, share insights on when to use it, and teasing some secret features that promise to enhance your coding journey.
    Show Notes 00:00 Welcome to Syntax!
    00:37 Brought to you by sentry.io.
    00:51 Who is Luca Casonato?
    01:18 Why do we need another package registry?
    Wes Bos Tweet
    Lees meer

    04:35 Is it ESM only?
    06:08 What exactly is JSR?
    07:22 How do you install things from this registry?
    09:38 NPM specifier in NodeJS?
    12:18 Why can’t we just fix NPM?
    14:28 When you make things easier, people make cooler stuff.
    17:49 A little bit about auto-documentation.
    21:18 Auto-Types.
    22:33 Can’t you just put TypeScript files on an NPM?
    24:04 Package Provenance.
    NPM Package Provenance

    25:14 Does JSR have any plans for scanning dependencies?
    27:56 GitHub action integration.
    30:08 Does JSR replace url imports in Deno?
    Import Maps, Ep.596

    32:15 What about publishing JSX, TSX, CSS, WASM, etc?
    34:16 What are Slow Types?
    36:34 Do you think we’ll ever see another implementation of a TypeScript type checker?
    38:23 Types as comments or adding types to JavaScript.
    40:10 What is the anticipated timeline?
    41:52 Are there any parts of TypeScript that you don’t like?
    43:32 What about when TypeScript breaks?
    46:20 JSR community funding.
    49:39 Are you planning on pre-registering popular names?
    52:26 Super secret new features!
    56:39 Sick Picks + Shameless Plugs.
    Sick Picks Luca: Hono

    Shameless Plugs Luca: jsr.io

    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

  14. 736: CJ Reynolds is Joining Syntax

    28 februari 2024 · 57 min

    Afspelen
    Scott and Wes introduce Syntax’s new Senior Content Producer, CJ Reynolds, who will be creating video deep-dives and companion content for topics covered on the podcast. CJ, also known as the host of Coding Garden, shares his passions for web development, teaching and experimenting with new technologies.
    Show Notes 00:00 Welcome to Syntax!
    01:06 Brought to you by Sentry.io.
    04:39 What got you into web development?
    09:23 Does a degree in computer sciences help you in your day to day as a web developer?
    Bell Curve Meme
    Lees meer

    11:39 Wes downloads every single .com domain name.
    15:19 What was your very first web development job?
    18:12 How did you go from C# to websites?
    21:12 What is the worst thing you’ve had to do as a developer?
    22:31 What are some of your favorite projects?
    Is It New Years Day

    Dung Hero

    26:32 What tech are you into right now? What inspires you?
    27:52 Why do you like experimenting with new technologies?
    29:39 Hono v4.0.5.
    30:29 HTMZ

    31:44 If you were to build a startup today, what would your stack be?
    32:39 What’s your tech setup?
    Coding Garden GitHub

    RK Royal Kludge Keyboard

    37:51 What got you into live-streaming?
    40:13 Why do you use a blue screen?
    41:19 What’s your philosophy on teaching?
    Bloom’s Taxonomy

    43:56 What are your non-developer hobbies?
    CJ Skateboarding with Syntax deck

    CJ’s floofy doggo, Pig

    Sony VX10000

    Sony Mavica

    51:00 Sick Picks + Shameless Plugs.
    Sick Picks CJ: Ergonomics, More on Ergonomics

    Scott: Project Farm YouTube trash bag comparison

    Wes: Kitchy Pizza Cutter Wheel

    Shameless Plugs CJ: Coding Garden

    Scott: Syntax on YouTube

    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

  15. 735: The Taliban Stole My Domain

    26 februari 2024 · 15 min

    Afspelen
    Wes shares the story of how the Taliban stole his .af domain. Scott and Wes discuss top-level domain (TLD) best practices, how to find unique custom domain names for your website, and how to avoid having yours stolen.
    Show Notes 00:00 Welcome to Syntax!
    00:16 Brought to you by Sentry.io
    Lees meer

    01:11 The story of how the Taliban stole my domain.
    05:10 When you purchase a domain, does that country receive the registration fee?
    Country Code Top-Level Domain

    Infrastructure Top-Level Domain

    Generic Top-Level Domain

    Sponsored Top-Level Domain

    07:29 Notion lost their .so domain.
    Notion

    09:18 .ai domain names.
    09:53 Other popular TLD options.
    tolin.ski

    wes.io

    12:05 What are the best TLDs?
    13:18 iwantmyname

    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

  16. 734: HTMX Web Apps with Carson Gross

    23 februari 2024 · 52 min

    Afspelen
    Scott and Wes welcome HTMX creator Carson Gross to discuss the versatile applications and optimal scenarios for using HTMX, alongside insights into its creation and evolution. Join us as we explore the future prospects and improvements as we look towards HTMX 2.0.
    Show Notes 00:00 Welcome to Syntax!
    00:52 Brought to you by Sentry.io
    Lees meer

    02:22 Who is Carson Gross?
    BigSkySoftware GitHub

    BigSkySoftware

    03:53 What exactly is HTMX?
    htmx.org

    htmx.org/examples

    07:04 What made you want to create something like HTMX?
    intercooler.js

    10:01 Would HTML look more like HTMX if we were to rebuild it today?
    12:54 Isn’t HTMX a step backward into old-school AJAX?
    16:09 When would you avoid using HTMX?
    17:56 Does HTMX put an unnecessary load on the server?
    21:46 What are your thoughts on rendering everything on the server?
    26:29 What is your favorite stack?
    28:49 Things that are lost moving to the JavaScript framework world.
    30:16 HTMX coupling your front end and back end.
    32:28 How do you feel about web components?
    33:40 What are the big templating engines and your top pick?
    HTMX Essays

    36:33 Object-oriented HTML.
    37:38 Is there an offline story or a “local-first” story for HTMX?
    38:44 What does the future of HTMX look like given its rise in popularity?
    40:03 HTMX and X (Twitter).
    Syntax Show 726

    HTMX on X

    42:30 The Microsoft story.
    45:26 Carson’s thoughts on de-escalating the language around HTMX.
    47:44 Sick Picks + Shameless Plugs.
    Sick Picks Carson: AlpineJS, Datastar

    Shameless Plugs Carson: Hypermedia Systems, HTMX Swag

    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

  17. 733: Egress, scraping, Safari EU changes, is SetInterval worth it?

    21 februari 2024 · 59 min

    Afspelen
    In this potluck episode of Syntax, Wes and Scott discuss egress, scraping, Safari EU changes, and answer questions on updating dependencies and SetInterval.
    Show Notes 00:00 Welcome to Syntax!
    01:35 Brought to you by Sentry.io.
    02:49 I have over 100,000 user images on Cloudinary. How do I migrate to another service?
    Cloudflare-Cloudinary Proxy
    Lees meer

    07:27 Switching from Mac to PC.
    Figma, DaVinci Resolve

    12:32 What’s your take on the Safari 17.4 PWA removal debacle for EU users?
    Bug Report

    Fullscreen API Bug Report

    19:45 Is there any clear front-runner when it comes to monorepo tools?
    23:44 Some big web apps have a div relatively high in the DOM with a class like “scroll-container” or “cursor-events”, why is that?
    32:15 Is ChatGPT Plus worth it? I’m trying to avoid death by 1000 subscriptions.
    ElevenLabs

    37:47 Performance vs accuracy when working with timers.
    40:37 How do you update the dependencies to work with a current version of Node? Also, if you are building from scratch, how do you determine what dependencies to use?
    Syntax show 425: Updating Project Dependencies

    45:52 Clarification on the browser blocking.
    Mozilla’s vision for Firefox MV3

    49:19 Problems when working with JavaScript’s new Date().
    54:27 Sick Picks + Shameless Plugs.
    Sick Picks Scott: LED Flashlight

    Shameless Plugs Wes: Syntax YouTube

    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

  18. 732: Stop going to Spam: DMARC, SPF and DKIM Explained

    19 februari 2024 · 26 min

    Afspelen
    Wes and Scott explore the web standards and email authentication methods that keep your email from going to spam; DMARC, SPF and DKIM. If you send email via a custom domain name, you need to listen to this!
    Show Notes 00:00 Welcome to Syntax!
    01:06 Brought to you by Sentry.io.
    02:08 What exactly are SPF, DKIM, and DMARC?
    02:53 Different ways that you may want to send email. 03:23 Transactional emails.
    Resend, email for developers
    Lees meer

    05:07 Email marketing.
    05:47 Anything else that sends email on your behalf.

    07:13 SPF (Sender Policy Framework).
    Postmark defines SPF

    Postmark SPF in 5 Minutes

    08:34 You can only have one SPF record.
    10:18 DKIM (DomainKeys Identified Mail).
    Postmark defines DKIM

    13:39 DMARC (Domain-based Message Authentication, Reporting, and Conformance).
    Convertkit

    16:38 RUA Reporting.
    18:03 How to set up reporting.
    21:08 Does emails marked as spam hurt the IP that sends them?
    22:18 Other things to consider.
    Special thanks to David Flanagan for the help on this! @rawkode

    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

  19. 731: Client side security, XSS attacks & CSP with Stripe’s Alex Sexton

    16 februari 2024 · 1 uur 3 min

    Afspelen
    Scott and Wes are joined by security expert, Alex Sexton of Stripe to cover all things: client security, XSS, attack vectors, and CSP (content security policy).
    Show Notes 00:00 Welcome to Syntax!
    00:31 Brought to you by Sentry.io.
    00:57 Who is Alex Sexton?
    04:44 Stripe dashboard is a work of art.
    05:08 Tell us about the design system.
    React Aria
    Lees meer

    08:59 Who develops the iOS app?
    09:50 Stripe’s CSP (content security policy).
    12:50 What even is a content security policy?
    Content Security Policy explanation

    13:57 Douglas Crockford of Yahoo on security.
    Douglas on GitHub

    15:13 Security philosophy.
    16:59 What about inline styles and inline JavaScript?
    19:41 How do we safely set inline styles from JS?
    20:20 Setting up with meta tags.
    22:52 What are common situations that require security exceptions?
    26:24 Potential damage with inline style tags.
    32:45 Looping vulnerabilities.
    36:32 What about JavaScript injection?
    37:09 Myspace Samy Worm.
    Myspace Samy Worm Wiki

    Sentry.io Security Policy Reporting

    42:02 Does a CSP stop code from running in the console?
    43:28 What are some general security best practices?
    46:35 Strategies for rolling out a CSP.
    51:49 Final tip, Strict Dynamic.
    Strict Dynamic

    56:36 Where does the CSP live within Stripe?
    Original Black Friday story

    59:35 One last story.
    01:01:20 Sick Picks + Shameless Plugs
    Sick Picks + Shameless Plugs Alex: Wes Bos’ Instagram

    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

  20. 730: Own Your Own PaaS

    14 februari 2024 · 58 min

    Afspelen
    Scott and Wes talk about the benefits of owning your own PaaS (platform as a service), the main alternatives in the space, and ways to make passion projects more financially viable.
    Show Notes 00:00 Welcome to Syntax!
    01:12 Brought to you by Sentry.io.
    01:56 What is a PaaS?
    NGINX
    Lees meer

    04:21 Challenges with payment structures.
    Render

    07:02 What is Kubernetes?
    Kubernetes

    07:51 What are the differences between Kubernetes and Docker?
    Docker Swarm

    09:15 Reasons to own your own PaaS.
    Nelify

    Bluehost

    15:05 “Pokémon or Web Service”
    Original 150 Pokémon Characters

    16:49 The players and their pros and cons.
    18:51 Where can you host these services? 19:47 Kubero.
    Kubero

    21:50 Coolify.
    Coolify

    Coolify pricing

    28:15 Caprover.
    Caprover

    29:03 Dokku.
    Dokku

    Shokku

    Ledokku

    Atlas

    Nixpacks

    32:53 Piku.
    Piku

    33:24 Cuber.
    Cuber

    34:13 Acorn.
    Acorn

    Coolify creator, Andras Bacsai on X

    36:44 The challenges of hosting your own PaaS.
    38:46 Jekyll ran on a PC under a desk.
    Jekyll

    39:36 Sometimes less is, in fact, more.
    40:09 Final thoughts.
    45:03 Scott got Bun to work on Coolify.
    51:01 Sick Picks + Shameless Plugs.
    Sick Picks Wes: GripStic Chip Bag Sealer Amazon, GripStic Chip Bag Sealer Aliexpress

    Scott: Caseta Diva Smart Dimmer

    Shameless Plugs Wes: Syntax YouTube

    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

  21. 729: CSS Native @scope

    12 februari 2024 · 18 min

    Afspelen
    In this very hasty treat, Wes and Scott cover CSS Native @scope, the implementation of this tool, and some of its limitations.
    Show Notes 00:00 Welcome to Syntax!
    01:00 Brought to you by Sentry.io.
    01:33 Why scope your CSS?
    03:21 Scott’s hot take.
    05:43 How does @scope CSS work?
    07:31 Similar to a component-based workflow.
    08:00 Not having to specify a selector for your scope.
    09:52 Pseudo inline hover styles.
    11:31 Donut scope.
    13:01 “Inverted donut-hole scope”
    14:50 Browser support + limitations.
    Mozilla @scope
    The Style Element
    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
    Lees meer
  22. 728: AI Superpowers with Kevin Hou and Codeium

    9 februari 2024 · 59 min

    Afspelen
    In this supper club, Scott and Wes welcome Kevin Hou, Head of Product Engineering at Codeium, a blazing fast AI-powered code completion and chat tool for developers.
    Show Notes
    00:00 Welcome to Syntax!
    Lees meer

    05:31 An introduction to Codeium.

    07:56 What information are you sending the AI to get such good completions?
    Codeium compliance

    09:15 Codeium runs a 'Language Server'.

    11:15 Crawling dependency tree and abstract syntax tree.

    12:07 Using Codeium Live.

    12:34 How big of a codebase can you run this on?

    14:39 Sending select amounts of data to AI.

    16:06 Does Codeium maintain codebase preferences and styling (ie. snake case)?

    17:39 Will Codeium scan the dependency?

    19:23 AI UI, have we found the best format?

    21:55 Crazy ideas in tech.

    22:53 Additional AI UI inputs.

    24:14 How do you make an AI model?

    28:42 How does Codeium manage the product roadmap?

    32:09 Do AI models get worse over time? How does Codeium validate that it's not?
    Open AI Evals

    35:39 How is Codeium THAT fast?

    36:49 What programming langauges does Codeium use?

    38:55 Codeium Playground.
    Codeium Playground

    39:15 Caching as a performance improvement.

    39:58 What is the pipe between Codeium and editor?

    40:17 Codeium chat service.

    41:44 A WebSocket system allowing push and pull communication.

    43:13 Closed Beta for GPT 4.0.

    46:12 The dreaded closing quote bug.

    48:26 Sometimes bugs bug Wes.

    49:49 Supper Club Questions

    51:40 Perplexity.ai

    52:35 What editor does Kevin use?

    55:31 Sick Picks + Shameless Plugs
    Sick Picks Kevin: Lapse.com

    Shameless Plugs Kevin: Codeium.com

    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

  23. 727: How to Code: Opinionated TypeScript Stack + Tooling Choices Explained

    7 februari 2024 · 1 uur

    Afspelen
    Join Wes and Scott for a 30,000 foot, ‘soup-to-nuts’ view of web development. From choosing design tools, website styling, and programming languages, to backend infrastructure, data management, and hosting.
    Show Notes 00:00 Welcome!
    00:21 30,000 foot view of web development
    02:37 Brought to you by Sentry.io
    Lees meer

    02:55 Starting with design tools.
    06:10 Code Tooling 06:22 Text Editors
    09:34 Terminal
    14:28 Build Tools
    16:07 Browser and dev tools
    18:21 Formatter and linter.

    21:43 CSS (how you style your website).
    25:34 Programming languages.
    27:14 Backend with metaframework.
    29:36 Backend without metaframework.
    32:20 Runtimes (JavaScript).
    What is Bun? The New JS Runtime

    The Deno Show

    34:02 User interface libraries.
    Shoelace.style

    39:43 Data management: Databases
    41:42 Data management: ORM
    WTF is an ORM

    You should learn Drizzle, the TypeScript SQL ORM

    42:53 Other data management considerations.
    43:33 Image pipelines.
    45:52 Hosting, CDN, CI.
    Where Should You Host Your App? Hosting Providers Compared

    Hasty Treat WTF × SSR vs JamStack vs Serverless?

    47:21 Hosting your site.
    50:19 The finishing touches. 50:26 Brought to you by Sentry.io

    52:18 Captcha

    55:03 Sick Picks + Shameless Plugs.
    Sick Picks Scott: GreatScottLab, Show #594

    Wes: AliExpress Board, Wes’ Demo

    Shameless Plugs Scott: Syntax on YouTube

    Wes: Syntax on YouTube

    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

  24. 726: Is HTMX a Joke?

    5 februari 2024 · 32 min

    Afspelen
    Scott and Wes unravel the mysteries of HTMX, exploring the essentials for getting started, its powerful capabilities, limitations, and possible stacks for building primarily server rendered applications.
    Show Notes 00:00 Welcome
    02:07 Brought to you by Sentry.io
    Lees meer

    02:53 What exactly is HTMX?
    04:30 What you need to know before working in HTMX. 04:35 You need a server.
    05:35 You’ll most likely need a templating engine.
    06:42 You most likely do not need as much client-side JS.
    08:33 You don’t work in JSON
    11:15 Not something you can swap out your UI with in a SPA.
    11:48 Brings back AJAX

    13:32 So, what can it do?
    15:20 And what it doesn’t do. 18:25 It doesn’t do server-side responses.

    19:09 What about animations?
    19:20 What about CSS?
    19:57 What about Web Components?
    20:06 What about third-party client-side JS?
    20:18 What about WebSockets and SSE?
    HTMX WebSockets

    20:30 What about extensions?
    HTMX Extensions

    21:00 Wes’ “bomb” question.
    24:16 What Scott likes about HTMX.
    25:45 What Scott doesn’t like about HTMX.
    HTMX Multi-Swap

    30:33 Hype, Meta Framework.
    Hype

    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

  25. 725: Safari is the New Chrome - Jen Simmons of Apple

    2 februari 2024 · 1 uur 2 min

    Afspelen
    Wes and Scott talk with Jen Simmons about the latest updates to Safari, reporting bugs to Apple, understanding color in CSS, new CSS switch controls, and testing your websites in Vision Pro hardware.
    Show Notes 00:00 Welcome to Syntax!
    00:03 Brought to you by Sentry.io
    Lees meer

    01:05 Meet Jen Simmons.
    03:15 Safari has been killing it lately
    Safari Release Notes

    WebKit Features in Safari 17.0

    WebKit Features in Safari 17.1

    WebKit Features in Safari 17.2

    10:25 Wes’ cOnSpirACy about Apple and APIs
    18:18 Where is the best place to report bugs to Apple?
    Bugs.Webkit.org

    Jen on Mastodon

    Web Compat

    20:35 What’s happening with CSS Color gamuts and models?
    33:57 Is contrast color ever going to to land?
    36:25 Where is the CSS Grid and Masonry proposal at?
    44:20 Will we be able to target a specific row in a grid?
    46:17 What are CSS switch controls?
    48:44 How can web devs view their websites in Vision Pro devices?
    Apple Vision Pro

    Running your app in Simulator or on a device

    54:26 In what ways are HTML / CSS / JavaScript running where we don’t realize it?
    58:43 Sick Picks
    Sick Picks Jen: Walking.
    Shameless Plugs Jen: webkit.org X

    Feedback Assistant at Apple

    Sessions - WWDC23 - Apple Developer

    Webkit Standards Positions

    Safari Technology Preview

    Safari Technology Preview Release Notes

    What’s new in CSS at WWDC23

    Rediscover Safari developer features at WWDC23

    What’s new in Web Apps at WWDC23

    Meet Safari for spatial computing at WWDC23

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  26. 724: Potluck: Is Virtual DOM Bad?

    31 januari 2024 · 57 min

    Afspelen
    Is the Virtual DOM Bad? Are keyboard shortcuts important? What is S3 storage? In this potluck episode of Syntax, Wes and Scott answer your questions.
    Show Notes 00:08 Welcome
    01:27 Syntax Brought to you by Sentry.io
    Lees meer

    02:45 Welcome Randy, our new Producer!
    Randy’s YouTube

    04:14 A ‘Canadian Podcast’
    04:43 Is Alpine JS or HTMX a replacement for pug or other templating libraries?
    08:21 What powers the “in-app” browsers and how can we test our sites on it?
    Inject tracking code

    Tauri

    13:16 A deep dive on generators and iterators.
    An Insight into Iteration Protocol through Infinite Scroll in Angular

    15:25 Video podcast observations
    17:18 PROBLEM I need a way of managing state.
    22:34 Why is Virtual Dom (a la React) suddenly bad?
    28:31 In a recent episode (659), Wes mentioned he updated the OG image cards, and noticed a higher click through rate.
    29:07 Updated logo and monster truck intro.
    30:19 Back to OG Images.
    31:51 Are “import * as X” exports build stripped?
    36:46 What is the difference between S3 storage and a CDN.
    Backblaze CDN

    45:00 How important are keyboard shortcuts or extensions? Are they necessary to be a good developer?
    50:04 Sick Picks + Shameless Plugs
    Sick Picks Scott: Perplexity.ai, Serversideup

    Wes: Zojirushi Rice Cooker

    Shameless Plugs Wes: Wes Bos Courses

    Scott: Sentry

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Randy: YouTube
    Scott: X Instagram Tiktok LinkedIn Threads

  27. 723: Svelte 5: Speed Simplicity Size

    29 januari 2024 · 38 min

    Afspelen
    Unveiling Svelte 5! delving into its latest features. From the impressive speed and simplicity to its compact size, discover what makes this new release so exciting.
    Show Notes 00:00 Welcome
    00:39 Syntax Is A Video Podcast!
    @syntaxfm on YouTube
    Lees meer

    01:52 Brought To You By Sentry.io

    02:42 Svelte 5 Introduction
    Svelte 5 Intro

    05:45 What Are Runes? 06:21 $state()
    11:49 $props()
    Class as a rest prop

    16:41 $effect()
    21:17 $inspect()

    23:03 What Are Snippets?
    27:33 What Are Events?
    30:02 Built In Functions
    32:42 Smaller Output
    Reddit example

    33:31 Speed
    Benchmarks

    35:00 Anticipated Release
    Try it today

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  28. 722: Next Level Web APIs. Bluetooth, File Access, Thomas Steiner - Project Fugu

    26 januari 2024 · 1 uur 2 min

    Afspelen
    Thomas Steiner talks with us about Project Fugu, an effort from Google to enable new classes of applications to run on the web. What is Project Fugu? What are some of Thomas’ favorite APIs to use? What is an IWA vs a PWA? And more!
    Show Notes 00:32 Welcome
    Lees meer

    01:52 Who is Thomas Steiner?

    02:57 What is the overall goal of Project Fugu?

    08:17 When might we see these APIs come to all browsers?

    14:10 Do you have examples of companies pushing for an API?

    18:53 What happens with the face detection API?

    28:33 What is an IWA?

    35:17 What is the web transport API for?

    37:11 What is MIDI?

    41:20 Nintendo Joycon hack

    45:28 File handlers in a PWA

    50:38 File System Observer API coming soon

    56:26 Sick Picks

    Onnx

    HuggingFace

    Chrome for Developers

    Fugu API Tracker

    Google I/O 2023

    LEGO Education SPIKE

    Igalia

    CapCut

    Descript

    Better Touch Tool

    Sick Picks Laser printers
    Shameless Plugs HowFuguIsMyBrowser

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  29. 721: You should learn Drizzle, the TypeScript SQL ORM

    24 januari 2024 · 54 min

    Afspelen
    We’re doing a Tasty overview of Drizzle in this episode. What is Drizzle? What are different types of databases? How do you host databases? What have we built with Drizzle? And how does Drizzle handle relational data, TypeScript, querying, selects, transactions, and more!
    Show Notes 00:10 Welcome
    Lees meer

    00:52 Syntax Brought to you by Sentry

    01:50 What is Drizzle?

    09:11 Different types of databases

    17:58 Why pay for SQLite hosting?

    20:36 Defining your data structures

    24:27 What we’ve built using Drizzle

    28:28 Relational data

    36:17 TypesScript and Drizzle

    40:53 Querying + Selects with Drizzle

    46:23 Transactions

    47:09 Syntax Drizzle Studio theme

    48:27 Sick Picks

    Drizzle ORM

    Drizzle ORM - Overview

    Meet Drizzle Studio

    Benchmarks

    Sequel Pro

    TablePlus

    phpMyAdmin

    Cloudflare D1

    Bun

    habitpath.io

    Chartable

    Neon

    Answer Overflow

    Drizzle Studio Themes

    Sick Picks Scott: BlackBerry - Apple TV (CA)

    Wes: Candle Warmer Lamp

    Shameless Plugs Syntax Tiktok

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  30. 720: Where Does Time Come From?

    22 januari 2024 · 27 min

    Afspelen
    It is time. Wes and Scott attempt to blow your minds by talking about time, who’s tracking time, where does time come from, what time is it in your browser vs someone else’s server, and standards around time.
    Show Notes 00:25 Welcome
    00:55 Thanks to Chris Enns
    LemonProductions.ca
    Lees meer

    Chris Enns on Twitter

    Podcast tutorials by Chris Enns on YouTube

    03:14 What is time in the browser?
    06:27 What are atomic clocks?
    Atomic Clocks and Cloudflare

    08:22 Network time
    09:35 Device time
    11:11 Why is time so important?
    14:35 Epoch time
    Syntax epoch convertor

    16:58 ISO 8601 standard
    ISO 8601

    19:20 RFC 3339
    RFC3339

    20:35 Time zone support
    21:59 The Temporal API
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  31. 719: Fullstack TypeScript Apps with No Build Step?! with Brian LeRoux

    19 januari 2024 · 1 uur 3 min

    Afspelen
    Wes and Scott talk with Brian LeRoux about not using a bundler, handling TypeScript, live reloading, Enhance being a meta framework, how Enhance handles CSS, his experience at AWS: Reinvent, and the state of JavaScript run times in 2024.
    Show Notes 00:31 Welcome
    Lees meer

    01:00 Introducing Brian Leroux

    01:32 Syntax Brought to you by Sentry

    01:54 You can’t fix bugs you can’t see

    03:14 Not using a bundler

    05:48 Downsides of not using a bundler

    11:13 What about TypeScript?

    13:58 Is there a waterfall of imports?

    18:29 What happens to live reloading?

    22:12 The browser upgrade path

    26:39 Is Enhance a meta framework?

    29:02 What are you doing about SSR web components?

    33:24 Can you refresh part of the application?

    36:22 What about state management and Enhance?

    42:52 How does Enhance handle CSS?

    48:26 How was AWS: Reinvent?

    54:47 What’s happening with the Begin CLI?

    55:55 Any thoughts on new JavaScript run times?

    59:51 Sick Picks

    brian.io

    Quickstart - Architect documentation

    Enhance

    aws-lite

    Sick Picks Analogue Pocket

    Shameless Plugs Begin — The Cloud Platform for Functional Web Apps

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  32. 718: React Server Components

    17 januari 2024 · 56 min

    Afspelen
    Wes and Scott talk through server components, the difference between server components and client components, reasons to run something server side, how server components work, using forms and buttons, what they like and don’t like about it, and tips to learn more.
    Show Notes 00:10 Welcome
    00:52 Syntax Brought to you by Sentry
    01:39 New Heights with Scott and Wes
    04:33 What are React Server Components?
    10:52 The difference between server components and client components
    Tweet: "React Server + Client Components Visualized There is a bit of a learning curve to learn new patterns, but the ease of going between client and server will be worth it.
    Lees meer

    11:37 Why would you want to run something server side?
    15:22 Components are server rendered by default
    16:40 What is JS sprinkles?
    17:29 How do server components work?
    18:51 Moving an existing site to React server components take a while
    20:27 The rules
    27:12 Form Actions + Server Actions
    32:07 Buttons can have actions
    36:32 React Suspense
    39:13 What we like
    Ryan Florence thread

    41:54 What we don’t like
    47:13 Design patterns
    47:35 Other things
    RSC Devtools

    Introducing Waku

    Mux

    49:22 Sick Picks
    Sick Picks Scott: ASUS ZenDrive V1M External DVD Drive

    Wes: Leatherman Arc

    Shameless Plugs Scott: Syntax YouTube

    Wes: Wes Bos Courses

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  33. 717: How to be Productive

    15 januari 2024 · 33 min

    Afspelen
    We’re kicking off 2024 by talking about productivity tips we’re using to stay focused, to do apps, calendars, focus states, and customizing our code editor.
    Show Notes 00:25 Welcome
    00:46 Syntax Brought to you by Sentry
    01:11 Welcome to 2024
    Anxiety and Uncertainty with Dr. Courtney Tolinski - Syntax #670
    Lees meer

    01:42 Getting systems in place
    03:30 Examining your current habits
    08:14 Tracking habits
    12:16 Neural Pathway Chain Breakers
    habitpath.io/waitlist

    STREAKS

    A Passwordless Future Passkeys with Anna Pobletts - Syntax #710

    Clerk

    14:26 Todos
    Stronglifts app

    Getting Things Done

    Things

    Height

    20:14 The calendar as the ultimate tool
    Cron Calendar

    23:52 Using Focus states
    Focus App

    29:09 Customizing VS Code with an extension
    Apc Customize UI++ - Visual Studio Marketplace

    31:14 Momentum
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  34. 716: JS Perf Wins & New Node.js Features with Yagiz Nizipli

    12 januari 2024 · 1 uur 1 min

    Afspelen
    Yagiz Nizipli talks about his involvement with Node.js, implementing .env, how he finds areas to improve in performance, the happy path vs the hot path, and new features coming to Node.js.
    Show Notes 00:32 Welcome
    01:01 Introducing Yagiz Nizipli
    02:21 What is your involvement in Node.js?
    03:27 Implementing .env
    07:03 Why was 20,000 lines of C required?
    11:00 How do you begin to find performance issues?
    15:17 How do you measure improvements?
    26:27 The happy path vs the hot path
    27:36 Is Rspack ready for prime time?
    RSpack
    Lees meer

    28:47 Bundle Size VS runtime perf? Whats more important?
    30:51 What’s it like working on a large project like Node?
    38:26 Will Node ever get TypeScript support?
    40:22 What are loaders?
    44:24 Node.js is getting a config file?
    51:37 Sick Picks
    Sick Picks Oxc

    @Boshen_c

    Shameless Plugs @yagiznizipli

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  35. 715: Google & MS Duopoly, Frontend to Fullstack, Where to Put Business Logic + more(Potluck)

    10 januari 2024 · 52 min

    Afspelen
    Wes and Scott answer your questions about duopoly in tech, tech stacks for creating content, switching from frontend to full stack, DSA knowledge, email HTML, and more!
    Show Notes 00:10 Welcome
    02:21 Syntax Brought to you by Sentry
    03:31 Are you concerned about duopolistic companies taking over the web?
    11:29 What stack do you you use for videos and sharing content?
    15:02 How do you know once your ready to officially make the switch from frontend to full stack?
    17:58 As someone new to tech and looking to apply for junior front end positions, how much should i know about DSA’s?
    Friends that work at big tech companies - did you need Data Structures and Algorithms to get hired? I get an lots of messages from new devs asking how to learn these things. Many of them say the need it to work at FAANG type companies
    Lees meer

    21:59 Which tools would you recommend for crafting HTML emails from scratch?
    Foundation

    MJML

    React Email

    25:03 Hey are you guys setting up your own CI/CD like github action or gitlab CI?
    Netlify

    Vercel

    28:25 What do you think about unstyled component libs. Eg: Ark?
    Ark UI

    31:47 Do I need to have every single feature on mobile as I do on a desktop?
    Obsidian - Sharpen your thinking

    Missive ‐ Team Email, Chat & Tasks

    39:15 How can I get better at planning my code?
    shaky.github.bushong.net

    Monodraw for macOS — Helftone

    Octopus.do, Visual Sitemap Tool, Website Planner, Architecture

    Mermaid | Diagramming and charting tool

    42:32 What exactly makes it so that a piece of logic is client/frontend logic vs backend logic?
    46:17 Sick Picks
    Sick Picks Scott: Sleeping Queens Card Game, 79 Cards : Toys & Games

    Wes: Package drop box
    Shameless Plugs Scott: Syntax Newsletter

    Wes: Wes Bos Courses

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  36. 714: CSS :has() in Every Browser! 10 Uses

    8 januari 2024 · 30 min

    Afspelen
    CSS :has() is out in all browsers and Wes and Scott have got the top 10 reasons you should start using :has() now.
    Show Notes 00:25 Welcome
    02:28 Syntax Brought to you by Sentry
    03:02 Overview of :has
    07:09 The anywhere selector
    09:41 Previous element
    12:59 Layout targetting
    15:45 Form validation styling
    17:51 All siblings
    21:07 Quantity queries
    24:19 Empty children
    24:56 Nested dropdown navs
    26:36 Attribute matching
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads
    Lees meer
  37. 713: The CSS OG Eric Meyer. 1994 CSS, JS in Fridges, Tailwind, and Web Standards

    5 januari 2024 · 1 uur 5 min

    Afspelen
    In this supper club episode of Syntax, Wes and Scott talk with Eric Meyer about his start on the web, the early days of CSS, where CSS is headed, are we going to lose a browser, and more!
    Show Notes 00:32 Welcome
    01:26 Who is Eric Meyer?
    05:44 In the earliest days, what browsers supported CSS?
    10:23 The current web platform test suite
    web-platform-tests
    Lees meer

    17:59 Are CSS features shipping faster these days?
    20:45 CSS learning from preprocessors
    26:24 What do you think about Tailwind and inline CSS?
    33:26 Alternative spaces where CSS may be used
    CSS Speech Module Level 1

    The World Wide Web Consortium Issues CSS2 as a W3C Recommendation

    37:17 Do companies push CSS forward for a business use case?
    44:06 Trying to keep up with all the things is difficult
    48:19 What’s on Eric Meyer’s CSS wishlist?
    54:35 Supper Club Questions
    Bruce Lawson

    Firefox Nightly desktop, Android and iOS.

    SerenityOS

    The Ladybird browser project

    Thunderbird — Free Your Inbox. — Thunderbird

    Arc from The Browser Company

    Mozilla Foundation - Homepage

    01:58 Sick Picks
    Sick Picks Polypane

    Shameless Plugs Igalia - Open Source Consultancy and Development

    meyerweb.com

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  38. 712: 2024 Predictions

    3 januari 2024 · 1 uur 3 min

    Afspelen
    Wes and Scott give their predictions for 2024 in JavaScript, frameworks, server-side JS, tooling, CSS, developer ecosystem, and AI tooling.
    Show Notes 00:10 Welcome
    01:10 Syntax Brought to you by Sentry
    02:00 Types in JS will have real movement
    05:10 Temporal API will ship in 1 browser
    06:38 Perf tooling gets easy for everyone to understand
    07:32 CSS continues to get better where you need less JS
    08:35 The year of the server in frameworks
    10:32 Svelte v5 is very fast
    SvelteKit • Web development, streamlined
    Lees meer

    12:04 Astro is going to have a good year
    Astro

    4 Web Devs, 1 App Idea (Salma Alam-Naylor, Scott Tolinski, Eve Porcello)

    14:22 React server components
    dai-shi/waku: ⛩️ The minimal React framework

    Waku

    19:45 Remix moves away from page-based loaders, to component loaders
    20:52 Hono will become more ubiquitous
    Hono - Ultrafast web framework for the Edges

    23:23 Node will introduce TypeScript support via loaders
    24:48 We will see a route matching Proposal move ahead
    URL Pattern Standard

    26:34 Bun releases full node compat
    27:34 We will see a new Linter + formatter entirely replace
    Language support | Biome

    HTML support · Issue #1326 · oxc-project/oxc

    Prettier · Opinionated Code Formatter

    31:44 New TypeScript typechecker
    32:42 Lightning CSS pops - or does it?
    34:37 You’ll hear more about Rspack and Turbopack
    35:55 Vite isn’t going to release anything big in 2024
    Vite | Next Generation Frontend Tooling

    36:55 CSS contrast-color will land in chrome
    37:27 Relative color will land in all major browsers
    37:48 Scroll animation landing in 2 browsers
    38:40 The year of CSS discovery
    41:20 Safari will Ship 3 missing PWA Support
    44:10 Firefox usage will continue to slip
    47:43 Paid Arc features
    47:55 More XR web experiences as Apple releases in Vision Pro
    49:07 AI Tooling
    Galileo AI

    v0 by Vercel

    Transformers.js

    51:07 Small Models that run in the browser
    52:08 Apps get sherlocked by OpenAI
    53:24 On prem corporate AI
    54:15 Sick Picks
    Sick Picks Scott: ISO100 protein powe…

  39. 711: The Surprisingly Exciting World of Print + PDF CSS

    1 januari 2024 · 32 min

    Afspelen
    In this episode of Syntax, Wes and Scott talk about things to consider when printing something from your website or app including loading CSS only for printing, using units in CSS, CSS counters, creating a PDF, naming pages when printing, and more.
    Show Notes 00:25:15 Welcome
    01:27:04 Syntax Brought to you by Sentry
    01:52:00 Examples of how Wes uses print CSS
    03:42:16 Using it for invoices or receipts
    05:08:24 Delivering a book as a PDF
    05:42:16 How do you load CSS only for printing?
    10:41:08 Using units in CSS
    11:29:15 CSS Counters
    MDN: CSS Counters
    Lees meer

    body { counter-reset: chapter; /* create a chapter counter scope */ } h1:before { content: "Section " counter(chapter) " "; counter-increment: chapter; /* add 1 to chapter */ } h1 { counter-reset: subchapter; /* set section to 0 */ } h2:before { content: counter(chapter) "." counter(subchapter) " "; counter-increment: subchapter; } h2 { counter-reset: section; font-size: 23px; } 14:31:10 Named Pages
    @page title { @top { /* no header for title pages */ content: “”; } } @page chapter { @top { content: “This is a chapter page”; } } 15:27:09 Margins, Headers + footers, Page Numbers
    18:01:18 Debugging Print CSS
    19:57:18 Getting into a PDF
    Docraptor

    Playwright

    Puppeteer

    JSPdf

    24:45:04 Other Things to consider
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  40. 710: A Passwordless Future Passkeys with Anna Pobletts

    29 december 2023 · 56 min

    Afspelen
    In this supper club episode of Syntax, Wes and Scott talk with Anna Pobletts of Passage about passkeys, how passkeys work, how to implement passkeys on your website or app, what the recommended UI is for passkeys, what happens to your passkey if you lose your phone, and more.
    Show Notes 00:32 Welcome
    Lees meer

    01:36 Why do we need something like Passkeys?

    03:34 What are Passkeys for?

    10:04 What took us so long to get to Passkeys?

    11:07 Where’s the two factor part of Passkeys?

    13:08 How are Passkeys phishing resistant?

    14:44 What happens to your Passkey if you lose your phone?

    18:40 What’s the password recovery workflow like with Passkeys?

    23:08 Having a backup device helps a lot with Passkeys

    24:58 Why companies should use two factor or Passkeys

    29:26 What are the standards and tech behind Passkeys?

    32:38 What kinds of companies are implementing Passkeys?

    34:34 What is the recommended UI for telling users about Passkeys?

    39:17 How do you implement Passkeys on your app or website?

    41:47 1Password open sourced low level libraries

    47:34 What does the future look like for Passkeys?

    51:07 Supper Club questions

    53:44 Sick Picks

    1Password

    Have I Been Pwned

    1Password Watchtower

    Passkeys.directory

    passkeys.dev

    FIDO Alliance - Open Authentication Standards More Secure than Passwords

    Sick Picks Cascadia

    Shameless Plugs Passage by 1Password

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott:X Instagram Tiktok LinkedIn Threads

  41. 709: Potluck × Naming Tech × Generators × Layers Follow Up × Sick Picks Page

    27 december 2023 · 53 min

    Afspelen
    In this potluck episode of Syntax, Wes and Scott answer your questions about naming things in programming, use case for generators, CSS @Layers follow up, database prefixes, generalist vs specialist, where’s the sick pick page, and more!
    Show Notes
    00:08 Welcome
    Lees meer

    01:20 Syntax Brought to you by Sentry

    01:48 How much of programming is genuine advanced technical stuff vs just fancy complex sounding names for things?

    05:10 I found a non-trivial use case for GENERATORS!

    11:05 CSS @Layers follow up from 668
    Hacking the Tonal - Proxying, Intercepting + Debugging Traffic? - Syntax #668
    Allow authors to apply new css features (like cascade layers) while linking stylesheets · Issue #7540 · whatwg/html

    15:37 On a previous episode, what did you mention regarding database-prefix?

    18:20 Is it better to be a generalist or specialist as a front end dev?

    23:20 I can’t find the sick picks page on the new site. Any plans to bring that back?
    Filtering and Discovery Notes · Issue #935 · syntaxfm/website

    24:25 Can you guys give some advice about how to grow and improve as developers while struggling with ADHD?
    Supper Club × Coding with ADHD with Dr. Courtney Tolinski - Syntax #532

    29:55 Any chance you could make an embeddable player?

    31:32 Could you have the people behind Cards Against Humanity on a future supper club episode?
    Cards Against Humanity
    Poor Charlie’s Almanack: The Essential Wit and Wisdom of Charles T. Munger
    Cards Against Humanity 99% Sale
    Warehouse | Blackbox
    Yowza

    34:50 What are some of the differences between being a professional developer in Canada versus the United States?

    40:58 Is HTML Over The Wire awesome, or super awesome?

    42:52 How can I develop locally with a postgres database and Prisma / Vercel for hosting?
    Env Variables and Modes | Vite

    46:23 Sick Picks
    Sick Picks Scott: Mother In Law’s Gochujang Fermented Chile Sauce, MIL Kimchi Gochujang and Gochugaru

    Wes: SEOUL SISTERS Korean Kimchi Powder

    Shameless Plugs Scott: Sentry

    Wes: Wes Bos Courses…

  42. 708: How We Made Syntax.fm Faster

    25 december 2023 · 28 min

    Afspelen
    In this episode of Syntax, Wes and Scott talk through the ways they improved performance on the Syntax.fm website, how they knew it was slow to begin with, and the various changes they made to caching, and loading transcripts to improve the speed of the site.
    Show Notes 00:25 Welcome
    01:32 Adding a database requires queries
    03:32 How did we know the site was slow?
    04:25 Syntax Brought to you by Sentry
    07:45 Changing the way transcripts are being loaded
    13:41 Caching
    21:16 Caching Headers
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads
    Lees meer
  43. 707: What happened in JS, CSS And Web Dev in 2023? 2023 Predictions Results!

    20 december 2023 · 48 min

    Afspelen
    In this episode of Syntax, Wes and Scott review their 2023 predictions and see how they did on ideas like Deno getting hotter, new JS APIs, WASM, Houdini, CSS Container Queries, and more!
    Show Notes 00:24 Welcome
    01:18 Syntax Brought to you by Sentry
    02:05 SSR JS sites more the norm
    solidjs.com
    Lees meer

    Remix - Build Better Websites

    Next.js by Vercel - The React Framework

    SvelteKit • Web development, streamlined

    Astro

    04:14 TypeScript Inferred becomes hot
    05:20 Types In JS?
    ECMAScript proposal for type syntax that is erased - Stage 1

    07:55 Deno gets hotter
    11:12 JS runtimes mature
    htmx

    11:50 We will see a new TS Type Checker written in Rust
    14:06 New JS APIs
    What’s the status of this project? · Issue #1101 · dudykr/stc

    Wes Bos on X: "Pretty excited about the new JavaScript non-mutating array methods. Currently in stage 3

    tc39/proposals: Tracking ECMAScript Proposals

    JS Fundamentals - Decorators - Syntax #653

    16:29 Writing towards Winter CG Spec Popular.
    WinterCG

    17:09 Edge Rendering More Common
    Prettier on X: "We setup a $20k bounty for a rust-based compatible printer with prettier.

    $20k Bounty was Claimed! · Prettier

    18:09 A new JS framework
    19:05 Page Transitions API
    19:51 Rust becomes more popular
    24:00 More WASM
    Supper Club × WASM, Fastly Edge, and Polyfill.io with Jake Champion - Syntax #643

    FFmpeg

    Fastly

    25:11 React Beta Docs launch after 5 year dev cycle
    26:47 We start to see CSS Container Queries in production
    29:05 CanIUse issues?
    31:20 CSS Subgrid
    32:56 More AI
    34:06 Tooling
    Vite | Next Generation Frontend Tooling

    Announcing Biome | Biome

    Lightning CSS

    Rspack

    Turbopack

    36:08 People sour on React
    36:47 People sour on eslint
    37:16 Houdini does nothing
    CSS Houdini| MDN

    Is Houdini Ready Yet?

    39:57 How’d we do?
    40:40 Sick picks
    Sick Picks Scott: Super Mario Bros.™ Wonder

    Wes: Tineco Pure ONE S11 Cordless Vacuum Cleaner

    Shameless Plugs Scott: Sentry

    Wes: Wes Bos Courses

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X …

  44. 706: AI and ML - The Pieces Explained

    18 december 2023 · 33 min

    Afspelen
    In this episode of Syntax, Wes and Scott talk about understanding the integration of different components in AI models, the choice between traditional models and Language Learning Models (LLM), the relevance of the Hugging Face library, demystify Llama, discuss spaces in AI, and highlight available services.
    Show Notes 00:25:20 Welcome
    00:55:00 Syntax Brought to you by Sentry
    01:17:00 Understanding how the pieces fit together
    02:31:18 Models or LLM?
    04:43:22 What about Hugging Face?
    08:05:18 What’s Llama?
    08:51:15 What are spaces?
    09:29:06 Services available to you
    12:26:16 What are tokens in AI?
    17:38:18 What is temperature with AI?
    20:33:08 Using top_p
    21:06:00 Using fine-tuning to extend existing models
    22:11:19 Prompts are what you send to the model
    23:17:00 Streaming
    24:48:17 Embeddings
    27:34:17 OpenAI maintains Evals
    28:40:14 Different libraries for working with AI
    Hugging Face
    Lees meer

    Creator of Swift, Tesla Autopilot & Tensorflow. New AI language Mojo with Chris Lattner

    LLaMA

    Spaces - Hugging Face

    OpenAI

    Anthropic \ Introducing Claude

    Replicate

    Fireworks Console

    gpt-tokenizer playground

    openai/tiktoken: tiktoken is a fast BPE tokeniser for use with OpenAI’s models.

    Supper Club × OpenAI, Future of programming, LLMs, and Math with Andrey Mishchenko

    Raycast Pro

    Amazon SageMaker (AMS SSPS)

    openai/evals

    LangChain

    PyTorch

    TensorFlow

    ai - npm

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  45. 705: Is Running Random Code From npm Safe? With Feross Aboukhadijeh

    15 december 2023 · 1 uur 7 min

    Afspelen
    In this Supper Club episode of Syntax, Wes and Scott talk with Feross Aboukhadijeh about his work on Socket which helps to make sure the code you get from npm is safe and secure. They also touch on his work on Wormhole and Web Torrent.
    Show Notes
    00:30 Welcome
    Lees meer

    00:57 Who is Feross Aboukhadijeh?

    01:33 What is Socket?
    [Socket.dev](https://socket.dev
    dominictarr (Dominic Tarr)
    pull-stream/pull-stream: minimal streams

    03:59 Introducing AI package summaries
    Example of the AI summaries
    Introducing AI Package Summaries

    07:04 Is Socket’s focus on visibility of a open source project?

    10:01 What was the inspiration for Socket?
    Introducing “safe npm”, a Socket npm Wrapper - Socket

    16:22 How does Socket detect possible security issues?
    Removed packages
    event-source-polyfill protestware attack
    john wick spam attack

    18:55 How many projects are you injesting for Socket to scan?

    26:00 What kinds of things are people trying to inject in code?
    CS253 Web Security

    29:54 How do I hook Socket up to my project or GitHub?

    32:08 Do we still need to use shrink wrap?

    36:34 How did you implement the torrent spec in JavaScript for WebTorrent?
    WebTorrent Desktop
    WebTorrent FAQ

    43:11 Why did you build Wormhole?
    Wormhole

    47:33 How expensive is it to maintain Wormhole?
    Riverside.fm - Record Podcasts And Videos From Anywhere

    50:37 What do you think of decentralized code repos?
    Radicle
    Project Fugu
    Fugu Tracker

    54:29 Understanding passkeys

    56:15 Supper Club questions
    GitHub Theme - Visual Studio Marketplace
    Web Serial API - Web APIs | MDN

    01:03:04 Sick Picks
    Sick Picks Harry Potter audio books
    Shameless Plugs ChatGPT
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  46. 704: Stump'd JS + CSS Interview Questions

    13 december 2023 · 58 min

    Afspelen
    In this episode of Syntax, Wes and Scott try to stump each other with JavaScript and CSS interview style questions including CSS contain, naming the 7 parts of Houdini, what ARIA stands for, 5 limitations of serverless, and more.
    Show Notes 00:25 Welcome
    01:31 Syntax Brought to you by Sentry
    02:01 Explain CSS Contain and why it exists?
    07:27 In CSS Grid, how would I make a grid of 3 equal columns with 20 pixels between them?
    Wes Bos on X: 🔥 A visual guide to getting equal width columns in CSS Grid / X
    Lees meer

    10:31 Which of the following elements are fake?
    13:00 Which of the following HTML tags are deprecated?
    16:38 What is the samp element?
    17:27 Name the 7 parts of CSS Houdini
    21:07 In JavaScript for loop with 10 items, how can you exit a loop early?
    22:34 What is the difference between a pseudo element and a pseudo class?
    25:59 How could you implement CSS :has with JavaScript?
    27:56 What are two attributes that would make an SVG more accessible?
    29:43 How can you stop your process from exiting if you have an unhandled rejection?
    32:27 How do you prevent flex children from getting squished?
    34:40 In TypeScript, what does using keyof and typeof together do?
    37:19 What does ARIA stand for?
    37:39 Name 5 limitations that a serverless or edge function have over tradtional long running server?
    40:38 Write an item using Flex code, not grow to fill it’s container, or shrink, and the item will take up only the space based on it’s content size.
    42:03 If I’m building an application that needs to announce a change to the user, how would I do that?
    43:46 Name the 5 different Git elements methods on a document?
    45:39 What does the CSS prospective property do?
    48:23 Sick picks
    Sick Picks Scott: Pushpin hangers

    Wes: Niimbot Label Maker, Bearclaw Screws)
    Shameless Plugs Scott: Sentry

    Wes: Wes Bos Courses

    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  47. 703: The Observer Pattern

    11 december 2023 · 19 min

    Afspelen
    In this episode of Syntax, Wes and Scott give a high level overview of the observer pattern, what is the observer, what are downsides to too many observers, and more.
    Show Notes 00:25 Welcome
    01:42 Syntax Brought to you by Sentry
    02:16 High level overview
    Syntax 694: What’s Up With Angular with Mark Techson
    Lees meer

    Godot Engine

    03:36 What might you observe in game development?
    06:50 What is the observer?
    08:11 What are some downsides to too many observers?
    10:17 IntersectionObserver, MutationObserver, and PerformanceObserver
    12:25 ResizeObserver
    13:04 What about addEventListener?
    @BenLesh on Callbacks being faster than observables

    16:13 Signals are becoming a big thing
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  48. 702: New + Proposed JS APIs for 2024

    6 december 2023 · 56 min

    Afspelen
    In this episode of Syntax, Wes and Scott talk through new and proposed JavaScript APIs including ones related to regex, sourcemaps, structured clone, temporal, JSON modules, and more!
    Show Notes 00:10 Welcome
    01:26 Syntax Brought to you by Sentry
    02:55 RegExp Escaping Proposal
    tc39/proposal-regex-escaping: Proposal for investigating RegExp escaping for the ECMAScript standard
    Lees meer

    05:25 Intl.DurationFormat
    tc39/proposal-intl-duration-format

    07:55 Standardized Sourcemaps
    tc39/source-map-rfc: RFCs for the source map debug format.

    10:43 Structured Clone
    structuredClone() global function - Web APIs | MDN

    12:54 Temporal
    Hasty Treat - Temporal Date Objects in JavaScript

    Tracking issue for syncing with IETF standardization work (req’d before implementers can ship unflagged) · Issue #1450 · tc39/proposal-temporal

    20:59 FindLast and findLastIndex
    tc39/proposal-array-find-from-last: Proposal for Array.prototype.findLast and Array.prototype.findLastIndex.

    22:27 JSON modules
    tc39/proposal-json-modules: Proposal to import JSON files as modules

    24:46 Regex Modifiers
    RegExp Modifiers - June 2022.pptx - Microsoft PowerPoint Online

    26:50 Array Grouping
    tc39/proposal-array-grouping: A proposal to make grouping of array items easier

    30:48 Array Methods
    tc39/proposal-change-array-by-copy: Provides additional methods on Array.prototype and TypedArray.prototype to enable changes on the array by returning a new copy of it with the change.

    6 or so New Approved and Proposed JavaScript APIs

    32:12 Promise.withResolvers
    35:08 Function.prototype.memo
    tc39/proposal-function-memo: A TC39 proposal for function memoization in the JavaScript language.

    37:48 Node has a Proposed ESM Detection flag
    39:54 Node has navigator.userAgent
    41:29 Built in .env support
    42:52 Permissions model & test runner continues to be worked on
    44:06 HTML Web charts
    Proposal: Web Charts · Issue #9295 · whatwg/html

    45:39 autopause
    Add autopause attribute to media elements to allow automatic pausing of media · Issue…

  49. 701: A11y Treats - Labels & Roles

    4 december 2023 · 27 min

    Afspelen
    In this episode of Syntax, Wes and Scott explain ARIA, aria-label, Roles, and the overall importance of accessibility in your web projects.
    Show Notes 00:25 Welcome
    01:18 Syntax Brought to you by Sentry
    01:44 What is ARIA?
    WAI-ARIA Roles | MDN
    Lees meer

    An in-depth guide to ARIA roles - The A11Y Project

    02:48 What is aria-label?
    // A button with an ARIA role and label 06:36 What’s the difference between a title and aria-label on a button?
    08:34 Are you really going to get sued if your website isn’t accessible?
    11:53 What are Roles for?
    16:33 6 different types of Roles
    21:25 What is aria-labelledby?
    I agree to the Terms and Conditions. 23:13 Checking your code for accessibility
    eslint-plugin-jsx-a11y - npm

    WAVE Web Accessibility Evaluation Tools

    Polypane

    24:31 Feedback and future show ideas
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads

  50. 700: Payload is Rails for JS with TypeScript, React and Drizzle (James Mikrut)

    1 december 2023 · 55 min

    Afspelen
    In this supper club episode of Syntax, Wes and Scott talk with James Mikrut about Payload, how Payload isn’t just a CMS, where Payload fits in a tech stack, why they picked Drizzle for an ORM, what Payload Cloud is, and where’s the Rails for JavaScript?
    Show Notes 00:31 Welcome
    02:00 Who is James Mikrut and what’s the idea behind Payload?
    05:22 Payload isn’t just a CMS
    Payload
    Lees meer

    Payload on GitHub

    Payload on Twitter

    Payload on YouTube

    09:08 Where does Payload fit in the tech stack?
    KeystoneJS

    Supabase

    Retool

    11:22 Is Payload using TypeScript?
    13:44 Why did you pick Drizzle?
    Drizzle ORM

    18:08 Do you have to maintain MongoDB and Drizzle?
    SvelteKit

    26:31 Does Payload have visual editing elements?
    30:34 Do you build a custom UI for users?
    35:10 What is Payload Cloud?
    38:12 Where is the Rails for JavaScript?
    Next.js by Vercel

    Laravel Spark

    Deploy your Laravel PHP application painlessly

    RedwoodJS: The App Framework for Startups | RedwoodJS.com

    41:39 How do you manage contributions from open source?
    43:46 GitHub + AI
    48:18 Syntax Brought to you by Sentry
    Error Management Magic: Introducing the Sentry Plugin for Payload

    50:26 Supper Club questions
    Shameless Plugs Payload on GitHub
    Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
    Wes: X Instagram Tiktok LinkedIn Threads
    Scott: X Instagram Tiktok LinkedIn Threads