Potluck - Immutability × Turning Off Your Brain × Types vs Interfaces × Hooks vs Components × Making the Most of Your First Job × Confidence in Svelte × More!
Syntax - Tasty Web Development Treats9 Juni 2021

Potluck - Immutability × Turning Off Your Brain × Types vs Interfaces × Hooks vs Components × Making the Most of Your First Job × Confidence in Svelte × More!

It’s another Potluck! In this episode, Scott and Wes answer your questions about immutability, turning off your brain, managing copy on a website, problem-solving, types vs interfaces, hooks vs components, and more! Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section. LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Coudinary - Sponsor Cloudinary is the best way to manage images and videos in the cloud. Edit and transform for any use case, from performance to personalization, using Cloudinary’s APIs, SDKs, widgets, and integrations. Show Notes 01:24 - I’m finally getting onboard with the GraphQL train and have a specific question about nomenclature. Having worked with redux in the past, IMMUTABILITY was a concept ingrained in my head. I continue to see benefits of immutable updates across all sorts of libraries, frameworks, vanilla js, etc. Learning about GraphQL now, I’m taken aback by the fact that CUD (create, update, delete) operations are called MUTATIONS. Is there a reason that we use the “mutation” terminology, despite the fact that best practices dictate that we should implement immutable updates to objects? Does GraphQL actually mutate objects behind the scenes? 06:38 - How do you sleep at night?!? I mean, how do you switch off your brain when you’re trying to go to sleep and your brain just wants to keep on coding? 12:15 - How do you manage copy and microcopy on a site? Should you put every piece of text across the entire site into a CMS so the client can change it? Or just the parts you think may be updated in the future? Or do you just hard-code everything directly into the markup? Or collect it all into an importable JSON file? 21:41 - I am new to using CMSs and I was wondering for applications that require a lot of content management where a CMS or headless CMS such as Contentful is ideal but also requires dynamic queries such as recommended content to the end-user based on browsing history. How do you approach integrating the user data in combination with the data being received and handled from the CMS? A separate API and database? Or is this a scenario that a CMS doesn’t fit? 25:56 - When solving a problem, do you do it through trial and error? Or do you carefully think through every solution and choose the best one before actually implementing it into code? 28:14 - How can we take advantage of this new partnership between 1Password + SecretHub! I feel like this is getting into DotEnv but sounds so much more interesting. 32:34 - When creating types in TypeScript, when should someone use a type over an interface? While I generally understand the differences, it seems like interfaces offer more flexibility. I am struggling to understand why I would ever use a type. 36:34 - I’ve recently started using TypeScript in React, and typically I’m just using function components. I’ve seen some people saying that classes are really great with TypeScript in React but I haven’t found any real use case/benefits myself yet. How about you guys, do you use classes in React/TypeScript? 38:17 - What are your opinions on generators like Yeoman? 44:26 - I’ve been looking for a career in web for a couple of years now and I’ve recently landed a job with a small agency getting paid hourly making WordPress websites, that I’ll be starting in two weeks. I’m worried that I’m going to get stuck pushing Divi sites all the time. I know this is a good opportunity for me but I was hoping you guys can shed some light and give me some tips on how I can put my skills to good use. 48:35 - What are your approaches for caching a GraphQl API? 52:30 - You mentioned in an earlier Potluck that Svelte is probably the easiest framework to learn. How confident can one be to start a new project with Svelte? Being a technical lead, can I propose our team to work with Svelte? Are there enough material/solution on the web and is the community established? Links ZMA Supplement Tina https://twitter.com/gusfune/status/1372243283758419977 1Password SecretHub TypeScript Syntax 348: TypeScript Fundamentals — Getting a Bit Deeper Syntax 042: Potluck EP × Vue.js × Headless WP × Typescript & Flow × Productivity × Server Side Rendering × Yeoman https://www.npmjs.com/package/zx Yeoman Mercurius Apollo Svelte ××× SIIIIICK ××× PIIIICKS ××× Scott: Contigo Shake & Go Wes: Deli Containers Shameless Plugs Scott: 1: Become a Level Up Tutorials Author 2: Level Up Tutorials Pro Spring Sale - 50% off annual subscriptions! Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off! Tweet us your tasty treats! Scott’s Instagram LevelUpTutorials Instagram Wes’ Instagram Wes’ Twitter Wes’ Facebook Scott’s Twitter Make sure to include @SyntaxFM in your tweets

Avsnitt(964)

868: The State of JavaScript

868: The State of JavaScript

Wes and Scott talk about the State of JavaScript survey, tends, popular features, and the evolving landscape of tools and frameworks. Show Notes 00:00 Welcome to Syntax! 00:27 Brought to you by Sentry.io 01:16 The state of JavaScript Twitter fantasy football 02:27 Syntax features The State of JavaScript survey 05:27 Logical assignment 07:49 Strings 08:18 Arrays 14:16 Sets 2025 New Years resolution: use maps and sets more and objects / arrays less. 16:10 Browser APIs 22:50 Library tiers list 27:21 Upgrading from M1 Mac Chris Coyier - M4 30:08 Front-end frameworks 32:18 The top front-end frameworks used at work 33:49 What is the highest paying framework? 35:01 Meta frameworks 36:32 Meta frameworks pain points 42:33 Testing tools 43:58 Build tools 44:41 Most used libraries 46:33 Back-end frameworks 48:34 JavaScript runtimes 50:35 Serverless runtimes 51:25 Other languages people are using 52:49 AI tools 53:37 The State of JS Awards 57:18 Sick Picks + Shameless Plugs Sick Picks Wes: Headted Vest Scott: Super Mario Party Jamboree Shameless Plugs 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

15 Jan 1h 2min

867: Zero Sync is the Future of Data Loading

867: Zero Sync is the Future of Data Loading

What’s the deal with Zero Sync? Scott and Wes dive into this cutting-edge database tech, exploring its real-time interactivity, blazing-fast performance, and how it stacks up against the competition. Plus, they break down setup, querying, authentication, and whether it’s ready for prime time. Show Notes 00:00 Welcome to Syntax! 01:59 Brought to you by Sentry.io. 02:21 Today’s agenda. 02:52 What is Zero Sync? The Docs. InstantDB. 07:02 Zerobugs loading speed. 11:04 Real-time interactivity. 11:38 Why is it different? 12:11 How to get it set up. 12:58 Querying Data. 16:22 Writing data. 16:31 Upsert. 17:39 Authentication and permissions. Johannes Schickling Ep 767. 19:27 Preloading. 19:41 Migrations and deployment. 20:17 Some extras. 21:16 CreateSubscriber. 23:08 Can you use this today? Zero Syn Roadmap. Scott’s YouTube Video. 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 Jan 29min

866: 2025 Web Development Predictions

866: 2025 Web Development Predictions

Scott and Wes look into their crystal ball to predict what’s coming in web development next year. From the rise of on-device AI to the vanilla CSS comeback, Bun’s big moves, and React’s evolution, this episode is packed with bold predictions and hot takes! Show Notes 00:00 Welcome to Syntax! 02:00 Brought to you by Sentry.io. 03:09 The agenda. 03:40 Temporal Javascript api will ship in Safari and Chrome. Temporal Proposal. 06:23 On device AI. WebGPU API Dawn Native WebGPU 10:26 Models will plateau. Bolt.new, v0, Lovable.dev. 13:40 Web Awesome will become the most used web components library. Web Awesome. 15:57 We will be using more web components. 16:59 A push towards the ‘standard stack’. 19:38 We can really use relative color. 21:39 Vanilla CSS comeback. 23:35 A complete Mixins / Functions API for CSS. 24:27 Conditionals will ship in all browsers. 25:50 People will still make vertical centering jokes. 27:08 VSCode will be feature parity with Cursor. 28:22 Framework choice will matter less with AI tools. 29:12 OpenAI will launch a browser. Dupe.com. Buy Now! The Shopping Conspiracy. Krazy Binz. 37:18 React will drop Babel. BabelJS. 38:05 React Server Components will pop. 39:46 Remix will relaunch as something entirely different. 41:11 React Native will have it’s time. 42:06 Svelte will get component-based islands or data loading. 44:19 Server Runtimes, Bun will continue to do non-standard, lovable things. 44:44 Bun will release a PAS to compete with NPM, Vercel, and Vite. 46:06 Laravel will release a CMS. 47:57 Vite will stay king. 48:03 Rolldown ships in the next version of Vite. Rolldown. Statamic. 49:35 Sick Picks & Shameless Plugs. Sick Picks Scott: PHILIPS A19 Ultra Definition Dimmable Light Bulb. Wes: Stats App. 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

8 Jan 52min

865: CSS Performance × Rate Limiting × Array Sort Behavior - STUMP'd

865: CSS Performance × Rate Limiting × Array Sort Behavior - STUMP'd

Scott and Wes challenge each other’s knowledge on everything from array sorting quirks to browser isolation types in a rapid-fire trivia format. They dive deep into performance optimizations, TypeScript type safety, and HTML best practices while uncovering surprising edge cases that every web developer should know about. Show Notes 00:00 Welcome to Syntax! 00:43 Brought to you by Sentry.io. 01:23 Question 1: Array Sort Default Behavior. 03:24 Question 2: Splitting Into Individual Words & Characters. 06:06 Question 3: NodeJS Stream Backpressure. 09:07 Question 4: Custom Middleware Rate Limiting. 13:00 Question 5: Transform Function Property Changes. 15:18 Question 6: TranslateZ & Will-Change Performance. 17:52 Question 7: Table Structure Best Practices. 20:23 Question 8: Dialog vs Div with Dialog Role. 23:21 Question 9: TypeScript Unknown vs Any & Never. 26:31 Question 10: Response Type Safety in TypeScript. 29:48 Question 11: Browser Isolation Types. 32:54 Question 12: HTML Quirks Mode Behavior. 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 Jan 35min

864: Durable Objects × Tab State Hacks × Headless CMS Choices + More

864: Durable Objects × Tab State Hacks × Headless CMS Choices + More

Scott and Wes ring in the new year, answering listener questions on the rise of durable objects, handling tricky tab state in e-commerce apps, and their top picks for headless CMS. They also chat about the future of CSS, deployment platforms, and whether Syntax beanies might finally be a thing! Show Notes 00:00 Welcome to Syntax! 00:52 Brought to you by Sentry.io. 03:10 What Are Durable Objects? 08:25 CSS Anchor Positioning: Cross-Browser Support Update. Implement CSS Anchor Positioning. 12:48 Freelancers: UX and Design Skills vs. Functional Expertise. 16:47 Choosing the Best Deployment Platform. Syntax Episode 615. 20:49 Making Websites WCAG Compliant. Polypane. 22:35 Managing Tab State in Complex Apps. 28:43 Will CSS Ever Be Complete? 33:21 When Will Syntax Beanies Drop? Syntax Swag Store. 35:21 The Best Headless CMS for a Tech Blog. 42:15 From Many Packages to Monolithic Frameworks. 46:41 Sick Picks + Shameless Plugs. Sick Picks Scott: The Sheet with Jeff Marek. Wes: 28” 4K+ BenQ Programming Monitor. 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

1 Jan 52min

863: 2024: A Year in Review

863: 2024: A Year in Review

Scott and Wes look back at 2024 and share highlights from a big year for Syntax and the web dev world. They review their 2024 predictions to see what they got right (and wrong), and break down the major moments in web development from CSS improvements to AI editors and beyond. Show Notes 00:00 Welcome to Syntax! 01:30 Changes to the Syntax podcast. 05:56 What happened this year? 06:07 React. 06:36 Solid Start. 07:04 Tanstack Start. 07:43 Remix 09:42 AI Editors. 11:53 Vite 6. 14:02 Bluesky. 19:52 CSS. 22:17 What did we do? 22:21 React Miami. React Miami Episode. 22:26 JSNation Amsterdam. 23:55 JSNation US + React Summit. 24:57 Terminal Feud. 26:28 Laravel + Terminal basketball game. 27:02 Syntax San Francisco meetup. 27:23 GitHub Universe. 28:07 FITC. 28:38 153 Syntax Episodes + Video. 29:32 Our 2024 Predictions Reviewed. 29:46 Types in JS will have real movement. 31:29 Temporal API will ship in 1 browser. 32:50 Perf tooling gets easy for everyone to understand. 33:29 CSS continues to get better where you need less JS. 34:25 Svelte v5 is very fast. 34:38 The year of the server in frameworks. 35:28 Astro is going to have a good year. 36:13 React server components. 37:03 Remix moves away from page-based loaders, to component loaders. 37:18 Hono will become more ubiquitous. 38:28 We will see a route matching Proposal move ahead. 39:23 Bun releases full node compat. 40:42 We will see a new Linter + formatter entirely replace. 42:16 New TypeScript typechecker. Ezno. 43:40 Lightning CSS pops - or does it? 45:10 You’ll hear more about Rspack and Turbopack. 45:51 Vite isn’t going to release anything big in 2024. 46:24 Relative color will land in all major browsers. 48:14 CSS contrast-color will land in chrome. 48:48 Scroll animation landing in 2 browsers. 50:03 The year of CSS discovery. 51:09 Safari will Ship 3 missing PWA Support. 52:11 Firefox usage will continue to slip. 56:53 Paid Arc features. 57:14 More XR web experiences as Apple releases in Vision Pro. 59:55 AI Tooling. 01:00:57 Small Models that run in the browser. 01:01:38 Apps get Sherlocked by OpenAI. 01:02:04 On prem corporate AI. 01:04:49 Sick Picks + Shameless Plugs. Sick Picks Scott: TCGPocket App. Wes: Huge Bag of Croc Charms 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

23 Dec 20241h 8min

862: Svelte 5 Is Here!

862: Svelte 5 Is Here!

Is Svelte becoming React? Scott and Wes explore the exciting updates in Svelte 5, including Runes, Snippets, odd font choices, and performance benchmarks, while discussing custom event updates, migration tips, and potential performance gains. Show Notes 00:00 Welcome to Syntax! Scott’s Svelte5 Overview. 01:27 Brought to you by Sentry.io. 02:06 What’s new in Svelte 5? 02:13 Runes. 04:47 $state 07:00 $state.snapshot 11:47 $derived 12:46 $derived.by 15:41 $effect 17:24 $effect.pre 18:05 $effect use cases. 22:20 $props 24:57 Binding state. 27:15 $inspect vsode-wrap-svelte. 28:46 $inspect(…).with 30:42 Snippets. 34:22 Events now onclick instead of on:click. 36:09 Custom events now just props instead of createEventDispatcher. 36:31 Serif Font on website. 40:01 Performance. Benchmarks Doc. Benjamin McCann Tweet. 46:41 Is Svelte becoming React? 49:21 Migration. 51:41 What’s next and wish list for Svelte. 57:12 Sick Picks & Shameless Plugs. Sick Picks Scott: Dragon Quest 3. Wes: Dresscode.dev. 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

18 Dec 20241h

861: Local Data: Sqlite, LocalStorage, Session, Cookies and IndexDB

861: Local Data: Sqlite, LocalStorage, Session, Cookies and IndexDB

Scott and Wes dive into the world of local data storage, breaking down the pros and cons of Sqlite, LocalStorage, SessionStorage, Cookies, and IndexedDB. They cover real-world use cases like user settings, offline data, and auth tokens, while sharing their favorite tools and strategies for keeping your data fast and secure. Show Notes 00:00 Welcome to Syntax! 00:30 Brought to you by Sentry.io. 01:43 Why store data locally. 01:55 User preferences and settings. 02:50 Not logged in state (shopping carts, etc). 03:30 Data for faster loading. 03:51 Privacy concerns. 04:25 Large files or drafts. 05:50 Auth tokens. 07:08 Where to store data. 07:11 Cookies. 07:48 Local storage. 09:15 Session storage. 10:35 IndexedDB. 12:15 BYOJS Storage. 13:41 SQlite via WASM. 14:12 Penalties of SQLite in browser via WASM. 15:29 PGLite. 16:23 Dealing with migrations. 16:55 The advantages of the approach. 18:42 Dexie. 19:59 Patch messages. 21:25 A few options. TinyBase Docs. Local First Web. 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 Dec 202424min

Populärt inom Politik & nyheter

svenska-fall
aftonbladet-krim
motiv
p3-krim
flashback-forever
fordomspodden
rss-viva-fotboll
aftonbladet-daily
rss-krimstad
rss-sanning-konsekvens
rss-vad-fan-hande
olyckan-inifran
spar
blenda-2
politiken
dagens-eko
rss-frandfors-horna
rss-krimreportrarna
rss-expressen-dok
krimmagasinet