React Podcast

Brian Vaughn joins us for an update on React Developer Tools. We talk about Fast Refresh for the web, New developer convienciences around codemods, And new React Dev Tools features to help you profile, suspend component trees, and find your way around unfamiliar React apps. This chat is guaranteed to help you be a quicker, happier, more productive React developer. Featuring Brian Vaughn— Twitter, Website, GitHub chantastic — Twitter, Website, GitHub Links Introducing the New React DevTools on the React docs Interactive React Dev Tools Tutorial React Developer tooling | Brian Vaughn at React Conf 2019 React Profile Tooling | Brian Vaughn at React Conf 2018 (last year) Fast Refresh on the React Native docs reactjs/react-codemod webpack Metro Parcel Preparing for the Future with React Prereleases — Introduction of React Release Channels Introducing Concurrent Mode (Experimental) useTransition Hook useDeferredValue Hook Progressive Web Animations | Alexandra Holachek at React Conf 2019 Data Fetching With Suspense In Relay | Joe Savona at React Conf 2019 Day 1 Keynote | Yuzhi Zheng at React Conf 2019 G2i G2i is a hiring platform for remote developers devoted exclusively to React and React Native. Check out G2i at G2i.co and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. G2i: We Vet, You Get Hired, It's that Simple. Infinite Red Infinite Red has been designing, shipping and building web and mobile apps for 10 years. They're experts in React Native and host North America's only React Native conference, Chain React, educating thousands of developers all over the world. Start a new project with them, mention this show, and get two free tickets to the Chain React in Portland. Visit reactpodcast.infinite.red

Today we're talking with Kitze about his transition from open source to product, what his development browser Sizzy has taught him about business, and the dangers of our hype-driven development cycles. We discuss what we think is wrong with the culture of web development today and how to keep focused on skills that won't be consumed by designer/developer robots. Featuring Kitze— Twitter, Website, GitHub chantastic — Twitter, Website, GitHub Links React Live — Amsterdam Navigating the Hype Driven Frontend Development World — from React Live 2019 ok-google.io — a list of commands that you can ask Google's voice assistant Twizzy — Focus on messages and tweeting. The timeline can wait Sizzy — The browser for developers and designers React Academy — React and JavaScript workshops with Kitze Nik Graf Sara Vieira RailsBridge — Learn to code or level up with RailsBridge CodeSandbox — The online code editor for React (and others) KITZE - THE PLATFORM ™ (DISS TRACK RAP LYRICS VIDEO 2018 4K ROFL) — on YouTube KITZE - JUNIOR FOR LIFE (10X ENGINEERS DISS TRACK 2019 4K LMAO) — on YouTube GitHub stars won’t pay your rent by Kitze Introducing Sizzy —A tool for developing responsive websites crazy-fast by Kitze ⚡️ From React to an Electron app ready for production by Kitze Sponsors G2i G2i is a hiring platform for remote developers devoted exclusively to React and React Native. Check out G2i at G2i.co and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. G2i: We Vet, You Get Hired, It's that Simple. Clubhouse Clubhouse is project management that brings everyone, on every team, together. They've made all core features completely free for teams with up to 10 users. React Podcast listeners get 2 months free on any paid plan. Get your project back on track at clubhouse.io/react.

In the immortal words of TLC, "Don't go chasing waterfalls". Turns out they're really easy to find in React today. Joe Savona joins us to talk about avoiding waterfalls in your React code. He's here for our 2nd of 6 React Conf 2019 interviews to talk about data-fetching strategies with Suspense. Joe has spent the last year working with the React team in developing a relay-suspense integration for the new facebook.com. He shares the lessons and patterns they've learned and how they're baking great user experience into Relay. Fetch-on-render, fetch-then-render, and Render-as-you-fetch are patterns you'll be hearing more often as Suspense picks up steam. Thankfully, in today's episode Joe helps us navigate that verbiage and determine what our first steps with Suspense should be. Featuring Joe Savona — Twitter, GitHub Michael Chan — Twitter, Website, GitHub Links Data Fetching With Suspense In Relay | Joe Savona — Joe's React Conf 2019 talk on Relay Hooks and Suspense at Facebook Building The New Facebook With React and Relay | Ashley Watkins — Ashley's talk on Relay at Facebook Selective hydration progressive hydration @defer @stream @module Relay — A JavaScript framework for building data-driven React applications Relay Hooks — Experimental Concurrent Mode APIs Relay Hooks: A Step By Step Guide Concurrent Mode API Reference Suspense SuspenseList useTransition useDeferredValue Data fetching patterns fetch-on-render fetch-then-render render-as-you-fetch Relay Runtime Relay Compiler Tagged template literals GraphQL Fragments Sophie Alpert — React team manager emeritus Yuzhi Zheng — Manager of React and Relay teams Hack — Programming Productivity Without Breaking Things Sponsors Linode Instantly deploy and manage an SSD server in the Linode Cloud. Get a server running in seconds with your choice of Linux distro, resources, and node location. Get a $20 credit when you visit: linode.com/react and use promo code: react2019 at checkout Clubhouse Clubhouse is project management that brings everyone, on every team, together. They've made all core features completely free for teams with up to 10 users. React Podcast listeners get 2 months free on any paid plan. Get your project back on track at clubhouse.io/react.

Today we kick off our first of 6 React Conf interviews. We start with Andrew Clark to learn what this React Conf 2019 means for us — our libraries and apps. He's a core team member who cut his React teeth on the fiber re-write and he's been deep in Concurrent React for 3 years. We chat about future features, prerelease channels, and how Suspense is preparing the way for others to bring cooperative concurrency to their libraries, applications, and frameworks. Featuring Andrew Clark — Twitter, GitHub chantastic — Twitter, Website, GitHub Links 6: Async React with Andrew Clark — Andrew on React Podcast in 2018 27: React Today and Tomorrow with the React Core Team — Our interview with the React Core team in 2018 Sebastian Markbåge — React Core Team Lead React Fiber rewrite React 16 APIs Fragments Hooks Error Boundaries Portals Code-Splitting w/ React.lazy and Suspense Preparing for the Future with React Prereleases — on the React Blog Introducing Concurrent Mode (Experimental) — docs on Concurrent Mode Concurrent Mode API Reference Suspense SuspenseList useTransition useDeferredValue scheduler Andrew Clark: React Suspense — at Zeit Day 2018 Building The New Facebook With React and Relay | Ashley Watkins — Introduction to Progressive and Selective Hydration at Facebook Data Fetching With Suspense In Relay | Joe Savona — Progressive and Selective Hydration at Facebook using Relay Sponsors G2i G2i is a hiring platform for remote developers devoted exclusively to React and React Native. Check out G2i at G2i.co and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. G2i: We Vet, You Get Hired, It's that Simple. Clubhouse Clubhouse is project management that brings everyone, on every team, together. They've made all core features completely free for teams with up to 10 users. React Podcast listeners get 2 months free on any paid plan. Get your project back on track at clubhouse.io/react.

This week is React Conf! And I suspect that Suspense and Concurrent Mode will have a good showing. So — in anticipation and excitement — I asked friend of the show, Swyx, to join me for a Suspense/Concurrent React rundown episode — covering everything you need to know so far and what we hope to see at this year's event. Neither of us have priviliged info. We're just two nerds who like to keep abreast of React's most exciting future feature. Featuring swyx (Shawn Wang) — Twitter, Website, GitHub chantastic — Twitter, Website, GitHub Links STAR Apps: A New Generation of Front-End Tooling for Development Workflows on CSS-TRICKS STAR Apps at SV Code Camp by Swyx JAMStack — A modern architecture — Create fast and secure sites and dynamic apps with JavaScript, APIs, and prerendered Markup, served without web servers Beyond React 16 | JSConf Iceland 2018 Dan Abramov's introduction to Async React (eventually Concurrent React) at JSConf Iceland 2018 Fiber Reconciler doc on reactjs.org React Fiber Architecture — a gist by Andrew Clark A Cartoon Intro to Fiber — a talk by Lin Clark at React Conf 2017 Dan's Tweet on ConcurrentMode and how it informs other React APIs Building The New Facebook With React and Relay — an upcoming talk by Frank Yan and Ashley Watkins on Building The New Facebook With React and Relay Building the New Facebook.com with React, GraphQL and Relay — talk at F8 2019 about facebook.com v2 Relay — A JavaScript framework for building data-driven React applications Apollo Client — A complete state management library for JavaScript apps URQL — Universal React Query Library is a blazing-fast GraphQL client, exposed as a set of ReactJS components Getting Closure on Hooks — Swyx demonstrating a simple mental model for hooks at JSConf.Asia 2019 [Umbrello]React Flare — Github issue for tracking the React DOM implementation of the experimental React Events API React Fire: Modernizing React DOM — Github issue for tracking React DOM modernization React Native for Web — Run React Native components and APIs on the web using React DOM. A library by Nicholas Gallagher Dominic Gannaway — React Core team member working on React Flare and React Fire The Case for React Native Web Singularity A post by Swyx on React Native for Web as a template for a future React developer experience SVELTE — Cybernetically enhanced web apps glimmer — Fast and light-weight UI components for the web With the attention to detail you've come to expect from Ember All you need to know about Ivy, The new Angular engine! — An article that seems to suggest it has everything you need to know about a thing I know nothing about Sponsors Infinite Red Infinite Red has been designing, shipping and building web and mobile apps for 10 years. They're experts in React Native and host North America's only React Native conference, Chain React, educating thousands of developers all over the world. Start a new project with them, mention this show, and get two free tickets to the Chain React in Portland. Visit reactpodcast.infinite.red G2i G2i is a hiring platform for remote developers devoted exclusively to React and React Native. Check out G2i at G2i.co and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. G2i: We Vet, You Get Hired, It's that Simple.

Today we sit with Lara Schenck to discuss CSS Algorithms and my favorite term of the year: Turd Driven Development. She's brilliant, obviously. And It's a real treat to chat with someone who shares my affinity for CSS and a stoic acceptance of how crappy our codebases are. But she offers hope, to teams that prioritize the work of design engineering. Do not miss her talk CSS Algorithms. It's — hands down — my favorite talk of 2019. Featuring Lara Schenk — Twitter, Website, GitHub Michael Chan — Twitter, Website, GitHub Links JSConf US CSS Algorithms at JSConf US 2019 — the one that I saw and is my favorite talk of the year! Other versions at CSSconf.EU, strangeloop, and CSS Day Tales of a Non-Unicorn: A Story About The Trouble with Job Titles and Descriptions — css-tricks Computer Sceince Bootcamp — Lara's exploration into computer science baseCS — Exploring the basics of computer science, every Monday, for a year, with Vaidehi Joshi Semantic Versioning Is CSS a programming language? — Lara's twitter poll from May 2019 Control flow Declarative programming Turd-Driven Development StranglerFigApplication — an evergreen pattern by Martin Fowler Ship of Thesues stylelint — A mighty, modern style linter Larva — PMC's design system How do you see these programming languages? — place your favorite programming languages on a contiuum of "programming" Sponsers Linode Instantly deploy and manage an SSD server in the Linode Cloud. Get a server running in seconds with your choice of Linux distro, resources, and node location. Get a $20 credit when you visit: linode.com/react and use promo code: react2019 at checkout G2i G2i is a hiring platform for remote developers devoted exclusively to React and React Native. Check out G2i at G2i.co and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. G2i: We Vet, You Get Hired, It's that Simple.

This week we sit with Swizec Teller and learn how to get more done in every day. Swizec has an incredible work ethic — regularly blogging, vlogging, live streaming, and writing books on your favorite web technologies React and D3. How does he do all that and keep a full-time job at a startup? Today, we try to find out what his secret is and how to mimic that focus. Featuring Swizec Teller — Twitter, Website, GitHub Michael Chan — Twitter, Website, GitHub Swizec's projects es6cheatsheet.com Nightowls book — Why programmers work at night learnwhileyoupoop — No pressure learning at 2 minutes per day. Start with the basics, become a React 16.3 Data Visualization with d3.js — Mold your data into beautiful visualizations with d3.js React+d3.js — Build data visualizations with React and d3.js Serverless Handbook — Serverless for frontend engineers Other links Rocks, Pebbles, Sand Story — on YouTube ["We would worry less about what others think of us if we realized how seldom they do." — Ethel Barrett Candid @swizec tweets on "income" FIRE movement — on Wikipedia Mr. Money Mustache Peak Performance — by Brad Stulberg and Steve Magness Sun Conure Teachable — Create and sell beautiful online courses podia — The easiest way to turn your passion into income Force multiplication JAMStack Sponsored By: Infinite Red Infinite Red has been designing, shipping and building web and mobile apps for 10 years. They're experts in React Native and host North America's only React Native conference, Chain React, educating thousands of developers all over the world. Start a new project with them, mention this show, and get two free tickets to the Chain React in Portland. Visit reactpodcast.infinite.red Toptal Plug into jobs with top Silicon Valley and Fortune 500 clients. You can work however and wherever like — at a rate that you set. Do you have what it takes to join the world's top 3% of of freelance developers. Get started with Toptal today. Go to toptaljobs.com and take back control of your career.

This week we continue our discussion with Jonathan Cutrell about the future of work. This time, we're talking about teamwork. We tackle a few important questions. How do you invest in a team that is separated by hundreds of miles? How do you find moments to spark trust where serendipity is at a minimum? And how do you make sure everyone is heard and feels good about their work? If you work remote — or hope to work remote — these questions are at the forefront of your mind as you decide whether or not to DM that co-worker or waffle between which emoji expresses your sentiment best. We got you. This episode is brimming with tips and tricks for you. Featuring Jonathan Cutrell — Twitter, Website, GitHub Michael Chan — Twitter, Website, GitHub Links Improve Your Team by Rejecting These Bad Assumptions — The Developer Tea episode that this episode is based on Why Naval Ravikant Thinks Remote Work Is The Future “Never let the future disturb you. You will meet it, if you have to, with the same weapons of reason which today arm you against the present.” — Marcus Aurelius, Medetations Sponsored By: Infinite Red Infinite Red has been designing, shipping and building web and mobile apps for 10 years. They're experts in React Native and host North America's only React Native conference, Chain React, educating thousands of developers all over the world. Start a new project with them, mention this show, and get two free tickets to the Chain React in Portland. Visit reactpodcast.infinite.red And get The Remote Work handbook at remote.infinite.red. Toptal Plug into jobs with top Silicon Valley and Fortune 500 clients. You can work however and wherever like — at a rate that you set. Do you have what it takes to join the world's top 3% of of freelance developers. Get started with Toptal today. Go to toptaljobs.com and take back control of your career. Get 15% off React Day Berlin React Day Berlin is always a hit and they have a terrific speaker lineup this year. Go to reactday.berlin and use the discount code "SpecFM".

This week we sit down with Jonathan Cutrell. He's the host of the beloved podcast Developer Tea and co-found of Spec, the very podcast network that this show belongs to. When podcasters get together and talk. They talk... for hours. So this is part one of a two-parter. Today, we learn from Jonathan's transition from musical performer to developer. We discover how constrained systems like music primed him for life as a developer, and the ways in which all systems being infused with our humanity. We talk about how to keep doing work you love and finding, or creating, a company that will help you do. Featuring Jonathan Cutrell — Twitter, Website, GitHub Michael Chan — Twitter, Website, GitHub Links Spec — The podcast network that Jonathan co-founded. Developer Tea — Jonathan's terrific podcast Chantastic on Developer Tea Part One and Part Two. jQuery MooTools Build Dumb Shit with Sara Vieira — The episode of React Podcast where Sarah reminds to build things we like First, Break All the Rules — The management book Michael Scott had on his desk and talks about workplace autonomy Sponsored By: Level Up Tutorials Become a better web developer with Level Up Tutorials. Become a pro at Animating React. This is the favorite course on adding fast, beautiful, and dynamic animations to your React apps. Buy just this course or Go Pro for videos on Hooks, Styled Components, TypeScript, Gatsby, Vue, and so much more! Toptal Plug into jobs with top Silicon Valley and Fortune 500 clients. You can work however and wherever like — at a rate that you set. Do you have what it takes to join the world's top 3% of of freelance developers. Get started with Toptal today. Go to toptaljobs.com and take back control of your career. Toptal Plug into jobs with top Silicon Valley and Fortune 500 clients. You can work however and wherever like — at a rate that you set. Do you have what it takes to join the world's top 3% of of freelance developers. Get started with Toptal today. Go to toptaljobs.com and take back control of your career.

This week we sit down with Chris Toomey and address all the holy wars: Elm vs React, TypeScript vs JavaScript, product vs development, and even VS Code vs Vim. This is a pragmatic look at how type systems can improve the way you build and talk about product. In the right hands — these tools can make teamwork a dream. But in the wrong hands, well... Let's just listen close and make sure your hands are the right ones. Featuring Chris Toomey — Twitter, Website, GitHub Michael Chan — Twitter, Website, GitHub Links thoughtbot — thoughtbot is a design and development consultancy that brings your digital product ideas to life Giant Robots — A podcast about the design, development, and business of great software UPCASE by thoughtbot — Become an experienced developer and take "junior" out of your title bikeshed — On The Bike Shed, hosts Chris Toomey & Steph Viccari discuss their development experience and challenges at thoughtbot with Ruby, Rails, JavaScript, and whatever else is drawing their attention, admiration, or ire this week 172: What I Believe About Software — A review of thoughtbot's process and the intersection of product management and development GraphQL TypeScript Elm TypeScript + React TALK at Boston React 2019 Building Web Apps with Elm — Craft a reactive Elm web app from start to finish Chris Toomey: React & GraphQL – Bringing Simplicity to Client Side Development — React Boston 2018 GraphQL: Bringing Simplicity And Correctness To A Client Near You (Chris Toomey) — GraphQL Summit 2018 Language Server Extension Guide neovim onivim 204: I Don't Like Rest — 206: No-One Wants to be the Canary — Chris on GraphQL and designing endpoints vs exposing types 58: Eve Porcello on Learning GraphQL Thank You To Our Sponsor: Linode Linode : Instantly deploy and manage an SSD server in the Linode Cloud. Get a server running in seconds with your choice of Linux distro, resources, and node location. Get a $20 credit when you visit: linode.com/react and use promo code: react2019 at checkout Thank You To Our Sponsor: G2i Check out G2i today and get matched with React & React Native roles that are fully remote at companies who are serious about quality engineering. Visit G2i today and click the "for developers" link to find opportunities.