Dev Tools Power — Elements Tab

Dev Tools Power — Elements Tab

In this episode of Syntax, Scott and Wes talk about the Dev Tools Elements Tab — all the features, and when you would use them! Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started. Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up. Mux - Sponsor Mux Video is an API-first platform that makes it easy for any developer to build beautiful video. Powered by data and designed by video experts, your video will work perfectly on every device, every time. Mux Video handles storage, encoding, and delivery so you can focus on building your product. Live streaming is just as easy and Mux will scale with you as you grow, whether you’re serving a few dozen streams or a few million. Visit mux.com/syntax. Show Notes 03:13 - Elements Learn to open the Elements panel and the console right away — right-click inspect element is weak! Drag-and-drop elements Edit as HTML Click to select use in JS console $0 → Add Attribute Breadcrumbs Flex (Chrome now!) Break on → Node removal Scroll into view Expand / Collapse 16:59 - Styles :hov .cls Element style Layout - Box Model Layout - Grid Layout - Flexbox Toggle Print/Light/Dark 25:03 - Panel Escape to open close No longer has to be JUST Console Computed Styles Great to find out what value it’s actually using without scrolling through the cascade Toggle browser styles on and off Fonts Tab Super handy to find the used font, spacing, size, weight, etc. You can also see all fonts used on a page Animations Tab Changes Shows the CSS that has changed since you have been goofing around. 38:18 - Settings Show what’s new https://chrome.google.com/webstore/detail/material-devtools-theme-c/jmefikbdhgocdjeejjnnepgnfkkbpgjo Experiments 43:39 - Compatibility Links Firefox Chrome Canary Brave Can I Use ××× SIIIIICK ××× PIIIICKS ××× Scott: Problematic Roller Coasters Wes: Scrapyard Finds! Repair-A-Thon! Cordless Tools Galore! Shameless Plugs Scott: Svelte Kit - 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

Jaksot(971)

795: Hosting Private Fonts on the Edge With Cloudflare

795: Hosting Private Fonts on the Edge With Cloudflare

Scott and Wes dish out the intricacies of hosting private fonts using Cloudflare Pages. They explore the challenges of font security, the benefits of a font server, and the nuances of caching and whitelisting to keep your fonts secure and efficient. Show Notes 00:00 Welcome to Syntax! 01:53 Behind the Code: Brought to you by Sentry.io. 03:12 The problem with hosting fonts. Scott’s Fonts. 05:42 The solution, a font server with Cloudflare Pages. 09:37 Utilizing a Key Value Store. 10:53 Storing a whitelist. 13:42 Why not just use a bucket? Check out the code. 15:24 Should whitelisting be done in JavaScript or cores? 17:23 How do you cache to multiple origins? 18:15 Multiple URLs in an allow origin. 19:17 Font security and foundry challenges. 21:43 Moving Domains on Cloudflare. Check out the font Syntax uses! MD-IO. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

15 Heinä 202424min

794: Prettier JavaScript with Vjeux

794: Prettier JavaScript with Vjeux

Scott and Wes sit down with Vjeux from Meta to dive deep into the origins and evolution of Prettier, the widely-used code formatter. They discuss the challenges faced, the decision-making process behind its features, and what the future holds for this indispensable tool in the developer’s toolkit. Show Notes 00:00 Welcome to Syntax! 01:45 Brought to you by Sentry.io. 02:19 New swag! 03:25 Who is Vjeux? 06:56 Is management the key to successful projects? 08:50 The genesis of Prettier. 12:08 Why other JS formatters didn’t work. 16:56 Focusing on edge-cases. 17:41 The goal for Prettier. Prettier Philosophy. 18:31 Next step, integrations. 19:37 Should you run Prettier on save or commit? 21:34 Does Prettier’s limitations lead to higher adoption? Prettier Config. 25:01 What was the most controversial default setting? 28:14 Does Facebook use semicolons? 29:18 Getting approval to devote 6 months to Prettier. 31:42 Working with Mark Zuckerberg. 32:43 Was there ever consideration to augment ESLint instead? Prettier vs. Linters. 35:34 What are your thoughts on the Rust-based alternatives? 36:44 Prettier’s $10,000 bounty. 39:32 What is the future of Prettier? 44:54 Prettier is available in almost every language. 47:59 Advice for other open-source maintainers. 53:26 Sick Picks & Shameless Plugs. Sick Picks Vjeux: TransformersJS. Shameless Plugs Vjeux: Prettier x Syntax Swag. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

12 Heinä 202455min

793: The Local First Landscape

793: The Local First Landscape

Scott and Wes dive into the local first landscape, exploring the benefits and possibilities of local first apps. They highlight some of their favorite tools and discuss why local first is gaining traction among developers. Show Notes 00:00 Welcome to Syntax! 00:27 Behind the Code: Brought to you by Sentry.io. 01:06 Catch up with Wes and Scott. 03:00 The local first space. Scott’s Blog: The Spectrum of Local First Libraries. Syntax 739: The Lofi Movement. 04:27 Some local first apps we love. Linear. Tweek.so. Superhuman. 05:15 The advantages of local first. 06:07 localfirstweb.dev. 09:21 Triplit. 15:33 Evolu. 22:32 RxDB. 24:08 ElectricSQL. 26:57 Pouchdb. 28:46 TinyBase. 32:08 Replicache. 44:31 PowerSync. 48:21 Sick Picks & Shameless Plugs. Sick Picks Scott: Battery Jump Starter. Wes: Battery Tire Pump. Shameless Plugs Wes: Syntax Swag Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

10 Heinä 202453min

792: Perfect Sitemaps for SEO

792: Perfect Sitemaps for SEO

Scott and Wes break down the importance of sitemaps for SEO. They dive into the different file formats, essential fields, and common pitfalls to avoid when creating and submitting your sitemap to search engines. Show Notes 00:00 Welcome to Syntax! New Swag Coming Soon. Tolin.ski. 02:09 Brought to you by Sentry.io. 02:39 Sitemaps. 04:36 Why do you need a sitemap? 06:34 Sitemap file formats. 08:31 Choosing a file format. 09:17 Site map file size limits. 10:32 Fully-qualified URLs. 10:50 Fields and metadata. 10:58 What fields matter for SEO? 14:20 What to avoid in your sitemap? 14:23 Dynamic user pages and account pages. 14:43 Parameter-based URLs. 16:01 Redirects, duplicates or disallowed pages. 16:11 Unlisted pages. 17:07 How do you make a sitemap? 20:06 What to do once you have a sitemap. 20:08 Validation. 20:20 Submit to search engine. Bing Webmaster Tools. Google Search Console. 22:11 Cache them! 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 Heinä 202423min

791: LLRT The Serverless Runtime w/ Richard Davison

791: LLRT The Serverless Runtime w/ Richard Davison

Scott and Wes chat with Richard Davison from AWS about LLRT, a new runtime tailored specifically for Lambda. They dive into the benefits of using LLRT, challenges with JavaScript in serverless, and why Rust was chosen for its development. Show Notes 00:00 Welcome to Syntax! 01:07 Who is Richard Davison? 05:11 What is LLRT and what’s the motivation for building it? 08:25 AWS Lambda example. 11:20 What makes LLRT specifically tailored to Lambda? 14:55 Brought to you by Sentry.io. 15:22 Node.js in Lambda. 16:00 What are some challenges that people have with JavaScript in serverless? 17:20 Lambda memory configuration. 19:23 Managing cost of compute. 21:29 Simpler and faster than Node, Bun, Dino, but not a replacement. 22:31 The benchmarks. 27:00 Quick.js, the main reason for the performance gains. Fabrice Bellard QuickJS. 28:03 The Quick.js engine. 30:35 What was the reason behind creating Quick.js? 33:46 What made you pick Rust for LLRT? 36:34 Abstractions and the value of speed. 39:08 The JIT Compiler. 42:38 Compile cache. 43:27 De-optimizations. 44:59 Node.js Compat, what to use and avoid with LLRT. GitHub AWS Labs Compatibility Chart. 47:52 Will you target with WinterCG spec? 50:22 Streams API. 52:06 What about WebSockets? 53:10 Is this going to be promoted from a labs project? 54:49 Sick Picks + Shameless Plugs. Sick Picks Richard: QuickJS Engine, JSLinux. Shameless Plugs Richard: Javascript Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

5 Heinä 202456min

790: State of JS 2023 Reactions

790: State of JS 2023 Reactions

Scott and Wes dive into the 2023 State of JavaScript survey, breaking down the latest trends and pain points in front-end frameworks, build tools, and JavaScript runtimes. Tune in for their hot takes and insights on what’s shaping the JavaScript landscape this year! Show Notes 00:00 Welcome to Syntax! State of JS 2023. 03:04 Brought to you by Sentry.io. 03:43 New Syntax Swag! Syntax Swag Store. 04:42 Front end frameworks. 08:30 Front end framework pain-points. 12:17 Metaframeworks. 17:45 Metaframework pain-points. 22:17 Build tools. Rolldown. 24:45 Build tool pain-points. 25:54 JavaScript runtimes. 28:19 Edge + serverless runtimes. 29:30 Backend frameworks. 33:17 Non-JavaScript languages. 36:12 Hosting service. 38:50 Usage. 40:05 Javascript usage. 41:03 Missing features. 45:04 Industry sector. 47:37 The awards. 51:34 Sick Picks + Shameless Plugs. Sick Picks Scott: Electric Lighter. Wes: Monkey Noodle. Shameless Plugs Wes: Syntax Swag Store. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

3 Heinä 202457min

789: Do More With AI - LLMs With Big Token Counts

789: Do More With AI - LLMs With Big Token Counts

Join Scott and CJ as they dive into the fascinating world of AI, exploring topics from LLM token sizes and context windows to understanding input length. They discuss practical use cases and share insights on how web developers can leverage larger token counts to maximize the potential of AI and LLMs. Show Notes 00:00 Welcome to Syntax! 01:31 Brought to you by Sentry.io. 02:42 What is a token? Quizgecko GPT-4 Token Counter. 04:22 Context window sometimes called “max tokens”. OpenAI Platform Models. Claude Models. 10:42 Understanding input length. 11:59 Models + services with big token counts. Gemini Docs. 13:22 Generating open API documentation for a complex API. 17:29 Generating JSDoc style typing. Drop-In stolinski GitHub. 21:07 Generating seed data for a complex database. bytedash w3cj GitHub. 24:34 Summarizing 8+ hours of video. 29:35 Some things we’ve yet to try. 31:32 What about cost? Google AI for Developers Cost. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads CJ: X Instagram YouTube TwitchTV Randy: X Instagram YouTube Threads

1 Heinä 202433min

788: Supabase: Open Source Firebase for Fullstack JS Apps

788: Supabase: Open Source Firebase for Fullstack JS Apps

Scott and CJ chat with Paul Copplestone, CEO and co-founder of Supabase, about the journey of building an open source alternative to Firebase. Learn about the tech stack, the story behind their excellent documentation, and how Supabase balances business goals with open-source values. Show Notes 00:00 Welcome to Syntax! 00:30 Who is Paul Copplestone? 01:17 Why ‘Supa’ and not ‘Super’? 02:26 How did Supabase start? 04:29 How long from inception to joining Y Combinator? 05:10 Was it always intended to be open source? Why Open Source. 07:22 How many users chose to self-host? 07:49 Open source mindset. 08:42 Simplicity in design. 10:32 How do you take Supabase one step beyond the competition? 12:35 How do you decide which libraries are officially supported vs community maintained? 15:17 You don’t need a client library! 16:48 Edge functions for server-side functionality. 18:51 The genesis of pgvector. 20:59 The product strategy. 22:25 What’s the story behind Supabase’s awesome docs? 25:26 The tech behind Supabase. 25:39 What is the UI built on? 27:33 Consolidation follows kaizen. 28:54 What else is involved in the stack? 31:47 Authentication. 32:35 Storage engine. 33:13 For self-hosting. 35:46 How do you balance business goals with open source? 42:01 What’s next for Supabase? 44:15 Supabase’s GA + new features. Top 10 LAunches from Supabase GA Week. 48:24 Who runs the X account? 50:39 Sick Picks + Shameless Plugs. Sick Picks Paul: Apple Vision Pro. Shameless Plugs Paul: PostgreSQL. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads CJ: X Instagram YouTube TwitchTV Randy: X Instagram YouTube Threads

28 Kesä 202453min

Suosittua kategoriassa Politiikka ja uutiset

tervo-halme
aikalisa
rss-ootsa-kuullut-tasta
ootsa-kuullut-tasta-2
politiikan-puskaradio
viisupodi
rss-kuka-mina-olen
otetaan-yhdet
rss-podme-livebox
et-sa-noin-voi-sanoo-esittaa
rikosmyytit
rss-vaalirankkurit-podcast
rss-kaikki-uusiksi
rss-hyvaa-huomenta-bryssel
rss-asiastudio
io-techin-tekniikkapodcast
radio-antro
rss-merja-mahkan-rahat
rss-tasta-on-kyse-ivan-puopolo-verkkouutiset
rss-poliittinen-talous