--- title: "Creating React components with TypeScript" publication: "React Status" issue: 227 published_at: "2021-02-24" canonical_url: "https://react.statuscode.com/issues/227" --- Plus a conversation with Guillermo Rauch on Next.js. | #227 — February 24, 2021 [Read on the Web](https://react.statuscode.com/issues/227) React Status Your weekly React news digest, every Wednesday [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/v1614163239/t4cgxz4v5mr73r8tx5mq.jpg)](https://semaphoreci.com/blog/next-js-guillermo-rauch) ▶[Discovering Next.js with Guillermo Rauch](https://semaphoreci.com/blog/next-js-guillermo-rauch) — A 35-minute interview with Guillermo Rauch, CEO and co-founder of Vercel, about the React-powered Next.js framework, its benefits for front-end engineers, and where its speed and quality benefits come from. _There's a written transcript too if you'd prefer_. Semaphore Uncut Podcast podcast [How to Create React Components with TypeScript](https://felixgerschau.com/react-typescript-components/) — While TypeScript still doesn't make up the majority of React-related code out there, it's nonetheless increasing in popularity and this tutorial aims to take away the 'fear' of using it by showing how a modest investment of your time can pay dividends in type-safety and autocompletion. Felix Gerschau [![\](https://copm.s3.amazonaws.com/195bc6eb.jpg)](https://launchdarkly.com/the-definitive-guide-to-feature-management/?utm_source=cooperpress&utm_medium=display&utm_campaign=21q1-cooperpress) [The Definitive Guide to Feature Management](https://launchdarkly.com/the-definitive-guide-to-feature-management/?utm_source=cooperpress&utm_medium=display&utm_campaign=21q1-cooperpress) — Feature management is a new class of software development tools/techniques powered by feature flags. A feature management platform like LaunchDarkly fills the gaps of conventional feature toggles. Learn the ins & outs of feature management today. LaunchDarkly sponsor [Goober: A Less Than 1KB CSS-in-JS Solution](https://goober.rocks/) — Lightweight yet feature rich, you can give their React-oriented [interactive demo](https://codesandbox.io/s/k0mnp40n7v) a try to see if it’s a fit for your requirements. Cristian Bote [Dependency Injection in React](https://8thlight.com/blog/rani-zilpelwar/2021/02/18/dependency-injection-react.html) — Clear boundaries between components decouples your design and facilitates testing. Rani Zilpelwar ▶[React Native Radio: Tips & Tricks for the App Store and Play Store](https://reactnativeradio.com/episodes/rnr-190-tips-and-tricks-for-the-app-store-and-play-store) — As many mobile app developers know, there can be a significant gap between finishing your app and actually getting it released in the major app stores. Jamon Holmgren, Robin Heinze and Adhithi Ravichandran podcast 💻 Jobs [Senior Web Developer (Node/ReactJS) - Remote](https://www.komoot.com/jobs/senior-web-developer) — Millions get inspired and plan adventures with our apps. To help us make [komoot.com](https://www.komoot.com) the place to go to plan outdoor adventures, we’re looking for a one of a kind Web Developer to join our team. Komoot [Find Your Next Job Through Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-reactstatus%29&utm_content=find-your-next-job) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired 📘 Tutorials and Stories [Timed Finite State Machines with React and XState](https://altrim.io/posts/timed-finite-state-machines-with-react-and-xstate) — Starting with an easy-to-understand and well-illustrated example, the author introduces the functionality and value of timed finite state machines and then walks through their implementation. Altrim Beqiri [Turn Google Sheets into a REST API and Use It with React](https://t.co/0uKupdIBSQ?amp=1) — An easy way to eliminate the obstacles which have previously prevented getting all that Google Sheets data into your React app. Nishant Kumar [On Prop Drilling](https://kentcdodds.com/blog/prop-drilling/) — What it is, why it’s good, why it’s bad, and how to avoid common problems with it Kent C Dodds [An Engineering Leader’s Guide to OpenTelemetry](https://go.lightstep.com/register-engineering-leaders-guide-to-opentelemetry-co21.html?utm_campaign=react&utm_source=cooper&utm_medium=Email) Lightstep sponsor ▶[Intro to MobX Tutorial: Building a Simple Blockchain](https://youtu.be/WQQq1QbYlAw) — [Blockchain technology](https://en.wikipedia.org/wiki/Blockchain) is seemingly everywhere and doing everything, so why not learn about it using the [MobX](https://mobx.js.org/README.html) you likely already know. Leigh Halliday [Avoiding Race Conditions and Memory Leaks with `useEffect`](https://www.wisdomgeek.com/development/web-development/react/avoiding-race-conditions-memory-leaks-react-useeffect/) — A succinct look at dealing with a couple of common pitfalls with the [useEffect](https://reactjs.org/docs/hooks-reference.html#useeffect) Hook. Saransh Kataria [React Native Performance: Do's and Don’ts](https://t.co/Pwo5HHEdCC?amp=1) — Those new to React Native will appreciate the prescriptive recommendations of what to do and, just as importantly, what **not** to do. Aman Mittal 🛠 Code and Tools supported by [![Okta\](https://res.cloudinary.com/cpress/image/upload/v1602154330/de7dtktheistsfpqdem4.png)](https://developer.okta.com/?utm_campaign=newsletter_cooperpress_all_multiple_inc_dev_sponsored-section_null&utm_source=cooperpress&utm_medium=cpc) [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/yace4g92x7mun1qnxe6p.jpg)](https://virtual-keyboard.js.org/) [Simple-Keyboard: A Virtual Keyboard for JavaScript Projects](https://virtual-keyboard.js.org/) — Customizable, responsive and lightweight. Compatible with vanilla JS, React, Angular, Vue and more. Love the homepage on this one. Francisco Hodge [React Currency Input Field Component](https://www.npmjs.com/package/react-currency-input-field) — You can’t completely internationalize your application without dealing with all the nuances of the way currencies are expressed and manipulated. Chun-Kit Chan [A Better Way to Build Internal Tools](https://retool.com/?ref=cooperpress) — Build internal apps without the mundane, boring bits (wrestling with UI libraries or hacking together data sources and APIs). Retool sponsor [rc-drawer: A Sliding Drawer Component](https://github.com/react-component/drawer) — Documentation is quite sparse, but there’s a handy [Storybook collection of examples](https://rc-drawer.react-component.now.sh/?path=/story/rc-drawer--change) and with over 500k downloads a week it clearly has some draw… 😆 Alipay [Fielder: Simply Another Form Library?](https://github.com/andyrichardson/fielder) — The author first addresses why there is a need for an alternative approach to forms (as compared to [Formik](https://formik.org), for example) and then defines the notion of a ‘field first’ approach. A short [video introduction](https://www.youtube.com/watch?v=wSorSlCkJwk) further explains the concept. Andy Richardson [React Native Calendars](https://github.com/wix/react-native-calendars) — It’s been a long time since we featured this popular library (2017, to be precise) so we thought it was high _time_ we featured it again. Wix Engineering [Eight Open Source React Native Projects to Check Out](https://t.co/K6RYJTN1Dq?amp=1) — If you learn best by looking at how other developer's have approached a problem, this is a neat set of React Native apps for which you can look at the source code. Mohit **⚡️ Quick Bits:** Interesting projects which you may have missed: - [react-select-me](https://github.com/maslianok/react-select-me) — Customizable drop down control. ([Demo.](http://maslianok.github.io/react-select-me/)) - [accordion-collapse-react-native](https://github.com/marouanekadiri/Accordion-Collapse-react-native) — Display it expanded or collapsed. - [react-text-transition](https://github.com/WinterCore/react-text-transition) — An eye-catching way of updating text. This issue was curated by Terence C. Gannon and edited by the Cooperpress team. 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