React Podcast

David Khourshid is the man bringing statecharts to the frontend. We talk about XState, model-based testing with xstate-test, and the future designer/coder integration For the month of february, we're chatting exclusively with Reactathon speakers. You can hear more from David on the topic state-charts for UI development this march. Reactathon is a top React conference in the heart of San Francisco. David and I will be there, chewing people's ears off about better designer tooling. Get a ticket at reactathon.com. Featuring David Khourshid — Twitter, GitHub, CodePen chantastic — Twitter, Website, GitHub Links XState XState Docs XState Visualizer Redux Constructing the User Interface with Statecharts by Ian Horrocks on Amazon Statecharts: A Visual Formalism for Complex Systems by David Harel Welcome to the world of Statecharts by Erik Mogensen RxJS Lodash Finite-state machine on Wikipedie State diagram on Wikipedie SCXML — State Chart XML on Wikipedia mukeshsoni/statechart-calculator A javascript calculator

Today we chat with Becca Bailey about Refactoring — how to make your React code a little more liveable, human-friendly, and ready for anything. You can hear more from Becca this march, on finding joy in refactoring. Reactathon is a top React conference in the heart of San Francisco. Becca and I will be there, passing out high fives and excited to meet you. Get a ticket at reactathon.com. Featuring Becca Bailey — Twitter, Website, GitHub chantastic — Twitter, Website, GitHub Links Formidable The State of React State in 2019 | Becca Bailey Shape Up: Stop Running in Circles and Ship Work that matters Refactoring: Improving the Design of Existing Code Testing JavaScript with Kent C. Dodds The different types of tests — Atlassian React Testing Library Enzyme Jest Snapshot Testing React Concurrent Mode "for each desired change, make the change easy (warning: this may be hard), then make the easy change" — Kent Beck ESLint Sarah Mei — The Power of Agile Konmari Your Code: Finding Joy in Refactoring — B

Today we chat with Evan Bacon about Expo and delivering on the elusive promise of "write once. run anywhere." For the month of february, we're chatting exclusively with Reactathon speakers. You can hear more from Evan on the topic of using Expo for universal React development this march. Reactathon is a top React conference in the heart of San Francisco. Evan and I will be there, having a good time and happy to chat with you. Get a ticket at reactathon.com. Featuring Evan Bacon — Twitter, GitHub, YouTube chantastic — Twitter, Website, GitHub Links Life Size Lego Thor Build! Expo — The fastest way to build an app @expo/electron-adapter @expo/next-adapter Platform Specific Code ErrorRecovery Camera Video James Ide Brent Vatne React Native Software Mansion React Native for Web by icolas Gallagher StyleSheet.create react-native-dom microsoft/react-native-windows —  A framework for building native Windows apps with React Metro —

Today we chat with Daria Caraway and learn how to build considerate React components with TypeScript. For the month of february, we're chatting exclusively with Reactathon speakers. You can hear more from Daria on this topic of developing considerate React components on the Reactathon this march. Reactathon is a top React conference in the heart of San Francisco. Daria and I will be there, high-fiving people and having a good time. Get a ticket at reactathon.com. Featuring Daria Caraway — Twitter, Website chantastic — Twitter, Website, GitHub Links workday PropTypes TypeScript Interfaces Utility Types Partial Pick Any Unkown Declaration Files flow Visual Studio Code WebStorm CoffeeScript DefinitelyTyped How to Have an Amicable Breakup With A JavaScript Library | Daria Caraway | CascadiaJS 2019 on YouTube Intergration Babel: @babel/preset-typescript Webpack: ts-loader React & Webpack guide Forking vs Spooning — A snippet from Jafar Hussain's React.js Conf 2015 talk Beyond the DOM: How Netflix

Conferences are a big part of the React ecosystem. This year, there's a conference that stands out from the rest: Render(ATL). Render(ATL) is a new conference in Atlanta that promises to introduce React developers to the voice and culture of the south. Today we sit with Justin E. Samuels to hear his vision for the conference, how much he loves his city, and what amazing things await attendees in Atlanta this year. Featuring Justin E. Samuels — Twitter, Instagram, GitHub chantastic — Twitter, Website, GitHub JS and React Discover the 5 overlooked JavaScript features that separate good and great React developers. Learn these 5 JavaScript patterns for React developers at jsandreact.com Links Render(ATL) — Culture, Inclusion, React Mailchimp Software Engineer Levels at Google, Facebook, and Microsoft from levels.fyi MagnoliaJS Conference Render(ATL) Food "The South Got Something to Say" — Andre 3000 The Gathering Spot ATL DJ Hourglass React Podcast listeners sponsored two attendees: @shanster_242 and

Every few months, I like to explore professions that are adjacent to programming. Today we're exploring captioning and its impact on our industry. Our guide for this industry is the fabulously giften Norma Miller of White Coat Captioning. I was captivated by her work at last year's React Rally and wanted to share with you what I learned from her. Her company does primarily technical events, which gives her an interesting vantage point into tech conference culture. We talk about typing in excess of 300 words a minute with 98% accuracy, The $6000 keyboards that make it little easier, And the open source that powers it. I think you love this chat, as we learn how captioners are making our technical events more multi-cultural, accessible, and inclusive. Featuring Norma Miller — Twitter, Website chantastic — Twitter, Website, GitHub JS and React Discover the 5 overlooked JavaScript features that separate good and great React developers. Learn these 5 JavaScript patterns for React developers at jsandreact.com Wh

We're kicking off a new decade by going back in time time to 1999, just 10 years after the birth of the internet. Our guest today is Lee Byron. He takes us on a tour of the early web and personal home pages. And connects the dots between PHP and technologies like React and GraphQL. His work — inside Facebook during a critical pivot to mobile — provides a unique vantage point on the progress of web technologies over the past 20 years. Featuring Lee Byron — Twitter, Website, GitHub chantastic — Twitter, Website, GitHub JS and React Discover the 5 overlooked JavaScript features that separate good and great React developers. Learn these 5 JavaScript patterns for React developers at jsandreact.com Links Let's Program Like It's 1999 | Lee Byron — from React Conf 2019 Links (web browser) on Wikipedia PHP on Wikipedia LAMP stack on Wikipedia Tim Berners-Lee on w3.org 30 years on, what’s next #ForTheWeb? on webfoundatios.org myspace Internet: A First Discovery Book Hoodie Vaporwave on Wikipedia Hack/XHP JSX Sourc

Today we sit down with award winning cartoonist, a book apart author, web animations expert, new member to the React Core Team, and all round lovely human Rachel Nabors. We talk about her journey to React, the Woman at the Heart of React zine (from this year's React Conf), and her charter to make React and React Native documentation friendly, powerful, and inclusive. Featuring Rachel Nabors — Twitter, GitHub, Website chantastic — Twitter, Website, GitHub Links React Conf 2019 Women at the Heart of React Xyra (Zine Illustrator) Yuzhi Zheng Luna Ruan Flarnie Marchan Sophie Alpert Monica Powell Sara Vieira Greta Strolyte Raquel Candeias Jessica Franco Women at the Heart of React — Zine in the Wild Zines in the wild at React Conf 2019 Stickers and Foil posters @QueerJS in NYC with @waterproofheart Oslo with @elisabethirg @ParissAthena Around React Conf with @waterproofheart, @Zizzamia, and @tanvibhakta_ React Community Stories — In-depth and ongoing profiles on Women at the Heart of React on Medium Sailo

React Core Team member Sunil Pai in the chair today. React is a complicated project. It's open source but lead by facebook. That's a hard pill for many to swollow. But, for it, we get a framework that's battle-tested at facebook scale — every experimental API tested by billions of users. Today, Sunil and I dive into the future of React as a UI framework, how Concurrent mode marks a shift in focus from developer experience to user experience, and what it'll take to finally get better designer tooling for React. Featuring Sunil Pai — Twitter, GitHub chantastic — Twitter, Website, GitHub Links 23: Ditch Authority with Sunil Pai — Previous React Podcast with Sunil Pai Dan Abramov Dominic Gannaway Rachel Nabors Sunil Pai - The “Something” Statements at React Rally useTransition useDeferredValue Umbrella React Flare — the umbrella issue on GitHub #15257 Twitter Lite Do This to Improve Image Loading on Your Website — Jen Simmons on image loading improvements in the browser OOCSS — A CSS architecture by Nicole Sul

I'm so grateful for you. This is just a short thank you from me to you, an update on my React Suspense course, and what you can expect from React Podcast in 2020. Featuring chantastic — Twitter, Website, GitHub Links reactsuspense.com — An ugly site with links to my new React Suspense course and newsletter Sponsors 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 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

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 Su

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

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 Fac

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 Conc

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 g

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 po

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

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 wh

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

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 attenti