Syntax - Tasty Web Development Treats29 Apr 2020

Potluck Part 2 - Magic GQLess × Are classes dead? × Custom Hooks × Staying Up To Date × CSS × More!

It’s another potluck! In this episode, Scott and Wes answer your questions about custom hooks, static site generators, code management, CSS, and more! Sentry - Sponsor If you want to know what’s happening with your errors, track them with Sentry. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting Sentry.io and using the coupon code “tastytreat”. 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. Show Notes 04:02 - Q: Could you do a quick overview of how to effectively use a platform like Cloudinary? I have a Gatsby site with a lot of images and want to use something like Cloudinary to help with optimization, but the docs aren’t completely clear to me how to get the most out of their service. 10:58 - Q: What kind of CSS pre/post-processor you usually use? What are the pros and cons of pre-processor (SASS, SCSS, LESS) and post-processor (PostCSS)? 16:22 - Q: What is the most effective way to share a project with the internet and get feedback? I’m in a phase right now where I’m building loads of new web things with React and JavaScript, but the only place I can think to share them is my Twitter, where only like 3 people will see them. 18:35 - Q: What are your thoughts on classes in JavaScript? Do we still need them in 2020, or has the functional programming paradigm made them largely unnecessary? Does the answer change based on the size of the project and/or team? 23:56 - Q: Does ES2020 have var? Also, is ES2020 a real spec or just a term people are using? 27:37 - Q: Have you tried gqless, a graphql client alternative to something like Apollo client? Very interesting idea for clean and maintainable code. 29:15 - Q: What are the main differences in working for a software agency and a software product company? Pros and cons of each? 33:53 - Q: Advice for having static blog with minimal moving parts? I used to have a static blog but I eventually got sick of touching it because instead of writing content I often got stuck keeping up with all the dependencies involved. 38:18 - Q: Micro Frontends—is it the solution to rewriting legacy components? 42:16 - Q: I am relatively new to web development and I feel like it is very difficult to “catch up” with JavaScript. It seems like whenever I try to contribute an open source, I can’t figure out the code because they’re using newer (and presumably better) ways of doing things. How can I get up to date with everything that’s going on in the JavaScript world? Also, at what point should I start learning a front-end framework? 46:56 - Q: My team and I are starting to write pretty complicated custom hooks gathering data from a number of different endpoints and/or polling certain endpoints on a continuous interval timer before returning it to the component that needs the data. Since this is the case some hooks have gotten fairly large with multiple functions inside of them getting called to get/manipulate all the data, or multiple hooks using those same functions to get slightly different data. Is it a best practice to keep all those hooks together in one file if they support all the hooks? Or should we break the hooks into separate files and move the helper functions into another file and just have one hook per file? 51:10 - Q: Any tips for navigating projects with bad project managers? Working with non-technical agency project managers makes it pretty difficult to effectively plan and allocate time to ensure that all of the projects are done on time, on budget, and done well. It’s important to me to maintain an optimistic attitude in the organization, but sometimes I’d love to just hit 'em with the 'ol “Peace out” and go smoke some pork butt. Wondering if you guys have any good experience managing these types of projects? 55:45 - Q: I’m committing often and early, but this means that I end up writing the same vague git commit message over and over again. I know the solution to the problem is to just be more verbose, but it’s a difficult habit to break. Any advice? Links imgIX Netlify Sass Less Bootstrap Stylus PostCSS WordPress Reddit StaticGen Gridsom Vue Laravel Hugo ××× SIIIIICK ××× PIIIICKS ××× Scott: Jelle’s Marble Runs Wes: Hyundai HHC2GNK Vertical Style Electric Air Compressor Shameless Plugs Scott: Level Up Tutorials Pro - Sign up for the year and save 25%! 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

Upptäck Premium

Prova 14 dagar kostnadsfritt

Skaffa Premium

Avsnitt(938)

850: Manage State in JavaScript Like a Pro!

Scott and Wes serve up state management in JavaScript, breaking down key concepts like reactive state, state updaters, and global vs local state. They also explore various approaches and libraries, mutation-based state, and tools like Zustand and xState, to help you manage state like a pro. Show Notes 00:00 Welcome to Syntax! 01:22 Brought to you by Sentry.io. 03:10 What is state? 03:29 Common state jargon. 03:48 Reactive State. 04:14 Store. 04:46 Immutable vs Mutable State. 05:53 State updaters. 06:15 Signals. Solid.js Signal Docs. 06:49 Observables. 07:07 UI is a function of state. 08:39 State Machine. 10:58 Binding state. 11:36 Global vs local. 11:49 Computed State, derived state, selector state. 12:41 Approaches to state management. 12:52 Reducer based. 16:39 Mutation based state. 21:17 Atom based state. 25:15 Ways to hold state. 25:17 Holding state in an object. 27:38 Holding state in the URL. Syntax Shows. 29:34 Holding state in IndexedDB, local storage, and cookies. 32:16 Holding state with FormData. 33:56 Holding state with Signals. Signals Proposal. 37:27 Holding state with the server database. 38:55 Global State vs Component State. Habit Path. 40:39 Sharing state. 42:58 State libraries. 45:26 Zustand. 50:24 Jotai. 51:50 xState. 54:56 Easy Peasy. 55:24 Pinia. 56:01 TanStack Query. 57:02 Sick Picks + Shameless Plugs. Sick Picks Scott: Cremo Mens Body Wash, Bentgo Adult. Wes: Adult Bento Box. Shameless Plugs Wes: Syntax on YouTube. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

20 Nov 20241h 1min

849: How to Pick a JS Package

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 01: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

18 Nov 202422min

848: Web Components Can’t Save Us with Scott Jehl

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 Webpagetest.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 parts 18:23 Styling web components 22:08 Brought to you by Sentry.io 22: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: Enhance Shameless Plugs Scott: Squarespace is hiring Web Components Demystified - Get 30% off with coupon code “syntax” Web Components Community Group 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 Nov 202451min

847: Syntax Holiday Gift Guide

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. 01: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 Stand Desk 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 Strips 01:03:06 Shameless Plugs. 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

13 Nov 20241h 3min

846: Talking EVs: Range Anxiety, Charging, and Tech

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. 10: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

11 Nov 202444min

845: Are companies hiring? State of the dev job market with Taylor Desseyn

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 28: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 mic Randy 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

8 Nov 202457min

844: TypeScript, Branded Types, Streaming vs Polling + More

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. 11: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

6 Nov 202456min

843: Copilot Kills Cursor? Reacting to Github Universe Keynote

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 06:31 New tools are build upon existing LLMs. 09:14 VSCode reclaiming ground from Cursor. Cursor 10: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

4 Nov 202455min

Allt en och samma app

Lyssna på dina favoritpoddar och ljudböcker på ett och samma ställe.

Noga utvalt innehåll

Njut av handplockade tips som passar din smak – utan ändlöst scrollande.

Fortsätt när du vill

Fortsätt lyssna där du slutade – även offline.

Premium

99 kr/mån

Tillgång till alla Premium-poddar
Reklamfritt premium-innehåll
Avsluta när du vill

Prova 14 dagar gratis

Premium

129 kr/mån

Tillgång till alla Premium-poddar
Reklamfritt premium-innehåll
Avsluta när du vill
Ett extra konto

Prova 14 dagar gratis

Populärt inom Politik & nyheter

Berättelserna och rösterna du älskar att lyssna på

Obegränsad lyssning på alla dina favoritpoddar och ljudböcker

Upptäck Premium