Syntax - Tasty Web Development Treats
Alle afleveringen
1.049 afleveringen, van nieuw naar oud
-
849: How to Pick a JS Package
18 november 2024 · 22 min
You’ve got a project, and you need the right tool—but how do you know if that JavaScript package is the one? Scott and Wes guide you through finding and validating packages, from checking NPM to scoping out social proof, so you can pick tools you can trust.
Show Notes 00:00 Welcome to Syntax!
00:29 Brought to you by Sentry.io. Take The Pledge Lees meer01:44 How to find a JS package. 02:56 Searching via NPM.
03:28 Searching via Socket.dev.
06:02 Searching via Reddit.
06:24 Searching via Perplexity.
08:31 Searching via Google autocomplete.
09:25 Searching via Awesome repo.
09:51 Searching via social networks.
10:47 Searching via established projects.11:19 Evaluating the quality of a package. 12:02 Validating via GitHub Issues. html2canvas.
13:58 Are there types?
15:16 Validating via Socket.
16:15 Validating via Bundlephobia.
17:15 Validating via the docs.
17:55 Validating via GitHub Search.
18:14 Validating via GitHub Insights. GitHub Network Dependents.20:19 Validating via the package.json file. Syntax Episode 563.
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 -
848: Web Components Can’t Save Us with Scott Jehl
15 november 2024 · 51 min
Scott and Wes talk with Scott Jehl about the benefits, challenges, and use cases of web components, particularly in design systems and performance.
Show Notes 00:00 Welcome to Syntax!
00:55 Scott’s background and career Responsible Responsive Design Lees meerWebpagetest.org
06:46 An overview of web components
09:06 Why should people care about web components?
13:16 Should you write your own web components?
14:39 Reactivity in web components
15:56 DOM parts18:23 Styling web components
22:08 Brought to you by Sentry.io22:33 CSS custom properties Mux Player Customizer
24:28 Responsive video
28:27 The polyfill use case
30:55 Shadow DOM challenges
36:04 Web components in design systems
41:58 How are people using web components?
43:25 Web components and server-side rendering
45:00 Scott’s thoughts on build tools
47:33 Sick Picks & Shameless Plugs
Sick Picks Scott: EnhanceShameless Plugs Scott: Squarespace is hiring
Web Components Demystified - Get 30% off with coupon code “syntax”
Web Components Community GroupHit 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 -
847: Syntax Holiday Gift Guide
13 november 2024 · 1 uur 4 min
Scott and Wes are back with their annual Syntax Holiday Gift Guide! They’ve curated the best gadgets, tools, games, and even kitchen essentials for the dev in your life — plus a few treats anyone would love to unwrap.
Show Notes 00:00 Welcome to Syntax!
00:46 Brought to you by Sentry.io. Open Source Pledge Members. Lees meer01:59 Syntax holiday gift guide.
02:25 Our absolute favorites. Leatherman Arc.
Peak Design Everyday.
1.5 KG of Maldon, Salt Cellars.
Anker Cube.
Anker MagGo.
Theragun, Off-Brand Massage Gun.
Subscription to Cursor, Claude, ChatGPT.
Syntax Swag.13:33 Our (Scott’s) top games. Factorio.
Cascadia.
Azul.
SteamDeck.19:01 Gifts under $30. Braided USB-C Cables
Right Angle Thunderbolt.
Battery Daddy.
MagSafe Popsocket.
Hempz Apple Cider + Nutmeg Hand Lotion.
Mens Cremo Body Wash.27:50 Clothing gifts. Uniqlo Stretch Selvedge Denim.
Naked and Famous Selvedge Denim.
Scott DU/ER Jeans.
Wool Toque
Anything from Huckberry.35:02 Desk item gifts. MX3s Master Mouse
Target Candles
Candle Melter Wax.
Laptop Stand Rain Design mStand.
Any Foldable Amazon StandDesk Treadmill.
Insta360 Link 2.
Small Rig Rotatable Collar Mount.
Thermal Printer.
Cable Management Straps + Clips
Mini Tripod.
Super Clamp.
Fishskyn.45:02 Kids gifts. Yoto Player.
Toniebox.
First Cat in Space.
Bathbombs.
Kahn Academy Kids App.
Codespark.51:11 Kitchen gifts. Carbon Steel Frying Pan.
Viral Egg Cooker.
Glass Straws.
Danish Whisk.
Oxo Salt + Pepper Grinders.
Paper Wheels.
Whetstone.
WÜSTHOF Nakiri Knife.
Carbon Knife Co.
Can Tumbler Glasses.
Squirrel Rice Paddle.
OTOTO Splatypus Jar Spatula.59:02 Eatables. Hot Sauce: Truff Hot Sauce.
Secret Aardvark.
Cholula Gift Pack.
Laoganma Chili Crisp.
Merfs.Bachan’s Japanese BBQ Sauce.
01:00:51 Smart home gifts. Smart Dimmers
ESP32 + WS2815 LED Strips01:03:06 Shameless Plugs.
Shameless Plugs Scott: Syntax on YouTubeHit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
Wes: X Instagram Tiktok LinkedIn Threads
Scott: X Instagram Ti… -
846: Talking EVs: Range Anxiety, Charging, and Tech
11 november 2024 · 44 min
Scott and Wes unpack their experiences as electric car owners, sharing the highs and lows of making the switch. From range anxiety to charging infrastructure and cost savings, they talk about everything from the tech perks to the unexpected challenges of driving electric.
Show Notes 00:00 Welcome to Syntax!
02:11 Brought to you by Sentry.io.
03:14 What cars and how long have we had them. Hyundai IONIQ 5.
Tesla Model Y Long Range. Lees meer10:41 Range and dealing with range anxiety.
11:45 The EPA specs.
12:24 Things that affect range.
14:46 Charging.
17:52 Charging levels. 17:56 Level 1 charging.
19:01 Level 2 charging.
19:39 Level 3 charging.
20:10 Charging standards.21:51 Electric car pricing.
25:56 Regenerative braking.
27:27 General maintenance.
29:04 Pricing and expenses.
31:48 Machine Gun Kelly Effect.
36:46 Would you go completely electric?
38:46 Electric-only tech.
40:57 Buying a new EV.
42:21 Edison Motors website, TikTok.
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 -
845: Are companies hiring? State of the dev job market with Taylor Desseyn
8 november 2024 · 57 min
Scott and Wes talk with Taylor Desseyn about the shifting developer job market. Taylor shares practical tips for standing out, building genuine connections, and finding opportunities in a competitive hiring landscape.
Show Notes 00:00 Welcome to Syntax!
01:38 Meet Taylor Desseyn
03:51 Is the dev job market as bad as it seems?
06:47 How to stand out when applying for a dev job?
11:03 Who is getting hired?
14:16 What tech/languages are companies hiring for right now?
16:37 Is there less work?
20:10 The small things that get you hired
24:19 What to do when you get laid off
27:42 Brought to you by Sentry.io Lees meer28:07 How to make yourself more appealing to employers
32:39 Networking tips and tricks
39:01 Remote work and office return trends
40:58 Why you should negotiate carefully
43:38 What’s the most important thing right now for getting hired?
45:48 Should devs understand stakeholders and business goals?
46:42 Creating a good resume
52:00 Sick Picks & Shameless Plugs
Sick Picks Taylor: heydey micRandy Rektor’s YouTube Channel
Shameless Plugs Taylor: Torc
Guidance Counselor 2.0
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 -
844: TypeScript, Branded Types, Streaming vs Polling + More
6 november 2024 · 56 min
Scott and Wes serve up listener questions on everything from SvelteKit’s limits and the quirks of branded types in TypeScript to handling email queues and secure token storage in cookies. Plus, they get into app security, the evolution of checkout flows, and why QA teams can actually be game-changers for dev teams.
Show Notes 00:00 Welcome to Syntax!
00:50 Catching up.
01:52 Brought to you by Sentry.io.
02:56 What are the limitations of SvelteKit?
06:41 Svelte 5 updates.
07:53 Branded types in TypeScript. EggHead.io Blog. Lees meer11:56 Queue applications and a ‘poor man’s queue’.
17:20 The real value of a functional QA team.
21:34 Invoker commands. Invokers Explained.
Denver Script Talk.26:29 Growing security and permissions concerns. Little Snitch.
33:03 Stripe vs PayPal in 2024.
38:24 Christmas gift guide.
38:39 Websockets vs streams vs polling.
41:04 Storing access and refresh tokens in a cookie.
45:41 Shipping with TypeScript errors.
49:34 Sick Picks + Shameless Plugs.
Sick Picks Scott: The Black Stuff Deodorant.
Wes: Apple Watch Charging Brick.
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 -
843: Copilot Kills Cursor? Reacting to Github Universe Keynote
4 november 2024 · 55 min
Scott and Wes react to the big GitHub Universe announcements, recorded live at GitHub Universe. They dive into Copilot’s new features, exploring how its advancements stack up against Cursor AI in the battle for the ultimate AI-driven developer tool.
Show Notes 00:00 Welcome to Syntax!
01:12 Our Syntax Meetup.
02:54 AI is everywhere.
03:22 Sherlocking and jockeying for position.
04:49 GitHub Copilot introduces alternative LLMs. GitHub Copilot Lees meer06:31 New tools are build upon existing LLMs.
09:14 VSCode reclaiming ground from Cursor. Cursor10:31 The new features. 10:34 Multi-file editing.
10:54 Use-cases for multi-file editing.
12:58 Multi-model selection.
13:05 Repo indexing.
13:50 Copilot instructions.
14:34 Examples of Cursor rules.
16:39 No mention of multiple-line suggestions.
18:02 Multi-file edit?
20:26 Code review.
22:36 GitHub Pull Requests plugin.
24:34 Investing in AI ‘big bets’.
26:29 Scott’s mysterious YouTube unreleased feature.
27:11 3-minute YouTube shorts. Wes’ TikTok.28:29 GitHub Marketplace.
32:18 Copilot Workspace.
34:53 Copilot Workspace features yet to come.
36:25 GitHub Spark. Bolt.new.42:44 Final thoughts on Copilot vs Cursor.
44:03 What products do you think are in trouble?
50:26 Sick Picks & Shameless Plugs.
Sick Picks Scott: Waymo.
Wes: Waymo.
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 -
842: There's Python in my JavaScript! with Andrea Giammarchi
1 november 2024 · 54 min
Scott and Wes talk with Andrea Giammarchi (aka WebReflection) about his projects, including LinkDOM and PyScript, and the exciting future of running Python in the browser via WebAssembly.
Show Notes 00:00 Welcome to Syntax!
01:04 Andrea’s background and early work LinkDOM Lees meer07:25 Brought to you by Sentry.io
09:56 Pyscript
14:31 Why run Python in the browser?
20:17 Using WebAssembly to run different languages in JS
23:33 The advantages of WebAssembly
25:55 What excites Andrea about WASM Proposal: ESX as core JS feature31:10 What is WASI?
32:21 Andrea’s experience with IOT and microcontrollers
35:35 How can the JS ecosystem be improved?
38:07 Should we have reactivity in the browser? Signals41:06 Andrea’s thoughts on server-side APIs
43:43 Andrea’s thoughts on TypeScript49:13 Sick Picks & Shameless Plugs
Sick Picks Andrea: ESP32Shameless Plugs Andrea: Andrea’s X / Twitter
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 -
841: Spooky Web Dev Horror Stories - PART 2
30 oktober 2024 · 58 min
Scott and Wes continue to share hair-raising developer horror stories submitted by listeners. From accidentally severing access to crucial databases to a limitless coupon code that cost millions, these tales will have you on the edge of your seat. Tune in for more wild mishaps, close calls, and hard-learned lessons from the dark side of coding. You won’t want to miss this second round of spooky web dev stories!
Show Notes 00:00 Welcome to Syntax!
00:49 Brought to you by Sentry.io.
01:32 ‘Monkey Business’
03:21 ‘Spooky Integration Bug’
06:25 ‘Worst Case Wake Up’
08:57 ‘Severed Trunk and Missing Backups’
11:21 ‘Brute Force Too Brutal’
12:30 ‘A Dorm Room Bee Movie’
15:46 ‘No Goats’
16:45 ‘Pokémon Problems’
18:08 ‘Late Night’
22:21 ‘Bootcamp Bungle’
26:19 ‘Film School F*** Up’
30:26 ‘AWS Clusterf***’
31:26 ‘Limitless Coupon Disaster’ Episode #451, Episode #609. Lees meer33:55 ‘Ruined Vacation’
35:47 ‘Console.swear’
37:28 ‘Another Coupon Disaster’
40:46 ‘The Doctor’ Wes’ Burner List.43:01 ‘Marketing Nightmare’
45:10 What did we learn this year? 45:12 You need processes.
48:42 Ask for help.
49:44 Dry-run queries + soft delete.
51:14 Code reviews. Episode #830.52:11 Version control.
53:58 Sick Picks + Shameless Plugs.
Sick Picks Scott: Nobody Wants This.
Wes: Truffle Hot Sauce.
Shameless Plugs Scott: syntax.fm.
Wes: syntax.fm/spooky.
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 -
840: Spooky Web Dev Horror Stories - PART 1
28 oktober 2024 · 17 min
Scott and Wes unpack the spookiest web dev stories submitted by listeners in this episode. From forgotten MX records to infinite loops, these real-life coding horrors will have you double-checking your WHERE clauses and git backups.
Show Notes 00:00 Welcome to Syntax!
00:39 Brought to you by Sentry.io.
00:48 What is Spooky Stories? Submit a story. Lees meer02:45 ‘Needs a Coffee’
04:43 ‘Deleting Github’ Defunkt X Post.07:42 ‘Rejected’
09:08 ‘Infinite Loop’
09:26 ‘MySqueeel Horror’
11:02 ‘Pet Company’
12:09 ‘Git Corrupted’
12:57 ‘Circular Horror’
14:25 ‘The Haunting of the Forgotten MX Records’
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 -
839: Prisma ORM: Local First, Typed SQL Queries and Serverless with Søren Bramer Schmidt
25 oktober 2024 · 55 min
Scott and Wes talk with Søren Bramer Schmidt, Founder and CEO of Prisma, about database best practices, including the latest developments in serverless, local-first, and typed SQL solutions.
Show Notes 00:00 Welcome to Syntax!
02:55 Søren’s thoughts on GraphQL
03:53 Brought to you by Sentry.io Lees meer06:57 Common database mistakes
08:52 Prisma’s stability and user experience
10:42 Typed SQL and advanced querying Announcing TypedSQL: Make your raw SQL queries type-safe with Prisma ORMPrisma Optimize
20:47 Serverless challenges and solutions Prisma Accelerate
27:11 Cloudflare’s potential to dethrone AWS
29:13 Prisma and local-first development Prisma & Expo: A Better Path to Local-First Apps | App.js Conf 202435:30 Making local-first development mainstream
40:10 Challenges with async
42:43 Søren’s thoughts on Drizzle43:41 Søren’s favorite database
47:21 The read your writes problem
48:58 Prisma hosted Postgres
51:44 Sick Picks & Shameless Plugs
Sick Picks Søren: CursorShameless Plugs Søren: 1: Prisma Optimize
2: Prisma Postgres (coming soon)
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 -
838: Productivity Tools for Web Developers
23 oktober 2024 · 54 min
Get your productivity game on point! Scott and Wes serve up the best tools for web developers, covering everything from password managers and to-do apps to mind-mapping tools and little scripts that make life easier. Plus, find out what snippet managers they swear by and how they keep their email under control.
Show Notes 00:00 Welcome to Syntax!
03:01 Brought to you by Sentry.io.
03:44 Syntax meetup San Francisco.
04:26 Breakdancing update. Kid Cruz Instagram. Lees meer05:18 Password management. 1Password.
08:30 Apple stomping on apps.
09:50 To-do applications. Things.
Getting Things Done.
Tweek.18:18 To-do in code. Todo Tree.
Better Comments.20:21 Snippets.
25:55 Mind-mapping. MindNode.
FigJam.29:01 Note-taking. Obsidian.
Stashpad.
ObservableHQ.
Jupyter.36:34 Little scripts. Script Kit.
39:50 Email. Superhuman.
48:11 Some honorable mentions. Habitpath.io.
Focus.52:10 Sick Picks + Shameless Plugs.
Sick Picks Scott: The Legend of SwordQuest.
Wes: The Economics of Everyday Things.
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 -
837: You Should Drop Express and Try Hono
21 oktober 2024 · 30 min
CJ joins Scott and Wes to dive into why he’s all-in on Hono, a fast and lightweight web framework for every JavaScript runtime. From familiar route creation to type-safe middleware, find out how Hono keeps things simple, powerful, and ready to use inside Next.js.
Show Notes 00:00 Welcome to Syntax!
00:46 Brought to you by Sentry.io.
01:11 What is Hono? Watch CJ’s Video Here Lees meer03:21 Syntax Meetup San Francisco.
04:02 Why I like Hono, and why you should try it.
04:08 Familiar route creation. Connect: an extensible HTTP server framework for node.05:45 Supports every JS Runtime.
07:00 How a service worker works.
08:48 Helpers.
09:16 Middleware.
10:40 Sentry middleware.
10:55 JSX support.
13:21 Organizing route handlers while keeping Types.
14:24 Type safety. hono-open-api-starter.
zod-openapi.15:46 Defining base type. Pinojs
17:36 Validation.
18:52 Hono RPC client.
22:09 Hono inside of Next.js.
23:30 Testing.
25:22 The community.
27:34 Type support.
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 -
836: Real Talk on Web Accessibility with Marcy Sutton Todd
18 oktober 2024 · 1 uur 6 min
-
835: How to Pick a JavaScript Framework
16 oktober 2024 · 59 min
Do you really need a framework? Scott and Wes bring on CJ to break down when frameworks like Vue, Svelte, and Astro are worth it—and when they might just add complexity. They dive into everything from rendering strategies to auth solutions, deployment options, and how to choose the right tool for the job.
Show Notes 00:00 Welcome to Syntax!
01:32 Brought to you by Sentry.io.
03:17 What is a framework? Syntax Meetup San Francisco. Lees meer08:21 Examples of frameworks for Vue, Svelte and Angular.
12:39 What questions do you need to answer?
12:44 What or where do you need to ship?
14:12 How do you render it?
18:22 Where are you deploying it?
24:03 How do you store data?
24:09 Existing API.
26:03 Integrated server.
26:22 Database. Supabase.26:59 Does it have RPC or server actions?
34:27 Do you need authentication?
38:45 Auth packages. LuciaJS.
Lucia announcement.
Lucia preview.
NPM Arctic Oauth.
Auth utilities.
Better-Auth.
Scott’s Drop-In Auth.42:10 Does it include email?
42:52 What does the TypeScript story look like?
43:32 How does it handle images?
44:35 How do we work with CSS?
46:02 How long has it been around?
47:37 How mature is the ecosystem?
48:35 Is there community support?
50:21 Portability.
51:18 Hiring.
52:17 Sick Pick + Shameless Plugs.
Sick Picks CJ: Infinite Health.
Scott: USB A to C adapters.
Wes: Citric Acid.
Shameless Plugs Scott: Syntax on YouTubeHit 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 -
834: AI Will Improve Your Web Development Workflow
14 oktober 2024 · 27 min
Scott and Wes serve up ways developers can use AI tools like Claude, GitHub Copilot, and more to boost productivity. From error tracing to refactoring code and automating mundane tasks, they break down how AI can handle the heavy lifting so you can focus on the fun stuff!
Show Notes 00:00 Welcome to Syntax!
01:23 Brought to you by Sentry.io.
01:43 Using AI tools effectively.
05:29 Stack trace reading and error finding.
08:37 San Francisco Syntax Meetup!
09:19 Research and validation.
12:19 Completing mundane tasks.
14:10 Refactoring.
18:56 Simple typescript.
20:29 Summarizing docs and source code.
23:56 Quick hits.
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 -
833: Next Gen Fullstack React with TanStack
11 oktober 2024 · 1 uur 3 min
Scott and Wes talk with Tanner Linsley, creator of TanStack, about the React ecosystem, and the evolution and futue of TanStack’s suite of tools, including TanStack Router and TanStack Start.
Show Notes 00:00 Welcome to Syntax!
02:59 What is TanStack Start? UnJS Lees meerNitro
Vinxi
06:17 What is the Vite Environment API?
07:21 Was it always the plan to use Vite?
08:02 TanStack Router and client-side vs server-side
16:18 How TanStack Start will work
27:26 Moving from Create React App to TanStack
30:42 Brought to you by Sentry.io31:15 Will TanStack Router ever support other frameworks?
33:54 How will TanStack Start handle forms?
36:13 TanStack Virtual39:41 What is the future of TanStack? Convex
42:49 How Tanner writes documentation
47:55 Server functions and middleware
54:41 When will TanStack Start be in beta?
57:00 Sick Picks + Shameless Plugs
Sick Picks Tanner: LG C4Ultra Slim Fit TV Wall Mount
Shameless Plugs Tanner: TanStack Blog
@TKDodo
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 -
832: Potluck: When to Use a Framework × Goodbye Webpack × Custom Events in React + More!
9 oktober 2024 · 1 uur 3 min
Scott and Wes answer your burning questions! They cover everything from moving off create-react-app and the benefits of Next.js, to transitioning from junior to senior dev, working with QA teams, and even dive into game development with Godot.
Show Notes 00:00 Welcome to Syntax!
00:31 DenverScript.
03:14 Brought to you by Sentry.io.
03:54 Question 1: Moving off create-react-app. Proposal: TC39 Import Attributes.
HTML iframe srcdoc Attribute. Lees meer09:10 Question 2: Working together with QA teams.
13:46 Question 3: Benefits of React with Next.js Framework. Svelte Turnstile.
Next.js Pages Router vs Next.js App Router.17:38 Question 4: What are your real names?
19:22 Question 5: Thoughts on RTO and WFH.
27:50 Question 6: Where can I find you Sick Picks? Sick Picks.
Sick Picks Scraper.29:34 Question 7: From JR developer to SR developer.
31:41 Question 8: Godot and game development. Godot Engine.
GDScript.
Phind.39:37 Question 9: Inherent advantage between Callbacks and Events.
44:44 Question 10: Transitioning to freelance with corporate experience.
49:44 Question 11: Dealing with negative feedback.
57:05 Sick Picks & Shameless Plugs.
Sick Picks Scott: audiobookshelf, Plappa App.
Wes: New Syntax Swag.
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 -
831: Preventing Spam and Fraud
7 oktober 2024 · 27 min
From CAPTCHAs to shadow banning, Scott and Wes break down the best strategies for keeping your app safe from spam and fraud. They cover tools like email verification, rate limiting, shadow banning, and more to protect your users and data.
Show Notes 00:00 Welcome to Syntax!
00:15 The problem.
02:47 Brought to you by Sentry.io.
04:23 CAPTCHA.
06:24 Data collection.
07:11 Stripe Radar score calculation.
09:12 Rate limiting.
11:34 Shadow banning.
13:53 Email verification.
15:38 Tie to accounts.
16:23 Tied to real identity.
19:36 Manual approval.
21:19 Blocking ASN.
23:17 Honey pot field.
24:28 SMS verification.
25:05 Mechanical Turk.
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 -
830: GitHub and Code Reviews with Sarah Vessels
4 oktober 2024 · 51 min
Scott and Wes talk with GitHub’s Sarah Vessels about the ins and outs of code reviews, their critical role in collaborative development, and tips for making your reviews more effective.
Show Notes 00:00 Welcome to Syntax!
00:59 What is a code review? How to review code effectively: A GitHub staff engineer’s philosophy Lees meer04:18 Strategies for an effective code review processes
06:59 Should you test and fix in the same pull request?
07:57 How to ask for code reviews
12:12 Feature flags and their role in code management flipperscientist
scientist - JS
20:03 Who should do code reviews?
23:34 Should you review your own code?
25:04 Brought to you by Sentry.io25:29 Code comments vs pull requests
27:35 Dealing with egos in the code review process
30:18 What automations are essential? project-pull-mover34:35 Underutilized tools GitHub Protips: Tips, tricks, hacks, and secrets from Sarah Vessels
36:25 Commit strategies and squash
39:30 GitHub’s branching system
41:14 Git gone wrong
42:30 What is the correct way to merge into main?
43:47 What was it like working on GitHub Sponsors? GitHub Sponsorsthanks.dev
46:58 Sick Picks & Shameless Plugs
Sick Picks Sarah: https://store.steampowered.com/steamdeckShameless Plugs Sarah: https://github.com/sponsors
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 -
829: 14 Web Development Tips I Wish I Knew Sooner
2 oktober 2024 · 51 min
Scott and Wes share 14 game-changing tips they wish they’d known earlier in their web dev careers. From embracing tools to learning by doing, these insights will help you level up your skills faster!
Show Notes 00:00 Welcome to Syntax!
02:09 Brought to you by Sentry.io.
03:45 13 Web Development Tips I Wish I Knew Sooner.
03:49 Number 1 - No one is all-knowing.
05:39 Number 2 - People with extremely strong opinions.
11:13 Number 3 - Using tools to help you isn’t a bad thing.
12:34 Number 4 - Approach new technology with a mixed dose of skepticism and open-mindedness.
16:05 Number 5 - Things make more sense the more you actually use them.
18:40 Number 6 - Willingness to change your mind is a strong skill.
20:06 Number 7 - Doing is better than reading or watching.
22:29 Number 8 - Asking questions is good.
26:45 Number 9 - Everyone doesn’t learn the same.
30:41 Number 10 - You don’t need a SAAS for everything.
35:53 Number 11 - You don’t need to worry about scale.
37:49 Number 12 - Learning the fundamentals will always pay off.
40:07 Number 13 - Working in public will make you more hireable.
42:48 Number 14 - You can interview without accepting a job offer.
45:29 Sick Picks & Shameless Plugs.
Sick Picks Scott: Glasses.
Wes: Oxo Whisk, Danish Whisk.
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 Lees meer -
828: Logging in Verification: Magic Links, 2FA, SMS Codes
30 september 2024 · 15 min
Scott and Wes serve up the pros and cons of modern authentication methods like magic links, 2FA, and SMS codes. Learn how each technique works, the security trade-offs, and what might be the best approach for your apps.
Show Notes 00:00 Welcome to Syntax!
00:11 Brought to you by Sentry.io.
00:34 Logging in Verification.
01:09 Magic Links. 01:24 Pros of magic links.
03:50 How magic links work.
04:25 Cons to magic links. Lees meer06:21 Magic Sessions. 06:37 Using email verification.
07:12 Using code verification.
07:55 Previously trusted device verification.
08:14 Classic email and verification process.
09:54 Email Code.10:51 Gmail verification options.
12:01 OAuth.
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 -
827: Career Development with Topher Martini
27 september 2024 · 56 min
Scott and Wes talk with Topher Martini, a former Engineering Program Manager at Apple, about his extensive experience over two decades in the tech industry. Topher shares his journey at Apple, from starting as an intern in 2001 to working on groundbreaking products like iPhone, iPad, and Vision Pro.
Show Notes 00:00 Welcome to Syntax!
00:40 What it was like working on the first iPhone
04:47 How Topher landed at Apple early in his career
08:40 How Apple’s culture has changed over time
11:03 What makes a great employee?
16:37 Tips for better communication
17:54 Are meetings a good means of communication?
20:05 What makes a bad employee?
22:21 What does it take to get hired at a company like Apple?
26:16 Brought to you by Sentry.io Lees meer26:55 The relationship between passion and career
29:08 Topher’s advice for growing in your career
31:50 What is a sabbatical?
33:36 Teaching tech to kids
35:49 Topher’s work on self-driving cars Aurora39:33 AI’s impact on tech and the future
41:22 What can developers do to stand out and be relevant in a world of AI?
43:30 Topher’s thoughts on career development One Small Step Can Change Your Life: The Kaizen WayPaul Copplestone
44:47 What is a light field camera?
46:47 Spatial media and Vision Pro
48:10 The nifty stuff in Topher’s background
49:53 Something wild that happened while Topher was at Apple
51:34 Sick Picks & Shameless Plugs
Sick Picks Topher: Bambu Lab P1S 3D PrinterBento 3D
Shameless Plugs Topher: Topher’s YouTube Channel
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 -
826: You Need These 30 Apps - PART 2
25 september 2024 · 56 min
In part 2 of covering the best apps for web developers, Scott and Wes dive into must-have tools that will level up your workflow. From screenshot utilities to development tools and video production apps, this episode is packed with recommendations to boost your productivity and creativity.
Show Notes 00:00 Welcome to Syntax!
01:44 Brought to you by Sentry.io.
02:30 Utilities. 02:48 BetterTouchTool.
09:31 Hyperkey.
11:46 Amethyst.
12:51 Klack.
13:47 Bottom (Btm).
14:54 Pearcleaner Lees meer16:40 App Cleaner.
17:35 Rocket Emoji.
20:27 Clippy.23:37 Screenshots and Screen Recordings. 24:05 Dropshare.
25:29 OBS with Source Record.
29:20 Screen Studio.
30:58 Detail.co.
31:22 Cap.
32:08 Kap.
32:46 CleanShot X34:15 Video and Production. 34:24 DaVinci Resolve.
37:46 Affinity Pro.
39:42 PrincipleForMac.
40:39 Inkscape.41:34 Development tools. 41:38 DBngin.
43:12 TablePlus.
45:48 MongoDB Compass.
46:14 Proxyman.
47:00 Wireshark.
47:31 Polypane.
48:30 Setapp.
49:44 SVG Grabber.51:42 Sick Picks & Shameless Plugs.
Sick Picks Scott: Untold Sign Stealer.
Wes: Magentiles Marble Run.
Shameless Plugs Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads
Wes: X Instagram Tiktok LinkedIn Threads
Scott: X Instagram Tiktok LinkedIn Threads
Randy: X Instagram YouTube Threads -
825: Syntax Assistant Desktop App
23 september 2024 · 29 min
Scott walks Wes through the new Syntax Production Assistant Desktop App, designed to streamline and automate their complex publishing process. From tech stack choices like Svelte5 and Rust to AI-driven features, they dive into how this tool keeps everything consistent.
Show Notes 00:00 Welcome to Syntax!
00:44 Brought to you by Sentry.io.
01:37 What was the idea?
05:42 The tech. Svelte5, Tauri, Rust, FFMPEG. Lees meer08:32 Markdown editor. ink-mde, Dillinger.
09:32 Epoch timestamps. Epoch.vercel.
10:01 Updating front-matter.
10:10 Dexie.js function.
11:25 Backing up data.
11:58 Rust functions.
12:58 Why a desktop app and not a website?
14:38 Some small AI features.
16:26 Challenges with OAuth.
20:03 Publishing challenges.
23:29 Could this work on Windows?
23:54 Debugging.
26:23 Deciphering Apple logs.
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 -
824: Taylor Otwell's opinions on PHP, React, Laravel and Lamborghini Memes
20 september 2024 · 51 min
In this episode of Syntax, Wes and Scott talk with Taylor Otwell, the creator of Laravel. Taylor shares insights on his journey from creating Laravel in his free time to building a strong community and user base. He discusses Laravel’s growth, including the major features and tools that were developed over the years. Taylor also shares his outlook on the PHP ecosystem, productivity tips, and plans for Laravel Cloud, a new deployment platform for PHP and Laravel applications.
Show Notes 00:00 Welcome to Syntax!
00:29 Laracon Lees meer03:13 Laravel’s inspiration and features Intertia
Livewire
07:18 Why don’t we have a “Laravel for JavaScript”?
09:02 What parts of Laravel came first?
10:07 The Laravel ecosystem ForgeVapor
12:29 Laravel Cloud
14:00 What parts of Laravel are Intertia and what parts are React?
15:57 How many people are using Laravel?
16:59 Taylor’s productivity and development philosophy
24:43 Brought to you by Sentry.io25:19 What makes a beautiful API?
29:33 Taylor’s thoughts on typing PHP
30:41 Features Taylor would like to see in PHP
33:03 What people get wrong about modern PHP
34:22 PHP stacks and CMSs NginxFrankenPHP
Statamic
37:30 Taylor’s thoughts on WordPress
38:14 Lambo memes
43:44 Taylor’s coding setup Sublime TextVs Code
45:36 Sick Picks + Shameless Plugs
Sick Picks Taylor: Tiny GladeNo Man’s Sky
Shameless Plugs Taylor: Laravel Cloud
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 -
823: Is Cursor AI the VS Code Killer?
18 september 2024 · 51 min
Scott and Wes serve up a discussion on AI coding assistants with a deep look at Cursor AI, exploring its unique features like multi-line auto-complete and Smart Rewrites. They also discuss why Cursor’s intuitive UI stands out and tackle the big question: is it worth the investment?
Show Notes 00:00 Welcome to Syntax!
01:16 Brought to you by Sentry.io.
01:48 Handling objections around AI assistants.
02:55 Context windows and how they’re improving functionality. Syntax.fm Episode 728 with Kevin Hou of Codeium Lees meer04:08 Cursor’s UI.
04:51 This is cool, why is it not a plugin?
08:12 What makes the UI interesting.
09:13 Smart Rewrites.
11:44 It can create multiple files.
13:05 Using the chat interface.
16:32 Another chat example.
20:22 The main features of Cursor.
21:55 Multi-line auto-complete.
23:55 Using docs for additional context.
27:26 AI is here to help you, not replace you.
33:27 Is it worth it?
33:55 The pricing.
44:10 Sick Picks & Shameless Plugs.
Sick Picks Scott: The Iron Historian, Scott’s Salt & Pepper Mills.
Wes: Oxo Salt & Pepper Mills.
Shameless Plugs Scott: Syntax.fm Zed Theme.
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 -
822: Receipt Printer with JavaScript
16 september 2024 · 20 min
Wes unveils his Hack-Week project —a thermal printer controlled by JavaScript that prints out Sentry.io errors in real-time. Scott and Wes dive into the nitty-gritty of how it works, from the ESC/POS protocol to tackling socket issues, and whether the project was worth the effort.
Show Notes 00:00 Welcome to Syntax!
00:38 Brought to you by Sentry.io.
01:10 What is Hack Week?
01:41 The project. Follow the posts on X. Lees meer02:40 Why a receipt printer?
03:55 How do these printers work? ESC/POS.05:20 Communicating with the printer.
07:24 ESC/POS Encoder.
ESC/POS Encoder.
08:42 Socket issues.
09:56 Using Transformers.js to stop ‘toxic comments’. Xenova’s toxic-bert.
Implementation in Wes’ code.10:48 Back to socket issues.
12:18 Integrating with Sentry.
15:01 Printing images with Playwright.
16:17 Was it worth it?
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 -
821: Is Tauri the Electron Killer?
13 september 2024 · 55 min
In this episode of Syntax, Wes and Scott talk with Daniel Thompson-Yvetot about Tauri. They dive into what Tauri is, the motivations behind its development, its open-source ecosystem, use cases, and more.
Show Notes 00:00 Welcome to Syntax!
02:01 What is Tauri?
02:59 What’s new in Tauri 2.0?
06:41 The benefits of Tauri over Electron Lees meer11:28 Can you use Node?
14:21 Mac, Linux, and Windows VersoServo
25:05 How does Tauri make money? CrabNebula
30:05 Brought to you by Sentry.io
30:30 Accessing Swift from JavaScript
31:44 What’s the hardest part of a project like this? Haptics Plugin37:00 Some of the apps that have shipped with Tauri Cody
GitButler
Tauri Discord
Awesome Tauri
43:18 The future of Tauri
50:23 Sick Picks & Shameless Plugs
Links RustlingsCassidy Williams
Sick Picks Daniel: 5secondfilms
Shameless Plugs Guest: Manufacturing European Software (Coming Soon)
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 -
820: Potluck: 8000 ESLint Errors × HTML Time Tag × 7 Meg React Bundle × CSS Modules
11 september 2024 · 56 min
In this Potluck episode of Syntax, Scott and Wes answer your questions, from weighing the trade-offs between numerous small npm packages and a few larger ones to managing the challenges of work-from-home life. They also explore CSS modules, strategies for shrinking JavaScript bundles, and even where to find the best replacement ear cups for your headphones.
Show Notes 00:00 Welcome to Syntax!
00:38 Commentating basketball.
01:16 Brought to you by Sentry.io.
02:09 The video podcast doesn’t translate well to audio.
04:08 Many small npm packages vs a few large.
09:55 Developers dealing with WFH, ADHD, and kids.
15:59 CSS modules for scoping styles to components.
20:55 Scoped CSS in React?
23:21 Reducing JS bundle sizes. Bundle Phobia.
Javascript Bundle Analysis [Beta]. Lees meer29:44 Balancing learning, doing, and teaching.
33:04 Making maps local first.
36:20 How to pronounce ‘schema’. Wes Bos Tweet.37:09 HTML tag.
40:11 Where to get replacement ear cups for headphones? wickedcussions.
Scott’s Audeze Headphones.42:21 ESLint and hiding errors.
48:48 Sick Picks & Shameless Plugs.
Sick Picks Scott: Allen Wrench Set.
Wes: Clarkson’s Farm – Amazon Prime.
Shameless Plugs Wes: Syntax.fm, YouTubeHit 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 -
819: Fun & Profitable Side Projects for Developers
9 september 2024 · 28 min
Scott and Wes serve up a hasty discussion on side projects, sharing their latest Hack Week experiments and tips on how to turn fun ideas into profitable ventures. They cover everything from finding inspiration to choosing the right tech, and even offer advice on how to finish what you start.
Show Notes 00:00 Welcome to Syntax!
01:11 Brought to you by Sentry.io.
01:27 Wes’ Hack Week project.
02:30 Scott’s Hack Week project.
04:18 Where do you get ideas for side projects?
09:22 End goals for a side project.
14:47 Other end goals.
16:45 What tech should you use? drop-in. Lees meer20:34 Keeping notes.
23:14 Finishing side projects.
26:39 Shameless Plugisode!
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 -
818: CJ × Hosting Meetups - Lunch and Learn
6 september 2024 · 51 min
In this episode of Syntax, Wes and Scott talk with CJ Reynolds about the resurgence of meetups in a post-COVID world. They discuss the benefits of attending and speaking at meetups, and the logistics of organizing them. CJ also shares his experiences running the DenverScript meetup, including sourcing speakers, finding venues, and ensuring a welcoming community.
Show Notes 00:00 Welcome to Syntax!
01:35 Brought to you by Sentry.io Lees meer01:49 CJ’s history hosting meetups DenverScript
Code Talent
06:35 How do you structure a meetup?
09:50 How do you raise awareness for a meetup and get people to attend? Meetup.comGuild
13:27 How to pay for a meetup
15:22 How to get speakers at meetups
16:50 The length of these talks
17:03 Does live-streaming hurt attendance? Syntax 806 - The King of Drag and Drop: Alex Reardon19:32 Is there a vetting process for finding speakers? Syntax 019 - How to Get Into Speaking at Conferences
24:26 A meetup doesn’t have to be talks Develop Happy Hour
27:48 What’s the worst part about hosting a meetup?
29:37 What was your first meetup like?
33:27 What’s the best meetup you’ve been to and why?
37:10 How to be a good attendee
40:45 Are meetups back?
44:00 Tips for organizing a great meetup
45:29 How to find a meetup
47:37 Sick Picks & Shameless Plugs
Sick Picks CJ: Fillo’s Walking TamalesShameless Plugs CJ: DenverScript
You Should Use Hono in your Next Project
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 -
817: You Need These 30 Apps - PART 1
4 september 2024 · 57 min
Scott and Wes kick off part 1 of a 2-part series, breaking down 30 must-have apps for web developers and productivity enthusiasts. From file management tools to media utilities, they cover everything you need to supercharge your workflow.
Show Notes 00:00 Welcome to Syntax!
01:03 Brought to you by Sentry.io.
01:27 File management applications. 01:43 DaisyDisk.
04:19 Marta.
07:50 EasyFind.
10:16 Czkawka.
12:53 Backblaze.
14:40 Hazel.
17:42 AutoMounter. Lees meer18:43 Media applications. 18:52 Automator HIEC to JPG.
20:04 Rant on QuickView.
20:32 DVD idea.
22:06 IINA.
24:07 Capture One.
25:02 YouTube Enhance.
27:16 HandBrake.
28:05 MakeMKV.
30:33 Overkill for Mac.
33:42 Search by Image.
37:09 eqMac.37:37 Utility applications. 37:52 Stats & iStat Menu.
40:19 Alternatives to popular Mac applications. 40:23 Ice.
41:03 PearCleaner.
43:08 Numi.
44:17 Bottom (btm).
44:53 Sip Color Picker.50:25 Sick Picks & Shameless Plugs.
Sick Picks Scott: Wilde ChipsWes: Apple TV+: The Big Conn
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 -
816: Why Your CSS Sucks
2 september 2024 · 28 min
Scott and Wes break down why your CSS might suck—from misusing specificity to not leveraging CSS variables. Tune in as they dive into common pitfalls that are making your stylesheets a hot mess.
Show Notes 00:00 Welcome to Syntax!
00:33 Breakdancing in the Olympics.
05:29 Brought to you by Sentry.io.
05:44 Why your CSS sucks.
07:01 You’re styling the wrong element.
11:01 Nesting too deep.
12:37 You don’t understand specificity.
14:56 Your classes don’t use a system.
16:24 You’re using values instead of CSS vars.
20:16 You don’t understand block vs inline vs inline-block. CSS Logical Properties Lees meer21:16 You aren’t using the right tool for the job. CSS Flexbox, CSS Grid.
24:15 You’re setting the value in too many places.
24:31 You’re scoping to tightly or not tightly enough.
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 -
815: Deno 2 with Ryan Dahl
30 augustus 2024 · 45 min
In this episode of Syntax, Wes and Scott talk with Ryan Dahl about Deno 2.0, its new features and use of web standards, and how it seamlessly integrates with popular frameworks like Next.js. Ryan shares insights on the motivations behind Deno’s creation, its emphasis on simplicity and security, and offers his take on the evolving JavaScript ecosystem.
Show Notes 00:00 Welcome to Syntax!
00:34 What is Deno?
05:08 Deno 2.0
07:49 NPM compatibility
09:40 What parts of Node aren’t doable in Deno?
11:22 Do we need a hard break from Require?
13:51 Package management
16:25 Security and performance benefits of Deno
20:57 Brought to you by Sentry.io Lees meer20:57 Thoughts on Bun and Node additions
26:25 Ryan’s favorite Deno projects LumeFresh
webgpu-examples
gpucraft minecraft clone + deno + webgpu
gpucraft example
Shaderplay
Orillusion
28:42 Will we ever see a unified file system API?
31:49 Typescript
36:12 Jupyter Notebooks with Deno Polars39:11 AI and WASM in JavaScript
42:01 Deno 2.0 features and future
43:08 Sick Picks & Shameless Plugs
Sick Picks Ryan: McCarren ParkShameless Plugs Ryan: https://deno.com/enterprise
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 -
814: Fundamentals: HTML
28 augustus 2024 · 55 min
In this episode of Syntax, Wes and Scott talk about HTML fundamentals — from basic structure and semantics to practical tips for better accessibility and SEO. They also discuss the difference between block and inline elements, form functionalities, HTML5 elements like dialog and canvas, and more.
Show Notes 00:00 Welcome to Syntax!
02:33 Brought to you by Sentry.io Lees meer03:25 Why HTML is important
06:52 Semantic vs non-semantic
07:58 The basic structure of an HTML page HTML elements referenceThe Main element
08:45 Doctype
15:24 Nav
18:47 Section
20:41 Aside
22:09 Article
22:54 Span
27:18 Why use a span when you have a div and a paragraph tag?
29:29 Figure and Caption
31:16 Fieldset
31:53 UL vs OL
32:44 DFN The Definition element34:16 Form
36:56 Button vs Anchor
38:22 Headings 674 - A11y Treats - Heading Design40:21 Output The Output element
41:46 Dialog
42:04 Tables
44:03 Media media-chrome45:06 Canvas https://githubuniverse.com/
https://maximeheckel.com/
46:07 On graphics programming
47:38 Search 354 - The Surprisingly Exciting World of HTML Elements48:27 Sick Picks + Shameless Plugs
Sick Picks Scott: 2Pack Traditional Natural Bamboo Wok BrushesWes: Logitech MX Master 3S
Shameless Plugs Syntax YouTube Channel
The Easiest Way to Infinite Scroll with React | Full Example
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 -
813: CSS: Scroll Driven Animations
26 augustus 2024 · 22 min
In this episode of Syntax, Wes and Scott talk about CSS’ new scroll-driven animations, its implementation, uses, and potential pitfalls. They also discuss animation-timeline and animation-range, and how they can be utilized to control animations based on scroll positions.
Show Notes 00:00 Welcome to Syntax!
00:46 Brought to you by Sentry.io.
01:35 Scroll-driven animations. Syntax 695: 5 New CSS Features You Should Know Lees meerScroll-driven animations demos and tools.
04:13 @keyframes.
05:22 animation-timeline.
11:35 animation-range.
08:49 View-based timelines.
17:45 Neat uses: Dave Rupert on styling :stuck.
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 -
812: CSS 4, 5, and 6! With Google’s Una and Adam
23 augustus 2024 · 1 uur 3 min
In this episode of Syntax, Wes and Scott talk with Una Kravetz and Adam Argyle from Google Chrome about the evolution of CSS, new features, and the push toward more advanced UI capabilities on the web. They discuss the introduction of CSS versioning, exciting new properties like text-box-trim, state queries, and scroll state functionalities, select, and more!
Show Notes 00:00 - Welcome to Syntax!.
01:43 - Brought to you by Sentry.io.
02:19 - The evolution of CSS.
04:07 - CSS versioning and spec levels. CSS RFC. Lees meer17:49 - Use-cases for allow-discrete.
20:34 - State queries.
24:19 - Where does the baseline data come from?
25:17 - Will the RFC become official? The latest in Web UI (Google I/O ‘24).27:33 - New features Una is excited about.
29:44 - Select. https://open-ui.org/components/customizableselect.
https://codepen.io/argyleink/pen/YzoEPOG.38:31 - New features Adam is excited about.
39:24 - text-box-trim.
40:59 - State queries.
54:56 - Sick Picks + Shameless Plugs.
Sick Picks Una: Logitech MX Master 3Adam: Teenage Engineering K.O. II
Shameless Plugs Una: Una.im
Adam: The CSS Podcast
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 -
811: NodeJS Evolves
21 augustus 2024 · 56 min
In this episode of Syntax, Wes and Scott talk about the latest features in Node.js, including native support for TypeScript, .env parsing, a built-in test runner, watch mode, SQLite integration, glob support, and top-level await. They also discuss some wishlist items, and experimental features like WebSocket support and the require module.
Show Notes 00:00 Welcome to Syntax!
01:13 Brought to you by Sentry.io.
01:37 Node.js new features. Deno.
Bun. Lees meer02:51 TypeScript. tsx.
swc/wasm-typescript.10:03 SQLite v22.5.
14:35 .env support.
16:24 Test runner. Jest.19:42 Watch Mode. nodemon.
21:22 Glob support.
22:48 Top-Level Await. Top-level await is a footgun.26:40 Experimental require module. Default ESM Detection.
Web request standards.
HonoJS.29:39 Experimental WebSocket support.
30:13 Async local storage.
31:43 Single file executables.
32:46 Wishlist. 32:54 Hot reload.
34:20 Window shim. globalThis.35:30 Better server.
35:56 Better terminal integration. NIM.
styleText.
chalk.
warp.41:36 Twitter responses. Coolify.
n.46:54 Sick Picks + Shameless Plugs.
Sick Picks Scott: CascadiaWes: Roborock Qrevo
Shameless Plugs Scott: YouTube Channel
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 -
810: Effortless Light and Dark Mode × Theme Styling
19 augustus 2024 · 38 min
In this episode of Syntax, Wes and Scott talk about the latest CSS theming properties and techniques for better controlling light and dark modes, as well as creating comprehensive color systems for applications and websites. Make sure to check out the video version of this episode for practical code examples, and explanations of light/dark function, CSS variables, meta tags for theme colors, accent color, color mix, and upcoming features like style queries and color contrast.
Show Notes 00:00 Welcome to Syntax!
01:36 Brought to you by Sentry.io.
03:45 theme-color.
10:12 color-scheme.
15:14 light-dark().
17:44 How to force light or dark mode.
23:03 Live debugging box-shadow.
28:05 color-mix().
29:53 accent-color.
31:27 Relative color syntax.
35:49 Style queries and color-contrast().
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 -
809: How To Stay Up To Date with Daily.dev’s Francesco Ciulla
16 augustus 2024 · 45 min
In this episode of Syntax, Scott and Wes talk with Daily.dev’s Francesco Ciulla about the platform's history, community features, and significant growth. They dive into the core ideas behind daily.dev, including its personalized feed for developers, new features like squads, community contributions, and tech stack. Francesco also shares his passion for Rust, and highlights the importance of content creation in the ever-evolving tech landscape.
Show Notes
00:00 Welcome to Syntax! Lees meer00:36 Brought to you by Sentry.io
01:24 Overview and features of daily.dev
07:05 daily.dev's origin story
10:06 How Product Hunt fueled initial growth
12:21 Monetization and business model
13:53 Content and user experience Syntax Squad
22:21 Written content vs video content
24:29 Tech stack Terraform
Pulumi
React
Vercel
Fastify
Postgres
Go25:37 Building a positive community
30:32 Moderation and tagging
35:03 Francesco's favorite place to publish right now
36:56 Quadrupling down on Rust Rust
39:38 Francesco's favorite Rust framework Actix
41:18 Sick Picks & Shameless Plugs
Sick Picks Francesco: daily. devShameless Plugs Francesco: Francesco's YouTube Channel
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 -
808: The Future of JavaScript Frameworks × Building Auth × DB Design Tips, and more!
14 augustus 2024 · 53 min
In this potluck episode of Syntax, Wes and Scott answer your questions about the future of JavaScript frameworks, building custom authentication systems, limiting API access, using Caddy server proxy for local development, component props in JSX, structuring a relational database, and more!
Show Notes 00:00 - Welcome to Syntax!
01:48 - Brought to you by Sentry.io Lees meer04:37 - The future of JavaScript frameworks
09:09 - How to use Caddy for local development SvelteKitVite
14:27 - When to use an API Strapi
17:38 - Where does Scott get his amazing t-shirts? Sentry.shop
Syntax Snack Pack
21:33 - Best screwdriver for kids toys PicQuic Sixpac Plus
LTT Screwdriver
24:31 - Strategies for database design MongoDB
Prisma
30:21 - Do we need frameworks? 796 - Do We Need JS Frameworks × Are You Over-Engineering? × Webview vs Native
Frontend Masters
32:19 - Best tech stack for building a basic login system 336 - How To Build Your Own Auth
37:56 - Syntax video episodes
40:25 - Component props in JSX
45:26 - Sick Picks & Shameless Plugs
Sick Picks Scott: Loop Quiet Ear PlugsWes: Gecko’s Toes Water Hose Rack
Shameless Plugs Scott: Syntax YouTube Channel
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 -
807: CSS Components: Tailwind, Panda, Scoped, Modules, Classes, Variables, CSS-in-JS and Sprinkles!
12 augustus 2024 · 38 min
In this episode of Syntax, Wes and Scott talk about CSS components, including class-based components, CSS modules, scoped CSS, utility CSS, and CSS-in-JS strategies. They share their thoughts, what differentiates these approaches, and why you may (or may not) want to use them.
Show Notes 00:00 - Welcome to Syntax!
01:30 - Brought to you by Sentry.io.
02:11 - What makes a good CSS component system?
07:54 - Component vs part of a component
13:26 - CSS Modules
15:56 - Scoped CSS @scope - (82% support!) ff behind flag https://developer.mozilla.org/en-US/docs/Web/CSS/@scope Lees meer21:07 - How is Panda different from style components? Panda
StyleX
00:00 - Utility CSS TailwindCSS
Uno
31:08 - Utility Sprinkles
34:13 - CSS variables open-props.styleHit 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 -
806: The King of Drag and Drop: Alex Reardon
9 augustus 2024 · 55 min
Scott and Wes talk with Alex Reardon from Atlassian about developing drag-and-drop libraries, specifically the challenges with creating efficient and accessible drag-and-drop functionalities for the web. They also explore what it takes to build and implement a system that works seamlessly across various frameworks.
Show Notes 00:00 Welcome to Syntax!
01:18 Brought to you by Sentry.io.
01:51 What Alex does at Atlassian react-beautiful-dnd Lees meerPragmatic drag and drop
04:38 What makes drag and drop tricky.
06:38 Use-cases.
10:54 What security is in place?
12:30 How to make it feel native.
19:20 Is the drag and drop spec ongoing?
20:03 How do you build this headless?
21:33 How does drag and drop work with frameworks?
23:48 Making drag and drop feel the same across mobile and desktop.
26:09 What’s the key to really good drag performance?
29:58 How do you make drag and drop accessible?
34:57 Pragmatic drag and drop code vs application code. Shoelaceshadcn
40:00 How does testing work? Playwright
Cypress
43:15 Internal adoption at Atlassian.
44:27 Working on high-impact projects.
49:15 Versioning and internal adoption at Atlassian.
51:29 Sick Picks + Shameless Plugs.
Sick Picks Alex: Coffee, James Hoffmann YouTube Channel.
Shameless Plugs Alex: Dom Events.
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 -
805: We React to State of React Survey
7 augustus 2024 · 56 min
Scott and Wes serve up their reaction to the “State of React 2023” survey results, discussing the main API pain points like forwardRef and memo. They also explore the latest on state management, hooks pain points, and exciting new libraries in the React ecosystem.
Show Notes 00:00 Welcome to Syntax!
01:41 Brought to you by Sentry.io.
02:28 The State of React 2023.
03:11 The Main API Painpoints. 04:31 forwardRef.
05:27 memo.
06:39 Context API.
07:18 StrictMode.
08:45 Double rendering.
09:36 State management. Lees meer11:58 Hooks Pain Points. 12:11 useEffect.
12:33 Dependency arrays.13:11 New API Pain Points. 13:19 React Server Components.
14:40 Taint API.15:19 Libraries. 17:02 Jotai.
17:45 Apollo Client.
19:05 Redux.
20:57 Redwood.
21:26 React Aria.
21:55 Astro.
22:04 The most negative.23:35 Component Libraries.
25:50 Other Component Libraries. 25:53 Mantine.
27:47 Details element.
Tolin.ski/demos.
28:59 Honorable mentions.29:07 Animations.
29:28 Data Visualization.
31:26 CSS Tools and Libraries.
33:14 Styled Components.
34:16 Meta Frameworks.
38:50 Hosting.
40:08 Other Services.
40:45 Back-end language trivia.
43:00 State management.
43:40 Data Loading.
44:08 Other Tools.
44:09 Testing Libraries.
44:45 React Renderers.
47:58 Podcasts, thank you!
48:14 Sick Picks & Shameless Plugs.
Sick Picks Scott: Thermacell.
Wes: Nerf Guns
Shameless Plugs Wes: Syntax.fm.
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 -
804: Should Your Website Work Without JavaScript?
5 augustus 2024 · 31 min
Scott and Wes debate whether your website really needs JavaScript to function. They explore the principles of web standards, progressive enhancement, and test popular websites like Shopify and Netflix to see how they perform without JavaScript.
Show Notes 00:00 Welcome to Syntax!
00:11 Take 2
01:43 Brought to you by Sentry.io.
02:19 The clip summarized. 03:16 Your website should load, be readable and be (mostly) styled without JavaScript.
07:32 Web standards first. If it can be done without JavaScript, it should be. 08:09 What if the CSS doesn’t load?
10:20 Linking
10:24 Forms.
12:11 Links (Duh, but also c’mon!)
12:35 Query parameters. Lees meer13:57 Server render if possible.
15:20 Progressive Enhancement. 17:24 CSS Page Transitions.
19:07 Let’s test websites out. 19:15 Shopify.
22:16 Syntax.fm.
25:23 Netflix. 27:27 Local first and offline service workers.29:27 TikTok.
29:33 GitHub.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 -
803: The SQLite Takeover with Turso’s Glauber Costa
2 augustus 2024 · 1 uur 1 min
Scott and Wes chat with Glauber Costa from Turso about the evolution of databases and the fascinating technology behind Turso. They dive into topics like the benefits of massive multi-tenancy, vector search, and why Glauber made the switch from NoSQL to relational databases.
Show Notes 00:00 Welcome to Syntax!
00:36 Turso’s relationship with Drizzle.
02:10 What is Turso?
04:23 Brought to you by Sentry.io.
04:48 Using libSQL without Turso.
06:21 An explanation of Vector Search.
07:16 Vector databases are being ‘Sherlocked’ by larger databases.
09:24 Why did you move from NoSQL to Relational?
12:00 Allows for massive multi-tenancy - what does that mean?
15:27 Transactional schema changes.
16:30 Why would you want 10,000 databases?
19:02 What makes SQLite cheaper?
22:59 The strategy for building a business around an inexpensive tool.
26:13 Pull requests and branching within SQLite.
28:52 Database snapshots for rollbacks.
31:14 Driving the cost of a database to zero allows for rethinking architecture.
32:35 SQLite informing Turso’s edge functionality.
36:56 Automatic replica database syncing.
39:10 Is the database a bottleneck?
39:25 Embedded Replicas.
40:04 How do embedded replicas handle conflict resolution from offline users?
41:43 If the server is offline, can the database live in the client or WASM?
43:09 Conflict resolution.
44:47 What makes Turso stand out?
47:51 What was it like working on the Linux Kernel?
51:57 Do you use Linux?
52:46 Sick Picks & Shameless Plugs.
Sick Picks Glauber: Understanding yourself, What is Aphantasia.
Shameless Plugs Glauber: React Rally Park City, UT, Turso, Laravel.
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 -
802: Tree Shaking × useMemo vs useCallback × JavaScript Event Loop - STUMP'd
31 juli 2024 · 57 min
Scott and Wes serve up a gameshow-style quiz with STUMP’d, challenging each other on web development trivia. From the differences between useMemo and useCallback to the intricacies of the JavaScript event loop, join them for a fun and informative session packed with web dev insights!
Show Notes 00:00 Welcome to Syntax!
01:17 Brought to you by Sentry.io.
02:03 The longest game of Rock, Paper, Scissors.
Round 1
03:22 In React, what is the difference between useMemo and useCallback hooks, and in what scenarios would you choose one over the other?
05:56 Explain the concept of “tree shaking” in modern JavaScript build tools. How does it work, and what are its benefits?
Round 2
09:11 In the context of CSS Grid, explain the difference between grid-template-areas and grid-area.
11:34 What is the “Temporal Dead Zone” in JavaScript, and how does it relate to variables declared with let and const
Round 3
13:29 Describe the inner workings of the JavaScript event loop, including the roles of the call stack, callback queue, and microtask queue.
17:10 What is the “Shadow DOM” in web components, and how does it differ from the regular DOM?
Round 4
20:05 Explain the process of Critical Rendering Path optimization in modern web browsers
26:14 Describe the purpose and functionality of the Intl.Segmenter API in JavaScript.
Round 5
30:03 Explain the concept of Web Assembly (WASM) and its role in modern web development.
32:11 Explain the concept of Svelte stores, particularly focusing on the differences between writable, readable, and derived stores.
Round 6
35:26 Explain the concept of “code splitting” in modern JavaScript applications.
37:00 Describe advanced techniques for maintaining an accessible focus order in web accessibility.
Round 7
45:15 Explain the concept of “Server-Sent Events” (SSE) in web development.
47:37 What’s the difference between contain layout and contain paint?
49:30 Sick Picks & Shameless Plugs.
Sick Picks Scott: diskprices.
Wes: Slime Tire Sealant.
Shameless P… Lees meer -
801: 6 New JavaScript Proposals
29 juli 2024 · 18 min
Scott and Wes serve up six exciting new JavaScript proposals, including Promise.try and Math.sumPrecise. They break down what each proposal means for developers and how these new features could change the way we write JavaScript.
Show Notes 00:00 Welcome to Syntax!
01:45 Understanding the stages of JavaScript Proposals.
04:04 Promise.try - Stage 3.
05:39 Math.sumPrecise - Stage 2.7.
07:28 Floating point math.
09:07 ShadowRealm - Stage 2.7.
11:39 Brought to you by Sentry.io.
12:03 Regex Escape - Stage 2.
13:33 Defer Module Evaluation - Stage 2.7.
15:09 Iterator Sequencing - Stage 2.
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 -
800: Why the jQuery Creator Uses React and Typescript - John Resig
26 juli 2024 · 58 min
In episode 800 of Syntax, Scott and Wes sit down with John Resig, the creator of jQuery, to discuss the current state of React and TypeScript. They dive into the evolution of frontend frameworks, the challenges of server-side rendering, and the tech stack at Khan Academy.
Show Notes 00:00 Welcome to Syntax!
00:59 Brought to you by Sentry.io.
01:32 What is jQuery?
05:31 Did you anticipate the success jQuery had?
07:16 allow-discrete, @starting-style. Install Nothing: App UIs With Native Browser APIs - Scott Tolinski. Lees meer07:54 Building the community around jQuery.
11:16 jQuery plugins.
13:00 Did you ever make money from jQuery?
16:13 What is your role at Khan Academy.
17:58 What is the tech stack at Khan Academy?
21:56 Why do you want to change your CSS and JS framework?
24:03 TypeScript vs Flow.
25:25 GraphQL federation.
28:08 What was your frontend framework journey?
30:23 Is there any part of React you wish would improve?
32:37 Reservations using React Router.
33:14 Khan Academy web platform vs native platform.
35:21 What do you use for state management?
38:48 What’s harder than it should be on the web today? Kilian’s Question On X.
Polypane.app.42:46 Opinions on JavaScript Sprinkles.
44:04 What’s with the $ sign in jQuery?
45:29 The challenges of having your name in such a widely used software.
51:06 Challenges with server-side rendering in React.
52:42 Sick Picks & Shameless Plugs.
54:48 What are the performance issues associated with internationalization?
56:57 Back to Sick Picks & Shameless Plugs.
Sick Picks John: Biome, Remix, Lingui.
Shameless Plugs John: Khan Academy.
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