
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 00:00 Welcome to Syntax! 00:13 How to submit a question for future episodes. Potluck Questions. 02:46 Brought to you by Sentry.io. 03:21 Logging from a site. 08:39 Blogging in 2024. 11:49 Sharing website environmental data. Green Web Foundation. Website Carbon Calculator. Syntax Site Results. Scott’s Site Results. 17:38 Using LangChain when working with LLMs. 21:03 CSS Hyphens and Overflow-Wrap. Hyphens Browser Compatibility. Overflow-Wrap. 25:52 Similarities between WASM, JVM and .NET. 27:25 Writing unit testing and integration testing. 32:00 How can new parents stay current on web development trends? 34:47 Working globally as a freelance developer. 37:26 Scott’s audio setup. Why audio interfaces have DSP built in. ChaseBliss Pedal. 43:04 UI libraries for synth/audio plugins. 44:02 CSS module scripts. CSS Modules in CSS Module Scripts. 48:39 Sick Picks + Shameless Plugs. Sick Picks Scott: Deep Cover Podcast. Wes: Pressure Washer Surface Cleaner. Shameless Plugs Wes: Syntax.fm/videos. 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 Juni 202455min

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 00:00 Welcome to Syntax! 02:07 Brought to you by Sentry.io. 02:33 The file system API. 03:08 The Cache API. Mozilla Developer Cache API. Airhorner, a good example. 04:24 Size restrictions per browser. 07:04 How tools like Riverside.fm use IndexedDB. 08:47 Data eviction (too much data). 10:16 What we’re using it for and how. 12:17 How do we do this in code? 14:37 Creating the cache. 16:18 Retrieving from cache manually. 19:00 Adding metadata. 19:37 A live debugging. 22:39 Persistent storage. web.dev Persistent Storage. Hackernoon Persistent Storage. 26:10 Media score. Chrome Autoplay Policy. 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 Juni 202431min

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 00:00 Welcome to Syntax! 00:57 Who is Stephen Nixon? Process Type Foundry. Mark Simonson Proxima Nova. 05:42 What is a type foundry exactly? ArrowType. 09:09 Font / type making. 09:15 How do you make a font? RoboFont. Glyphs. 11:58 Fonts vs typefaces. 13:02 How many fonts have you made? 14:17 What are variable fonts and how can web developers utilize them? 19:22 Animating fonts. Variable Fonts. Recursive. 20:28 Do you code your demo sites yourself? 21:50 Are variable fonts more complex to design (and develop). Matthew Carter Adobe Fonts, Matthew Carter Wiki. Multiple Masters Variable Fonts. Just My Type. 27:03 Hand painted fonts. House industries. Golden Sign Co. Gen Ramirez. 29:39 Creating a monospace font. 32:19 Creating fonts with dyslexia accessibility in mind. 37:58 Typography for the web. 38:29 What are some 80/20 rules developers can employ to make more visually appealing typography? 40:58 Type scale calculations. Scott’s Fluid Type Calculator. 45:42 What are your biggest web type pet peeves. 48:46 Do you have any favorite type tools? Wakamifondue. Fixing Variable Font Inheritance. 50:34 Supper Club Questions. 50:44 How do you feel about ligatures in coding fonts? Ligatures In Programming Fonts Hell No. 55:11 What font do you use? Name Sans v05. Name-Mono. 56:43 What is your favorite font of all time? Typotheque. Soehne. Grillitype Typefaces. Phnotype. 58:49 Sick Picks + Shameless Plugs. Sick Picks Stephen: Children of Time, No-Recipe Recipes. Shameless Plugs Stephen: ArrowType, Skewing Fonts. 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 Juni 20241h 2min

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 00:00 Welcome to Syntax! 01:06 Brought to you by Sentry.io. 01:49 Today’s format. 02:23 Beginner vs advanced TypeScript. DHH Tweet. 09:23 Does Sveltekit replace Svelte with Astro? 13:09 Handling multiple languages. 19:52 Falling out of love with React. 25:53 Shipping private packages via NPM. npm-install. Working with the npm registry. 29:00 How do you feel about importing packages from a URL? 30:36 VueJS vs Svelte. 36:15 Leetcode type interview questions. 41:58 Learning a new language for personal growth. 46:21 Always starting, never finishing. Scott’s Fluid Type Calculator. 50:23 Code quality vs tackling tickets. 55:36 Sick Picks + Shameless Plugs. Sick Picks Scott: Quick Look Plugins. CJ: Sony WFC700n-b. 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
12 Juni 20241h 1min

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 00:00 Welcome to Syntax! 01:14 Brought to you by Sentry.io. 02:05 Why you might need a cloud storage provider. 03:07 How we use cloud storage. Dropshare. 08:16 Why you may need larger storage. 09:49 The big players in this space. Amazon S3. Cloudflare R2. Backblaze B2. Synology C2. Google Cloud Storage. Microsoft Azure. Digital Ocean Spaces. Oracle. Bunny.net. Amazon S3 Glacier. 14:34 Storage fees. 18:31 Why so cheap? 20:49 Bandwidth (egress). Cloudflare Bandwidth Alliance. 26:46 Operation fees - costs 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
10 Juni 202429min

779: Why SQLite is Taking Over with Brian Holt & Marco Bambini
Scott and CJ dive into the world of SQLite Cloud with special guests Brian Holt and Marco Bambini. They explore why SQLite is gaining traction, its unique features, and the misconceptions surrounding its use—let’s get into it! Show Notes 00:00 Welcome to Syntax! 01:20 Who is Brian Holt? 02:26 Who is Marco Bambini? 05:12 Why are people starting to talk so much about SQLite now? 08:47 What makes SQLite special or interesting? 09:46 What is a big misconception about SQLite? 11:13 Installed by default in operating systems. 12:03 A perception that SQLite is intended for single users. 13:36 Convincing developers it’s a full-featured solution. 15:11 What does SQLite do better than Postgres or MySQL? 17:30 SQLite Cloud & local first features. 20:38 Where does SQLite store the offline information? 23:08 Are you typically reaching for ORMs? 25:00 What is SQLite Cloud? 27:29 What makes for an approachable software? 29:18 What make SQLite cloud different from other hosted SQLite options? 32:13 Is SQLite still evolving? 34:40 What about branching? 37:37 What is the GA timeline? 40:04 How does SQLite actually work? 41:19 Questions about security. 44:28 But does it scale? 45:52 Sick Picks + Shameless Plugs. Sick Picks Brian: Trainer Road Marco: Tennis Shameless Plugs Brian: SQLite Cloud, Frontend Masters - Containers. 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
7 Juni 202450min

778: 11 Habits of Highly Effective Developers
Today, Scott and Wes dive into the 11 habits of effective web developers, from understanding stakeholder goals to maintaining a work-life balance. We’ll explore the importance of continuous learning, having a problem-solver mentality, and being empathetic towards coworkers and users—let’s get into it! Show Notes 00:00 Welcome to Syntax! Previous Episode: 754. 00:50 Brought to you by Sentry.io. 01:24 Denver weather is something else. 02:15 Habit #1: You understand stakeholder and business goals. 05:34 Habit #2: You’re curious and always learning. 07:43 Habit #3: You have an open mind about new technology. 11:29 Habit #4: You ask for help. 13:43 Habit #5: You help others. 16:51 Chicken drumsticks. 17:35 Habit #6: You have a “problem solver” mentality. 24:44 Hose repair. 26:02 Habit #7: You have fun with what you do. 29:56 Habit #8: You understand work-life balance. 33:18 Habit #9: You are empathetic to your co-workers and users. 37:19 Habit #10: You pay attention to detail. 41:18 Habit #11: You’re part of the community. 45:55 Sick Picks + Shameless Plugs. Sick Picks Scott: Solar Lanterns. Wes: Ninja Obstacle Course. 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
5 Juni 202450min

777: The Modern Dev CMS - Pocketbase
Today, Scott and Wes are diving into Pocketbase, a fantastic tool for web developers to quickly set up a CMS without breaking a sweat. We’ll cover everything from its Go-based architecture to its slick admin interface and how you can get started hosting it for free on Fly.io. Show Notes 00:00 Welcome to Syntax! 01:34 Brought to you by Sentry.io. 02:26 Overview of Pocketbase. 06:51 Written in Go, but no extending needed. Host for free on Fly.io. 07:37 Hooks. 08:05 Authentication + roles. 09:23 The admin experience. 11:18 Managing export collections. 13:21 Creating your own schema. 13:53 Adding indexes. 14:08 API rules. 15:01 Adding complex roles. 16:15 Full-featured admin with a great UI. 16:59 Collection API preview. 17:41 Docs with app-specific context. 18:54 Logs. 19:02 Settings. 19:42 Executable vs npm install. 20:29 Are the collections fully typed? 21:01 Some more settings. 22:56 One click Coolify install. Svelte Kit / Svelte 5 / Pocketbase Example. Svelte / Pocketbase Starter. Pocketbase Typegen. 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 Juni 202425min