--- title: "A Tour of React's Render Props Pattern" publication: "React Status" issue: 100 published_at: "2018-08-10" canonical_url: "https://react.statuscode.com/issues/100" --- This week's React news #100 — August 10, 2018 [Read on the Web](https://react.statuscode.com/issues/100) react status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/vrxe4hdm4ltmhwxdv9cx.jpg)](https://github.com/gpbl/react-day-picker) [react-day-picker: A Flexible Date Picker Component](https://github.com/gpbl/react-day-picker) — No external dependencies. Fully customizable, with ARIA support. There are [lots of live examples here.](http://react-day-picker.js.org/examples/basic/) Giampaolo Bellavite ['I Created The Exact Same App in React and Vue. Here Are The Differences.'](https://medium.com/javascript-in-plain-english/i-created-the-exact-same-app-in-react-and-vue-here-are-the-differences-e9a1ae8077fd) — A developer went through the process of implementing the same app with React and Vue to get a feel for how they differ - if you fancy learning what he did without doing it for yourself, this is a must read. Sunil Sandhu [![\](https://copm.s3.amazonaws.com/8bf7d043.jpg)](https://segment.com/product?utm_source=reactnl&utm_medium=emailspn&utm_campaign=brand&utm_content=prod) [Stop Tedious Integrations. Track Data Once, Send Anywhere](https://segment.com/product?utm_source=reactnl&utm_medium=emailspn&utm_campaign=brand&utm_content=prod) — Add Segment to your app and send event data to any tool without having to learn, test, or implement a new API every time. Segment sponsor [A Scalable File Structure for React and Other Projects](http://react-file-structure.surge.sh/) — The co-author of Redux’s advise on file structure for React apps is surprisingly short and sweet: do what feels right. Dan Abramov on Twitter ▶[The State of React Native, Five Years In](https://www.youtube.com/watch?v=83ffAY-CmL4) — At around five years old, here’s a look at the current state of play for React Native. Upcoming changes are also covered. Ram N [A Tour of React's Render Props Pattern](https://www.robinwieruch.de/react-render-props-pattern/) — By way of a tutorial focused on building a currency conversion tool you’ll get to learn everything about React’s render prop pattern. Robin Wieruch [Using Data in React with the Fetch API and Axios](https://css-tricks.com/using-data-in-react-with-the-fetch-api-and-axios/) — As you build React apps, you will run into lots of scenarios where you want to handle data from an API — here’s a look at how. Kingsley Silas 💻 React Jobs [Build High Quality Open-Source at Uber (San Francisco)](https://www.uber.com/careers/list/40899/) — As a Web Platform engineer at Uber, you'll be building the foundation for all web applications at Uber and beyond. Uber [Find A React Job Through Vettery](https://www.vettery.com/tech?utm_source=newsletter&utm_medium=cooper-reactstatus&utm_term=tech&utm_content=grouped&utm_campaign=ad-77585) — Create a profile to connect with 4,000+ companies seeking top tech talent. Vettery 📘 Tutorials [React OAuth Authentication with Firebase](https://blog.bitsrc.io/react-oauth-authentication-with-firebase-dfe0e8c5d0d4) — Building a React app with Firebase to consume OAuth Authentication with GitHub, Twitter and Facebook. Esau Silva [Pass Multiple Children to a React Component with Slots](https://daveceddia.com/pluggable-slots-in-react-components/) — You can pass JSX into _any_ prop, not only the one named `children`, and not only by nesting JSX inside a component’s tag — and it can simplify data passing and make components more reusable. Dave Ceddia [Build a Netflix Style Video Delivery Platform](https://developer.bitmovin.com/hc/en-us/articles/115001117733?utm_source=cooperpress&utm_medium=email&utm_campaign=react) — Play videos at the same quality & speed as Netflix & YouTube. API clients for all major languages. Bitmovin sponsor [How to Pass Props to Components in React](https://www.robinwieruch.de/react-pass-props-to-component/) — _“Everyone who is new to React is confused by these so called props, because they are never mentioned in any other web framework, and rarely explained on their own.”_ Robin Wieruch [How to Display a List in React](https://daveceddia.com/display-a-list-in-react/) — You’ve got a list of items you want to appear on screen, but what’s the “React way” to do this? Dave Ceddia [Reduce Unit Test Boilerplate with Jest’s .each Syntax](https://itnext.io/reduce-unit-tests-boilerplate-with-jests-each-syntax-f5e48828437f) Marios Fakiolas ▶[10 Things to Know About ES6 Before Learning React](https://www.youtube.com/watch?v=UweDK_imADU) — Some ES6 features to know before learning React, such as arrow functions, rest parameters and template literals Carlos Mafla 🔧 Code ▶[An Introduction to React Form Validation with HocForm](https://www.youtube.com/watch?v=40vLRGOfmBU) — [Associated repo here](https://github.com/pacdiv/hoc-form). Pacdiv [react-loadable: A Higher Order Component for Loading Components with Promises](https://github.com/jamiebuilds/react-loadable) — [Version 5.5.0](https://github.com/jamiebuilds/react-loadable/releases/tag/v5.5.0) just dropped. Jamie Kyle [React Timekeeper: A Google-Inspired Time Selector](https://catc.github.io/react-timekeeper/) — Based on the style of the Android Google Keep app. Catalin Covic [Move Fast and Fix Stuff. Over 500K Developers Fix Errors with Sentry](https://start.sentry.io/for/react?utm_source=advertisement&utm_medium=display&utm_content=reactstatus&utm_campaign=sponsorship&utm_term=brief) Sentry sponsor [ReactSimpleFlexGrid: Quickly Add a Flexbox-Based Grid Layout to Your App](https://github.com/abraztsov/ReactSimpleFlexGrid) Nikita Abraztsov [react-window: Components for Efficiently Rendering Large Lists and Tabular Data](https://github.com/bvaughn/react-window) Brian Vaughn [react-image-appear: A Component to Show a Loading Animation as an Image Loads](https://github.com/ArunMichaelDsouza/react-image-appear) Arun Michael Dsouza A **[Cooperpress](https://cooperpress.com/)** publication. [Change your email address](https://react.statuscode.com/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://react.statuscode.com/leave/*|UID|*) © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom