ConTejas Code

Links

- Codecrafters (Sponsor): https://tej.as/codecrafters

- Follow me on X: https://twitter.com/tejaskumar_

- Follow Yoav on X: https://twitter.com/HamatoYogi

- Qwik’s next leap - moving forward together: https://builder.io/blog/qwik-next-leap

- Towards Qwik 2.0: Lighter, Faster, Better: https://builder.io/blog/qwik-2-coming-soon

- Qwik Microfrontends TikTok clone: https://github.com/gioboa/qwik-tiktok-microfrontends

- Qwik-angular: https://github.com/QwikDev/qwik-angular

- Qwik-vue: https://github.com/mizchi/qwik-vue

- Visual copilot v1: https://builder.io/blog/visual-copilot

Takeaways

- Builder.io is a visual headless CMS that allows developers to build websites and sections of websites using a visual editor.

- The Builder.io ecosystem includes tools like Party Town and Mitosis, which help with managing third-party scripts and transforming code for different frameworks.

- Developers can register their own components from their code base in Builder.io and easily connect them to the visual editor.

- Builder.io can be used in collaboration with other CMS platforms and APIs, allowing for flexibility and integration with existing systems. Qwik is becoming an open-source project, detached from Builder.io, to encourage community involvement and contributions.

- Qwik is well-positioned to address Core Web Vitals and improve Interaction to Next Paint (INP) scores.

- Qwik UI and other ecosystem projects enhance the Qwik framework and provide additional functionality.

- Qwik 2.x will introduce improvements such as out-of-order streaming and a better micro-front-end story.

- The concept of Qwik Server Components is being explored, but it may not align with the server-first approach of Qwik.

- Apple's support for PWAs remains a topic of discussion and debate.

Summary

Yoav Ganbar, a developer relations engineer at Builder.io, joins the podcast to discuss the visual headless CMS and its ecosystem. Yoav shares his background and how he ended up at Builder.io. He explains that Builder.io is a visual no-code tool that helps build websites and sections of websites, and it is framework-agnostic. Yoav also introduces the other tools in the Builder.io ecosystem, including Party Town and Mitosis. In this part of the conversation, Yoav Ganbar discusses the Visual Copilot V1 and the ecosystem, the use of Mitosis and Sveltosis in Builder.io, the core principles and unique selling points of Qwik, the implementation and debugging of Qwik, the upcoming Qwik 2.0 and community-driven development, the importance of understanding servers in web development, the journey of learning web development, and a big announcement made by Yoav Ganbar. In this conversation, Yoav Ganbar discusses the announcement that Qwik is becoming an open-source project, detached from Builder.io.

Chapters

00:00 Yoav Ganbar

03:26 Introduction and Background

06:33 Yoav's Journey to Builder

11:26 Builder.io and the Ecosystem

32:45 Mitosis

33:58 Qwik: Core Principles and Unique Selling Points

36:16 Qwik Implementation and Debugging

39:39 Qwik 2.0 and Community-Driven Development

49:14 Builder.io and the Use of Qwik

58:20 The Importance of Understanding Servers in Web Development

1:01:29 The Journey of Learning Web Development

1:02:27 The Big Announcement

1:02:36 Qwik Becoming Open Source

1:03:35 Qwik and Core Web Vitals

1:04:59 Qwik UI and Ecosystem Projects

1:05:56 Moving to Qwik Dev and New Governance Model

1:06:55 Benefits of Open Source and Community Ownership

1:10:27 Improvements in Qwik 2.x

1:15:12 Qwik and Core Web Vitals

1:17:30 Out of Order Streaming in Qwik 2.x

1:24:44 Qwik Server Components

1:28:03 Apple and PWAs

Hosted on Acast. See acast.com/privacy for more information.

Follow me on 𝕏: https://twitter.com/tejaskumar_

Links

- Sentry: https://sentry.io

- Lazar on 𝕏: https://twitter.com/NikolovLazar

In this in-depth podcast episode, we delve into the world of Sentry, a powerful tool designed to enhance software performance and reliability. From the initial introduction to Sentry's comprehensive suite of features, we explore how Sentry instruments a broad array of software, ensuring peak performance and minimal errors. The discussion includes a comparative analysis with TypeScript, highlighting Sentry's unique approach to software instrumentation and its focus on privacy and security.

We further investigate Sentry's capabilities in de-obfuscating code with source maps, offering insights into the nuanced differences between Replay.io, session replay technologies, and Sentry's innovative solutions. The spotlight shines on Sentry's dev-time monitoring, trace propagation within database transactions, and its distinct differentiators that set it apart from competitors. Notably, the episode covers Sentry's report on the most common pitfalls in apps, akin to a Spotify Wrapped but for software errors, providing a deep dive into error and stack proximity reporting with Sentry.

Performance metrics, such as the Apdex score and Core Web Vitals, including Cumulative Layout Shift (CLS), are thoroughly examined, alongside strategies for mitigating CLS and addressing font-related issues like Flash of Unstyled Text (FOUT) and Flash of Invisible Text (FOIT). The episode proposes innovative solutions, such as tree shaking for font glyphs and dynamic font replacement to prevent layout shifts and text visibility problems.

Listeners will gain insights into Sentry's internals, including its architecture, use of Rust, and data storage strategies. The episode also discusses the scale challenges Sentry has overcome and how Sentry employs its own tools for self-monitoring. The conversation concludes with guidance on when to avoid Sentry and reiterates best practices for utilizing Sentry to its full potential, ensuring listeners are equipped with the knowledge to tackle common software performance issues effectively.

Chapters

00:00 - Intro

01:07 - Sponsor

01:51 - Greetings

02:53 - Defining Sentry's Suite of Features

04:43 - How does Sentry instrument a wide variety of software?

09:32 - Sentry compared to TypeScript

12:31 - Sentry and Privacy

16:57 - De-obfuscating Code with Source Maps

19:46 - Replay.io vs. Session Replay and Sentry

21:20 - Sentry Spotlight and Dev-Time Monitoring

25:07 - Propagating a Trace inside a Database Transaction

27:38 - Sentry Differentiators

35:58 - Sentry Report of Most Common Pitfalls in Apps, like Spotify Wrapped but with Sentry

39:42 - Children and error/stack proximity with Sentry reporting

42:22 - The Apdex as a Performance Metric

44:56 - Performance and Core Web Vitals

49:20 - Cumulative Layout Shift (CLS)

54:43 - Where does CLS happen in the rendering process and mitigation steps

58:19 - Fonts as a source of CLS, FOUT (Flash of Unstyled Text), and FOIT (Flash of Invisible Text)

01:05:11 - Free Open Source Project Idea: Tree Shaking for Font Glyphs

01:05:57 - Replacing fonts when loaded to prevent CLS, FOIT, and FOUT

01:08:51 - How Sentry helps with Core Web Vitals

01:11:49 - Sentry Internals: Architecture, Data Stores, Rust

01:17:21 - Scale Problems that Sentry went through

01:19:12 - Does Sentry use Sentry? Sentry on Sentry

01:21:13 - When to Avoid Sentry

01:22:11 - Sentry Salient (Repeating) Best Practices

01:26:10 - Conclusion

Hosted on Acast. See acast.com/privacy for more information.

Follow me on 𝕏 for more: https://twitter.com/tejaskumar_

Links

- Kyle on 𝕏: https://twitter.com/getifyx

- Vella.ai: https://vella.ai

- Codecrafters (sponsor): https://tej.as/codecrafters

- Stately (sponsor): https://stately.ai

Takeaways

- The You Don't Know JS books have been successful, with over 300,000 copies sold across all editions.

- Kyle Simpson decided to move away from the traditional publishing model due to constraints and a desire for more creative freedom.

- Giving away the books for free on GitHub has not negatively impacted sales, and many readers have chosen to support Kyle by purchasing the books.

- Accessibility and making knowledge available to a wide audience are central to Kyle's approach.

- There are multiple pathways to publishing, including traditional publishing, self-publishing, and platforms like Leanpub. Publishing with O'Reilly provides a prestigious reputation and distribution, while self-publishing offers more control and potentially higher royalties.

- Get a Pub is Kyle's publishing assistance service for self-published authors, while Lean Pub is a platform for incremental publishing and distribution.

- Education should be seen as an ongoing journey, and college degrees may become less relevant over time as the industry evolves.

- Gatekeeping in the tech industry can be a barrier for those without formal education, but continuous learning and self-education can bridge the gap.

- Rejection can be a catalyst for personal growth and the pursuit of knowledge, leading to impactful contributions and a deeper understanding of a subject.

- Prioritizing knowledge and learning in the workplace is essential for personal and professional growth, and it's important to find a company that values continuous learning.

- Learning should be seen as a continuous process, with a focus on understanding and deepening knowledge rather than just acquiring new skills.

- Vella.ai is a venture that aims to prioritize user ownership of data and privacy, offering a local-first approach to AI and smart assistants.

In this episode, Kyle Simpson discusses his experience as the author of the You Don't Know JS books and his decision to move away from the traditional publishing model. He shares the status and future plans of the second edition of the books and the impact of giving away the content for free on GitHub. Kyle emphasizes the importance of accessibility and making knowledge available to as many people as possible.

Chapters

- 00:00 Kyle Simpson

- 04:59 Introduction and Background

- 05:59 You Don't Know JS Books

- 09:19 Status and Future Plans of the Second Edition

- 10:13 Published Books in the Second Edition

- 11:40 Books That May Not Be Written

- 13:44 Authoring Experience and Constraints

- 18:20 Giving Away the Book for Free on GitHub

- 29:26 Accessibility and Publishing Dreams

- 31:01 Pathways to Publishing

- 39:44 Publishing with O'Reilly and Self-Publishing

- 41:02 Get a Pub and Lean Pub

- 47:46 Education, Gatekeeping, and Learning

- 50:35 The Role of College and Continuous Learning

- 58:43 Kyle's Rejection from Twitter and the You Don't Know JS Series

- 01:11:45 Prioritizing Knowledge and Learning in the Workplace

- 01:12:15 Becoming Less Employable and Unexpected Challenges

- 01:13:57 The Misunderstanding of Tejas' Contract

- 01:15:12 The Value of Specialization and Experience

- 01:17:54 Learning as a Living Standard

- 01:22:14 The Shift in Valuing Experience in Engineering

- 01:25:16 The Dog Wagging the Tail in Tech

- 01:28:00 Kyle's Venture: Vela.ai

- 01:35:45 The Mission of Vela.ai

Hosted on Acast. See acast.com/privacy for more information.

Follow us on 𝕏: https://twitter.com/tejaskumar_

Dive into the cutting-edge of web development with our latest episode, focusing on SolidJS, React fatigue, and innovative JavaScript technologies. We kick off with an inspirational look at SolidJS, exploring why developers are shifting towards this reactive framework amidst growing React skepticism. Delve into the TC39 proposal for native JavaScript Signals and the burgeoning SolidStart ecosystem, underlining its appeal through ease of contribution compared to React.

We unpack SolidJS documentation and Atila's journey into the project, highlighting the framework's accessibility for newcomers and contrasting it with React's complexity. The discussion extends to implementing Signals in React, evaluating the tangible benefits of performance optimizations, and detailing SolidJS's advantages and potential drawbacks.

Stay tuned for insights into SolidStart's latest developments, the vibrant SolidJS community, and practical advice for migrating from other libraries. Special segments include a spotlight on codemods, the groundbreaking CrabNebula project, and leveraging Tauri with Rust for desktop applications. We explore Rust's benefits, the unique offerings of CrabNebula in DevTools, cloud solutions, and security audits, culminating with ways to engage with CrabNebula's initiatives.

Wrapping up, Atila shares key takeaways on navigating the evolving web development landscape. Whether you're contending with React fatigue, curious about SolidJS, or interested in desktop app development with Tauri and Rust, this episode offers invaluable insights into modern web technologies and their practical applications.

Links:

- Atila on 𝕏: https://twitter.com/atilafassina

- Atila on YouTube:  @AtilaDotIO 

- SolidJS: https://solidjs.com

- CrabNebula: https://crabnebula.dev

- Tauri DevTools: https://devtools.crabnebula.dev

- Tauri: https://tauri.app

Chapters

00:00 - Intro

02:59 - Welcome

04:20 - Getting Inspired about SolidJS

06:59 - React Fatigue: Doubts and Questions about React

10:09 - Signals as Native JavaScript (TC39 Proposal)

12:38 - SolidStart and Ecosystem

21:01 - SolidJS Docs and How Atila Got Involved

24:45 - React is Hard to Contribute To/SolidJS is Easier; Why?

35:23 - Understanding SolidJS for newcomers

40:33 - Signals in React

46:38 - Do the minimal perf gains even matter?

52:56 - SolidJS Pros and Cons

56:45 - SolidStart Developments

01:04:27 - SolidJS Community and Ryan

01:07:39 - Migrating to SolidJS from another library

01:12:28 - Codemods and Kent C. Dodds

01:14:15 - CrabNebula

01:15:57 - Tauri, Rust, and Desktop Apps with JavaScript

01:21:13 - Rust: Benefits and Tradeoffs

01:32:37 - CrabNebula offerings: DevTools for Tauri

01:41:00 - CrabNebula offerings: Cloud

01:42:17 - CrabNebula offerings: Security Audits

01:44:46 - Getting involved with CrabNebula

01:45:57 - Main Takeaway from Atila

01:47:01 - Conclusion

Hosted on Acast. See acast.com/privacy for more information.

Follow me on 𝕏: https://x.com/tejaskumar_

Dive into the fascinating world of computing with our podcast episode titled "How do computers actually work? From electrons to hardware to the web." We unravel the mystery starting from the fundamental building blocks of technology—electrons, and how they power datacenters, to the intricacies of hardware and firmware. Journey through the critical layers of computing, including the OS kernel, CPU operations, memory management, and storage solutions. Security gets its due with an exploration of TPM, setting the stage for a deep dive into software architecture. We break down frontend technologies and backend infrastructure, covering everything from HTML and CSS to cloud computing and network protocols. The episode culminates with a discussion on CI/CD pipelines and the decision-making process in tech development. It's a comprehensive guide for anyone curious about the inner workings of computers and the internet.

Chapters

00:00 - Intro

01:17 - Sponsor

02:47 - Everything is a Stack, with Layers on Layers

04:55 - The Lowest Layer: Subatomic Particles

09:21 - Types of Current: AC and DC (Alternating and Direct Current)

12:36 - How Datacenters use Electricity

15:45 - The Next Layer: Hardware

19:07 - The Next Layer: Firmware

21:46 - The Next Layer: The OS Kernel

24:21 - Diving Deeper: Motherboard

27:59 - The OS Kernel

29:43 - CPU, Threading, Multithreading, Hyperthreading, Clock Speed

36:53 - Memory/RAM, Volatile Memory, Virtual Memory

39:43 - Storage, Hard Drives, Solid State Drives

41:33 - TPM (Trusted Platform Module)

42:59 - The Next Layer: Software

43:46 - Software Architecture

47:08 - Frontend Deep Dive: HTML, HTMX, CSS, TailwindCSS, JavaScript, Accessibility, and Network

59:53 - What happens when data fetching: TCP/IP stack, HTTP and SSL encryption, how data flows over the network and internet

01:12:05 - Receiving a Network Request on the Backend, DNS, Firewalls, Load Balancing, SSL Termination, Reverse Proxies

01:20:38 - Backend Architecture: Caches, Queues, Distributed Systems, Control Plane vs. Data Plane

01:25:44 - Cloud Computing: Virtual Private Clouds (VPCs), Subnets, NATs

01:28:30 - Adjusting Expectations for Frontend and Backend

01:29:34 - CI/CD Pipelines, Webhooks, git-based deploys

01:30:21 - Build it or buy it?

01:31:18 - Conclusion

Hosted on Acast. See acast.com/privacy for more information.

Follow us on 𝕏: https://twitter.com/tejaskumar_

Links

- Sentry: https://sentry.io

- Epic Web: https://epicweb.dev

- Kent's Website: https://kentcdodds.com

- Remix: https://remix.run

Join us in this enlightening episode as we welcome Kent C. Dodds, a renowned figure in the web development community and a dear friend, known for his impactful contributions and innovative teaching methods. Dive deep into Kent's journey, from his initial steps in the tech world to becoming a pivotal voice in modern web development. Explore the evolution of the web, understanding the critical milestones and breaking changes that have shaped its current state. Discover the art of building modern web experiences that surpass user expectations, emphasizing the importance of web performance, and adopting an empathy-driven approach to software development.

Kent shares his insights on why Remix stands out as a premier framework, addressing common challenges like the complexity of Next.js and the intricacies of nested routes. Gain valuable knowledge on making strategic decisions between client and server rendering in Remix, and the practical steps for migrating from Vite/SPA to React Server Components (RSCs) with Remix, highlighting the revolutionary potential of RSCs in enhancing web development.

The conversation takes a personal turn as Kent discusses his experiences creating the wildly successful Epic React course, revealing his approach to course ideation, preparation, and the secret to staying organized amidst a busy schedule. Listen to inspiring stories from Kent's career at PayPal, his influence on his team, and the personal philosophies that contribute to his enduring happiness and success.

Lastly, tackle the daunting task of dealing with legacy code with minimal coverage, offering strategies and insights to navigate and improve upon existing codebases efficiently.

This episode is a treasure trove for developers, educators, and tech enthusiasts alike, filled with practical advice, inspiring stories, and a deep dive into the technologies and methodologies driving forward-thinking web development.

Chapters

00:00 - Intro

01:35 - Sponsor

02:58 - Greetings

03:49 - Kent's Background and Experience

05:53 - How did the Web get to where it is today?

12:56 - Breaking Changes on the Web

20:30 - Building Modern Web Experiences to Meet User Expectations

24:07 - Web performance, spinners and loading state: building for users over developers

33:03 - Empathy Driven Development; Software as an act of Service

38:37 - Why is Remix the best?

50:04 - "Next.js was too complex" explained

56:00 - Nested Routes in Detail

01:07:23 - Lever: Choosing between Client or Server rendering in Remix

01:10:30 - Incrementally Migrating from Vite/SPA to React Server Components (RSCs) with Remix

01:14:12 - React Server Components (RSCs) in Remix

01:25:19 - Server Components and Composability; Kent's new talk on RSCs

01:30:50 - Matt Pocock: how was Epic React an overnight success?

01:34:29 - Hayat Rachi: How do you go through course ideation and prep?

01:36:08 - Artem Zakharchenko: how are you so organized?

01:39:13 - David Sancho: PayPal career, team influence, and why Kent seems happy all the time

01:42:05 - Oluwatobiloba: how do you deal with a legacy code with minimal coverage?

01:44:39 - Conclusion

Hosted on Acast. See acast.com/privacy for more information.

Follow us on 𝕏: https://twitter.com/tejaskumar_

In today's episode, we dive deep into the world of artificial intelligence, starting with a basic understanding of AI and the pivotal role of AI Engineers. We explore the pressing question: "Is AI going to take my job?" and differentiate between answer engines and search engines, highlighting their impacts on how we find information.

Transitioning into web development, our discussion shifts towards CSS, covering advanced topics like view transitions, container queries, the :has selector, dynamic viewport units, and the debate on the necessity of JavaScript (JS) when CSS can offer powerful solutions.

Further, we delve into the latest JavaScript updates, including the introduction of `Object.groupBy`, immutable array methods, and exciting new tools and frameworks like vlt (new npm), Bun, Tauri 2.0, and a discussion on modern JavaScript frameworks including Signals, Qwik, and React Forget, focusing on bundle size optimization.

We also cover significant HTML developments, such as OpenUI, the new `selectmenu` and `popover` elements, the `dialog` element, and HTMX, offering insights into how these advancements are shaping the future of web development.

Wrapping up, we conclude with reflections on the topics covered and their implications for developers and the broader tech community. Join us for an informative journey through the latest in AI and web development.

Links

OramaSearch: https://oramasearch.com

Karpathy's post: https://twitter.com/karpathy/status/1674873002314563584

Rise of the AI Engineer: https://www.latent.space/p/ai-engineer

Perplexity (Answer Engine): https://perplexity.ai

Keel: https://keel.so

KeelGPT: https://chat.openai.com/g/g-0xwNB1Azt-keelgpt

vlt: https://vlt.sh

Bun: https://bun.sh

Tauri: https://tauri.app

OpenUI: https://open-ui.org/

HTMX: https://htmx.org/

Chapters

00:00 - Intro

01:53 - Sponsor

02:43 - AI

05:27 - AI Engineering: What is an AI Engineer?

12:26 - Is AI going to take my job?

22:53 - Answer Engines vs. Search Engines

28:26 - CSS: View Transitions

35:45 - CSS: Container Queries

48:53 - CSS: :has selector

50:41 - CSS: Dynamic Viewport Units

54:22 - CSS: Why not just use JS?

56:27 - JavaScript: Object.groupBy

58:47 - JavaScript: Immutable Array Methods

01:04:31 - JavaScript: vlt (new npm)

01:08:09 - JavaScript: Bun

01:10:47 - JavaScript: Tauri 2.0

01:15:26 - JavaScript: Frameworks, Signals, Qwik, Bundle Size, React Forget

01:31:00 - HTML: OpenUI, selectmenu, popover

01:34:20 - HTML: dialog element

01:37:05 - HTML: HTMX

01:45:31 - Conclusion

Hosted on Acast. See acast.com/privacy for more information.

Follow us on 𝕏: https://x.com/tejaskumar_

This episode is an introduction to the Contagious Code podcast, outlining the motivation behind the show, what listeners and viewers can expect, and how they can get involved. Episodes will air weekly for a season, where there are about 8 episodes total. Then, we will regroup and record another season that will air after a short break. Ideally, we keep episodes rolling, but we'll need to evaluate this in light of temporal and financial budgets.

Chapters:

00:00 Intro

00:40 Motivation

01:37 Podcast Format

02:30 Motivation Part 2

03:57 How to Get Involved

05:14 Sponsorships

06:07 Conclusion

Hosted on Acast. See acast.com/privacy for more information.