--- title: "Why I found it hard to learn React" publication: "React Status" issue: 145 published_at: "2019-07-03" canonical_url: "https://react.statuscode.com/issues/145" --- This week's React news #145 — July 3, 2019 [Read on the Web](https://react.statuscode.com/issues/145) React Status Your weekly React news digest, every Wednesday [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/v1562157997/yktkuzx8zyuwkcbtsjhw.jpg)](https://snook.ca/archives/javascript/difficulty-with-react) ['Why Did I Have Difficulty Learning React?'](https://snook.ca/archives/javascript/difficulty-with-react) — Posts where popular Web developers admit that they don’t always find things simple always seem to go down well.. Brad Frost [wrote about this last year.](http://bradfrost.com/blog/post/my-struggle-to-learn-react/) This time, Jonathan Snook tries to tease out just _why_ it took so long to feel comfortable with React. Jonathan Snook [How We Built A Component Library People Enjoy Using](https://medium.com/styled-components/how-to-build-a-great-component-library-a40d974a412d) — The tale of how a few engineers at Sprout built a design system and component library using [Styled Components](https://www.styled-components.com/). A must-read if you’re working on a similar undertaking. Chase McCoy [![\](https://copm.s3.amazonaws.com/3a4d67df.png)](https://segment.com/docs/sources/mobile/react-native/?utm_source=newsletter&utm_medium=email&utm_campaign=reactnl) [Simplify Customer Data with a Single API](https://segment.com/docs/sources/mobile/react-native/?utm_source=newsletter&utm_medium=email&utm_campaign=reactnl) — Integrate 250+ tools with the flip of a switch. Power your entire tech stack with the same data. Segment is all you need — in one tool. Segment sponsor ▶[Speed Coding a Tinder-Like React App in 59 Minutes](https://www.youtube.com/watch?v=wLGM04oi_wE) — I always love to see how other developers approach new projects, and you might learn something from this attempt too. Karl Hadwen [react-movable 2.2: Drag and Drop for Lists and Tables](https://github.com/tajo/react-movable) — Vertical drag and drop for lists and tables with no additional markup needed. Accessible and touch device friendly, and several key releases recently with features like being able to [remove items by dragging them out of bounds](https://github.com/tajo/react-movable/releases/tag/v2.2.0). Want to try it out? [Live demos here.](https://react-movable.netlify.com/) Vojtech Miksu ['I Think We Need to Rethink How Focus Works in React.'](https://github.com/facebook/react/issues/16009) — An interesting thread on the official React GitHub repo about exploring new approaches to ‘focus’ (in the sense of elements or controls having focus in a UI). Dominic Gannaway et al. 💻 Jobs [React Developer at X-Team (Remote)](https://x-team.com/remote-react-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=react) — Join the most energizing community for developers. Work from anywhere with the world's leading brands. X-Team [Land a New Dev Job on Vettery](https://www.vettery.com/tech?utm_source=newsletter&utm_medium=cooper-reactstatus&utm_term=tech&utm_content=grouped&utm_campaign=ad-77585) — Vettery specializes in tech roles and is completely free for job seekers. Vettery 📘 Tutorials and Stories [Avoiding Derived State in React](https://benmccormick.org/2019/06/24/derived-state) — _“Deriving state at render time and using memoization to keep it performant where needed should help you tame any derived state problems you encounter.”_ Ben McCormick [Building Reusable Components](https://buttercms.com/blog/building-reusable-components-using-react) — A brief, introductory look at making a component more reusable by making it more generic and less tied to specific logic. Nirmalya Ghosh [Learning About React Hooks and the Context API by Building a Recipe Search App](https://dev.to/mongopark/let-s-learn-react-hooks-and-context-api-by-building-a-recipe-search-app-39pc) Ola John Ajiboye [📕 20 Patterns to Watch for in Engineering Teams](https://resources.gitprime.com/books/20-patterns/?utm_source=nl%28rs%29&utm_medium=email-nl&utm_campaign=nl%28rs%29) GitPrime sponsor [How to Build An Anonymous Chat App with React Bootstrap and Cometchat](https://www.cometchat.com/tutorials/build-an-anonymous-chat-app-with-react-react-bootstrap/) — [Cometchat](https://www.cometchat.com/) is a commercial service for building chat apps, though it’s free up to a certain level. Idorenyin Obong (Cometchat) [Forget About Component Lifecycles and Start Thinking in Effects](https://sebastiandedeyne.com/forget-about-component-lifecycles-and-start-thinking-in-effects/) Sebastian De Deyne [Five Android and iOS UI Design Guidelines for React Native](https://www.infoq.com/articles/ios-android-react-native-design-patterns/) — Why UI designers should follow platform specific guidelines while designing for multiple platforms. Rakshit Soral 🔧 Code and Tools [React-Select: A Flexible Select Input Control](https://react-select.com/home) — With multiselect, option group, animation, and autocomplete support. [GitHub repo.](https://github.com/JedWatson/react-select) Jed Watson [RIFM: Transform Any Input Component Into Formatted or Masked Input](https://github.com/istarkov/rifm) — A way to transform input components into formatted/masked inputs. Ivan Starkov [Fast, Intuitive Project Management Tool for Software Teams](https://clubhouse.io/?utm_source=cooperREACT&utm_medium=spon_nl&utm_campaign=jul2019&rsCode=REACTSTATUS) — Clubhouse is simple and flexible. Integrates with GitHub, GitLab, Slack, and more. Offers a powerful API. Try it free. Clubhouse.io sponsor [React Compound Slider: A 4KB Slider Component](https://github.com/sghall/react-compound-slider) — _“a stable platform for creating slider components with a very small impact on bundle size.”_ By ‘slider components’ it means components [like these](https://sghall.github.io/react-compound-slider/#/slider-demos/horizontal) for defining ranges or picking values from a range. Steve Hall [Rest Hooks: Delightful Data Fetching for React](https://github.com/coinbase/rest-hooks) Coinbase [React-PhoneNr-Input: An Intuitive Phone Number Input](https://github.com/KaiHotz/React-PhoneNr-Input) — .. with a country selector for international and national phone numbers. Kai Hotz 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