RRU 043: Testing React Apps Without Testing Implementation Details with Kent C. Dodds

Panel: Nader Dabit Special Guests: Jared Palmer In this episode of React Round Up, the panel discusses Razzle and other projects with Jared Palmer. Jared is the lead engineer at The Palmer Group, where he spends his time building apps and services for companies that have been underserved by the recent technological changes. They talk about what Razzle is, the benefit of server-side rendering, and the difficulties he faced putting this project together. They also touch on why he chose to create Razzle and some of his other projects like Backpack and After.js. In particular, we dive pretty deep on: Jared introHow he got into programmingFell into programming by accidentWhat is Razzle?Create React App with server-side renderingGatsbyGoal of RazzleWhat are the benefits of adding server-side rendering?The power of ReactNext.jsReact can hydrate once it renders on the serverRazzle is thin layer around 2 Webpack watch tasksHow do you handle routing?React RouterAfter.jsPerformance pros to server-side renderingIs an app built in Razzle still considered a single-page application?React ResolverWhat were the technical difficulties putting Razzle together?Why made you want to create this?Wanted direct control over the projectBackpackAnd much, much more! Links: The Palmer GroupRazzleCreate React AppGatsbyReactNext.jsWebpackReact RouterAfter.jsReact ResolverBackpackThe Palmer Group GitHubJared’s MediumJared’s GitHub@jaredpalmer Sponsors Kendo UIDigital OceanFreshBooks Picks: Nader Proton Native Jared Guess.jsGardenSpecial Guest: Jared Palmer. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

5 Kesä 201848min

Panel: Charles Max Wood Special Guests: Matt Hernandez and Amanda Silver In this episode, the JavaScript Jabber panelists discuss Visual Studio Code and the VS Code Azure Extension with Matt Hernandez and Amanda Silver at Microsoft Build. Amanda is the director of program management at Microsoft working on Visual Studio and VS Code. Matt works on a mix between the Azure and the VS Code team, where he leads the effort to build the Azure extensions in VS code, trying to bring JavaScript developers to Azure through great experiences in VS Code. They talk about what’s new in VS Code, how the Azure extension works, what log points are, and much more! In particular, we dive pretty deep on: Amanda introMatt introWhat’s new in VS Code?VS Code coreVS Live ShareShared TerminalNow have Linux supportLive Share is now public to the world for freeWhat would you use Shared Terminal for?Are there other things coming up in VS Code?Constantly responding to requests from the communityLive Share works for any languageHow does the Azure extension work?Azure App ServiceStorage extensionAzure Cosmos DBWhat are log points?All a part of a larger plan to create a better experience for JS developersVisual debuggersIs it the same plugin to support everything on Azure?Want to target specific services that node developers will take advantage ofAnd much, much more! Links: Visual StudioVS CodeAzureLive ShareAzure Cosmos DBMicrosoft BuildAzure App ServiceAmanda’s GitHub@amandaksilverMatt’s GitHub@fiveisprime  Picks: Charles Orphan BlackShout out to VS Code teamBattle of the Books  Matt The Customer-Driven Playbook by Travis LowdermilkThe Speed of Trust by Stephen M.R. CoveyYes, And by Kelly LeonardDigital Marketing For Dummies by Ryan DeissEd Gets His Power Back Kickstarter  Amanda Microsoft Quantum Development Kit for Visual Studio CodeIggy Peck, ArchitectTek by Patrick McDonnellSpecial Guests: Amanda Silver and Matt Hernandez. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

29 Touko 201850min

Panel: Nader Dabit Special Guests: Paul Gray In this episode of React Round Up, the panel discusses the future of higher order components and render props with Paul Gray. Paul is a software developer at an educational technology company called Learning Objects. They have a learning platform there that helps instructional designers create better contents. They talk about how he got into programming and React, when you would want to use HOCs and render props, and chainable components. In particular, we dive pretty deep on: Paul introReactHow long have you been working with React?How did you get into programming?TI-89 Calculators in high schoolSoftware engineering degree in collegeBig fan of HOCs when they came outChainable componentsChainable components APIPromisesAnatomy of render prop componentsTypeScriptasync/await GitHub GistUse casesTool to share reusable code in ReactHow long has this been in the works?With StateMappChain functionFunctional ProgrammingFunctional Programming in Scala by Paul ChiusanoAnd much, much more! Links: Learning ObjectsReactChainable componentsTypeScriptasync/await GitHub GistFunctional Programming in Scala by Paul ChiusanoPaul’s GitHubPaulGray.net Picks: Nader Viro ReactExpo blog Paul The Great Interior Design ChallengeLittle Tikes Red CarSpecial Guest: Paul Gray. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

22 Touko 201836min

Panel: Charles Max WoodCory House Special Guests: Lucas Reis In this episode of React Round Up, the panel discusses simple React patterns with Lucas Reis. Lucas works as a senior front-end developer at Zocdoc and previously worked in Brazil for an ecommerce company called B2W. He recently wrote a blog post about simple React patterns that really took off and became popular on the web. They talk about this blog post, what defines a successful pattern, and then they discuss the different patterns that he has discovered in his years of React programming. In particular, we dive pretty deep on: Lucas introTries to write blog posts as much as possibleSimple React Patterns blog postReactWhat does he mean by “successful” patterns?Three things that define good patternsDefine successful?The mix componentThe Container/Branch/View patternFirst successful pattern he has foundSeparation of concernsCommon concern: are we worried about mixing concerns?If/elseCan you encapsulate in the view?Pattern matchingReact loadableYou need to think of 3 states at leastHigher-order componentRender propsAnd much, much more! Links: ZocdocB2WSimple React Patterns blog postReactSimple Made Easy by Rich HickeyLucas’s GitHubLucas’s Blog@iamlucasreis Picks: Charles FullContactUdemy Cory Fluent confImmer Lucas PercyBe studying the languages and be inspired!Special Guest: Lucas Reis. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

16 Touko 20181h 1min

Panel: Cory HouseNader Dabit Special Guests: Samuel Mendenhall In this episode of React Round Up, the panel discusses best practices with React and Redux with Samuel Mendenhall. Samuel has been working in web development for the past five years and was recently working for Red Hat. They talk about what has led him to React, as well as some of the most common mistakes that people make in React. They also talk about the amazing power of TypeScript and when you may not want to use Redux. In particular, we dive pretty deep on: Sam introjQuery, Backbone, and AngularReact and React NativeNew role at Microsoft in commercial software engineering groupWorking a lot with React and toolingWhat have you learned since working with React?Shallow learning curveThe concept of React is very simpleWhat work did you do at Red Hat?Internal toolingWhat are some common mistakes people have made in React?Defensive programmingMaking sure functions are bound correctlyHe’s an advocate for using TypeScriptThe pros of using TypeScriptConnect in ReactConnect will do shallow comparisonsReduxWhen you shouldn’t use ReduxWhen should Redux be used in a project?MobXAnd much, much more! Links: jQueryBackboneAngularReactRed HatReact NativeTypeScriptReduxMobX@engineersamwellSam’s GitHub Picks: Cory Transform.now.shPlop js Nader React Amsterdam YouTubeAWS AppSyncAWS Amplify Sam WebpackSpecial Guest: Samuel Mendenhall. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

8 Touko 201851min

Panel: Charles Max WoodTara Manicsic Special Guests: Dave Ceddia In this episode of React Round Up, the panel discusses hot reloading with Create React App with Dave Ceddia. Dave is a React developer, blogs about React, and recently wrote a book called Pure React. They talk about what hot reloading is, when you would want to use it, and how you can set it up in your code. They also touch on ways to customize Create React App, the disadvantages to customizing, and the key points to understand about Create React App before modifying it.  In particular, we dive pretty deep on: Dave introWhat is the big picture behind hot module reloading?Create React AppWebpackHow do you set this up?You don’t need to ejectIs there a certain point when you need to start taking advantage of hot reloading?Helps to use hot reloading from the beginningResources to help with using hot reloadingDave articleReact app rewiredAre there any changes you can make that won’t hot reload?Full page refreshesWhy did Create React App not have this from the beginning?Having a skeleton that you can breakWebpack HMR vs React-Hot-Loader by Mark Erikson Event handlersAre there other ways you can customize Create React App?SassKey points to Create React App to understandTry to avoid modifying it if you canAnd much, much more! Links: ReactDave’s BlogPure React by Dave CeddiaCreate React AppWebpackDave articleReact app rewiredWebpack HMR vs React-Hot-Loader by Mark EriksonSass@dceddiaDave’s GitHubDevChat.tv PatreonDaveCeddia.com/RoundUp Picks: Charles Star RealmsVailIf you have an idea about a podcast, he is willing to hear them outJavaScript YouTube videos to come at DevChat.tv YouTube Tara Patreon Dave React BostonIndie HackersSpecial Guest: Dave Ceddia. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

1 Touko 20187min

Panel: Tara ManicsicNader Dabit Special Guests: Joe Eames In this episode of React Round Up, the panel discusses The Framework Summit with Joe Eames. Joe discusses the history behind the conference and how it came to be created. They really wanted to create a conference that would include all of the frameworks, especially those that are underrepresented in the programming community, like React. He touches on why he is passionate about this project, why it is important to be open to learning new things, and the overall format of the conference. In particular, we dive pretty deep on: The Framework SummitOctober 2-3, 2018 in Park City, UtahThe history of the conferenceReact Originally called the “Tri-conference”Frameworks play a major part in your code development“Religiousness” of which framework is the “right” or “wrong” one to useOpportunity to expose more people to new frameworksComparing the frameworksThe importance of being willing to learn new thingsBursting “thought bubbles”Being open to changeMerging communities and creating open dialogueFormat of the conferenceBoth single-track and multi-trackElmVueAngularGreat lineup already and it’s getting betterWebflowNovel and unique talksWhat not to do when submitting talksAnd much, much more! Links: ReactThe Framework SummitElmVueAngularWebflow@FrameworkSummit Picks: Tara Vue VixensngGirls Nader ViroReact Joe The 2018 Web Developer Roadmap by Brandon MorelliRole playing games - My Little PonySpecial Guest: Joe Eames. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

24 Huhti 20181h 1min

Panel: Charles Max WoodNader DabitCory HouseKent C Dodds Special Guests: David Atchley In this episode of React Round Up, the panel discuss breaking up with higher-order components with David Atchley. David has been doing software development for 24 years now and has worked mostly in web development. He has worked at many places from start-ups to large companies and does client work currently for Tandem.ly. They talk about what higher-order components and render props are and when you would want to use them to help you in your code. They also touch on overuse and misuse of applications and coding tools and the difference between using render props and HOCs. In particular, we dive pretty deep on: David introWhat are higher-order components?What are render props?Higher-order components are patterned after higher-order functionsConnect from React ReduxReactWhat are the use cases for higher-order components?ReduxWould you suggest writing a render prop instead in certain situations?Deciding to use a HOC or a render prop depends on the situationThink critically about the applications you are usingKent’s Advanced React Component Patterns Egghead CourseDifference between render props and HOCsBuild an HOC out of a render prop if you want to share codeContext API from ReactConcern with new Context APIProblem with overuseHow do you help people avoid overuse and misuse?Unstated library by James KyleStart developing code at the local levelReact NativeAnd much, much more! Links: Tandem.lyReactReduxKent’s Egghead CourseContext API from ReactUnstated library by James KyleReact NativeDavid’s GitHub@Tuxz0rTandem.ly Medium Picks: Charles I’d Pay You $500,000 a Year, but You Can’t Do the Work by Shelly PalmerLiars by Glenn Beck Cory CodeSandbox LiveBabel replReact Cheat SheetFluent Conf Nader Shoe Dog by Phil KnightNader’s Blog Post Kent Answers to common questions about render props blog postReact’s new Context API blog postReact ComposerBrandon SandersonCodeSandbox Live David React, Inline Functions, and Performance by Ryan FlorenceBuild Better Products by Laura KleinSpecial Guest: David Atchley. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

17 Huhti 201812min