---
title: "#52: Writing Scalable React Apps with the Component Folder Pattern"
publication: "React Status"
issue: 52
published_at: "2017-09-01"
canonical_url: "https://react.statuscode.com/issues/52"
---

react status 52   

This week's React news -[Read this on the Web](https://react.statuscode.com/issues/52) 

[react status](https://react.statuscode.com) Issue 52     

[Writing Scalable React Apps with the Component Folder Pattern](https://medium.com/styled-components/component-folder-pattern-ee42df37ec68?utm_source=reactnl&utm_medium=email) — Discover an approach for turning giant components into bite-sized logical pieces and organize them logically using the ‘component folder’ pattern. Donavon West [Number Picture: React Components for Composing SVG Visualizations](http://numberpicture.com/library?utm_source=reactnl&utm_medium=email) — React handles the DOM structure and D3 handles the animations and visuals. [GitHub repo](https://github.com/finnfiddle/number-picture). Finn Fitzsimonscode [🎉 New, Updated: Deep JavaScript Foundations with Kyle Simpson](https://frontendmasters.com/courses/javascript-foundations/) — Join Kyle Simpson, author of the popular “You Don’t Know JavaScript” book series, as he deep dives into JavaScript's core mechanics like scope, closure, this and prototypes ..plus new features in ES6 and more. Frontend Masterssponsored [![\](https://copm.s3.amazonaws.com/4cf37b30.png)](https://frontendmasters.com/courses/javascript-foundations/) [How To Securely Use 'CSS in JS' with React](https://reactarmory.com/answers/how-can-i-use-css-in-js-securely?utm_source=reactnl&utm_medium=email) — CSS-in-JS can be a bit like ‘eval’ for CSS. It’s powerful, but it also makes it easy to shoot yourself in the foot. James K Nelson [Tightly Controlled Textareas: Building Solid Plain Text Editors in React](https://hashnode.com/post/tightly-controlled-textareas-building-solid-plain-text-editors-in-react-cj6yvu6yq00cls5wtrbbkw96d?utm_source=reactnl&utm_medium=email) Sai Kishore Komanduri [Embracing Real-Time Feature Toggling in Your React App](https://techblog.commercetools.com/embracing-real-time-feature-toggling-in-your-react-application-a5e6052716a9?utm_source=reactnl&utm_medium=email) Tobias Deekens [Developing with the Modern App Stack: MEAN and MERN - MongoDB Europe 2017](https://www.mongodb.com/europe17/sessions/129149?utm_source=reactnl&utm_medium=email#search=react&page=1&track=&level=&time=&jmp=cpress&utm_campaign=WW_CP_newsletter_sponsorship_FY17Q3&utm_content=brief&utm_medium=display&utm_source=reactstatus0901) MONGODBsponsored [Discussing Progression, Curiosity, and Burnout with Dan Abramov](https://tylermcginnis.com/podcast/dan-abramov/?utm_source=reactnl&utm_medium=email) — An hour long chat with the creator of Redux. Full transcript included. Tyler McGinnispodcast [Measuring Performance Gains Going From Angular to React](https://medium.com/@guptagaruda/measuring-performance-gains-angularjs-to-react-with-redux-or-mobx-fb221517455?utm_source=reactnl&utm_medium=email) Gupta Garuda [React Navigation Drawer Tutorial](https://shift.infinite.red/react-navigation-drawer-tutorial-a802fc3ee6dc?utm_source=reactnl&utm_medium=email) — How to add a drawer to your React Native app using [React Navigation](https://reactnavigation.org/). Gant Labordenative [react-native-pull-refresh: Custom Pull to Refresh Component for Android](https://github.com/NadiKuts/react-native-pull-refresh?utm_source=reactnl&utm_medium=email) — Lets you use your own custom animation while refreshing. Nadezhda Kutsenkonative [new-component: A CLI Utility for Quickly Creating New React Components](https://github.com/joshwcomeau/new-component?utm_source=reactnl&utm_medium=email) Joshua Comeautools [#1 Way to Detect, Diagnose and Defeat Errors 🏆](https://rollbar.com/reactstatus?utm_source=reactnl&utm_medium=email) — Rollbar detects when code breaks in real-time. Get stack trace and diagnostic data to defeat errors. Rollbartools sponsored [react-map-gl: A Suite of React Components for Mapbox GL JS](http://uber.github.io/react-map-gl/?utm_source=reactnl&utm_medium=email#/) — Check out some [live examples here.](http://uber.github.io/react-map-gl/#/Examples/dynamic-styling) Ubercode [React Dates: A Date Picker from Airbnb](https://github.com/airbnb/react-dates?utm_source=reactnl&utm_medium=email) — An accessible, easily internationalizable, mobile-friendly date-picker library for the web. Airbnbcode [react-markings: For Markdown in Components and Components in Markdown](https://github.com/Thinkmill/react-markings?utm_source=reactnl&utm_medium=email) Thinkmillcode [Reselectie: A Memoized Selector Library for any Immutable Data Structure](https://github.com/ralusek/reselectie?utm_source=reactnl&utm_medium=email) — Smaller and faster than reselect and re-reselect. Tomas Saviglianocode    [Read this issue on the Web](https://react.statuscode.com/issues/52) [See our archives](https://react.statuscode.com/issues) [Stop getting this newsletter](*|UNSUB|*)  

Published by [Cooperpress](https://cooperpress.com/)
Fairfield Enterprise Centre, Lincoln Way, Louth, LN11 0LS, UK