--- title: "Happy birthday to React" publication: "React Status" issue: 341 published_at: "2023-05-31" canonical_url: "https://react.statuscode.com/issues/341" --- Plus a way to test your React skills, a collection of server-safe hooks, and letting a component follow your pointer about. | #​341 — May 31, 2023 [Read on the Web](https://react.statuscode.com/issues/341) Together with [![Marmelab\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_80,h_80/e_make_transparent/co_white,e_outline:7/dm18iacxtihcjqax5xxv.png)](https://marmelab.com/react-admin/) React Status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/m2nqivwrf0q5fp9fkrk6.jpg)](https://vercel.com/blog/10-years-of-react) ▶[Celebrating 10 Years of React](https://vercel.com/blog/10-years-of-react) — Grab yourself a slice of cake, React is 10 years old. As part of the celebrations, Vercel’s Delba de Oliveira [▶️ hosted a ‘roundtable’ discussion](https://www.youtube.com/watch?v=g5BGoLyGjY0) (though the table itself has taken the day off 😁) with Andrew Clark and Sebastian Markbåge talking about the current state of React, Suspense, Server Components, and Actions. Guillermo Rauch (Vercel) [![\](https://copm.s3.amazonaws.com/9f62eaf4.png)](https://marmelab.com/react-admin/) [React-Admin: The Open-Source Framework for B2B Apps](https://marmelab.com/react-admin/) — From simple dashboards to complex admin panels for your entire company, react-admin unleashes the true productivity of React. Join more than 20k devs already building web apps like they play Lego, thanks to 230+ business-oriented components. Marmelab/React-admin sponsor [The Evolution of React APIs and Code Reuse](https://frontendmastery.com/posts/the-evolution-of-react-patterns/) — An exploration of the evolution of common React patterns, from mixins and higher-order components to render props and hooks. As React becomes more popular in backend contexts too, you can benefit from maintaining a clear mental model of React and understanding the tradeoffs and benefits of each approach here. Rem / Frontend Mastery **IN BRIEF:** - The folks behind the [React.gg course](https://react.gg/) have updated [useHooks.com](https://usehooks.com/) to be a collection of modern, SSR-safe React hooks to look through. - Tom Preston-Werner, GitHub co-founder and Redwood co-creator, writes about [how Redwood is going 'all in on React Server Components'](https://tom.preston-werner.com/2023/05/30/redwoods-next-epoch-all-in-on-rsc.html) and announces [the first Redwood conference](https://www.redwoodjsconf.com/) to take place in Oregon this September. [Practice React by Fixing Tests](https://reactpractice.dev/exercise/practice-react-by-fixing-tests-check-your-jsx-knowledge/) — How would you evaluate your knowledge of JSX? One way could be to [clone this repo](https://github.com/reactpractice-dev/unit-tests-jsx) or [this CodeSandbox](https://codesandbox.io/p/github/reactpractice-dev/unit-tests-jsx/main?file=/src/__tests__/jsx-exercises.test.jsx:1,1) and see if you can fix the bugs. React Practice [The State of State Management in React Apps](https://reacthandbook.dev/state-management) — State management remains a subject that attracts a lot of attention. So much, in fact, you may need the help of the handy _[React Handbook](https://reacthandbook.dev)_ to help sort through all the options. React Handbook ▶[Talking About the React 'Forget' Compiler](http://podrocket.logrocket.com/react-core) — React core team members Joe Savona and Sathya Gunasekaran talk, amongst other topics, about the ‘Forget’ React optimizing compiler first teased in 2021 but then further explained in [the React team’s June 2022 update.](https://react.dev/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022#react-compiler) Paige Niedringhaus (PodRocket Podcast) podcast ▶[Are React Server Components Really Slower?](https://www.youtube.com/watch?v=3Q2q2gs0nAI) — Are RSCs actually slower in Next.js than the getServerSideProps/Pages model? Jack Harrington [How to use OAuth to Add Authentication to Your React App](https://fusionauth.io/blog/2021/11/11/how-to-authenticate-your-react-app?utm_source=reactstatus&utm_medium=newsletter&utm_campaign=react-sdk) FusionAuth sponsor [How to Avoid Mocking in React Router v6 Tests](https://webup.org/blog/how-to-avoid-mocking-in-react-router-v6-tests/) Miroslav Nikolov 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/hgdhy60ubengxxv7pyqb.jpg)](https://yoavik.com/snippets/mouse-tracker) [MouseTracker: A Component That 'Follows' Your Mouse](https://yoavik.com/snippets/mouse-tracker) — A component that renders children into a fixed-position div that takes the coordinates of the mouse, with optional offsets, perhaps to augment the pointer with helpful information or to render tooltips. There are a couple of live samples with code, too. Yoav Kadosh ['Enterprise-Grade' Next.js Boilerplate App](https://github.com/Blazity/next-enterprise) — One of those boilerplate apps that includes everything but the kitchen sink 😁 Tailwind CSS, Jest, Playwright, Storybook, Radix UI, T3 Env, and more all come along for the ride here. Blazity [Tuple – The Fastest Way to Onboard New Devs](https://tuple.app?utm_source=cooperpress&utm_medium=newsletter&utm_campaign=sponsorship-blitz&utm_content=React+Status_Onboarding+Link) — Waste hours verbally steering on Zoom? New hires learn your codebase faster with Tuple. Trusted by over 40,000 devs. Tuple sponsor [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/dkgpwoxywjy9g489j1rx.jpg)](https://boringavatars.com/) [Boring Avatars: React Library to Generate Custom Avatars](https://boringavatars.com/) — Ranging from generic gradients to face-like creations, this library ([GitHub repo](https://github.com/boringdesigners/boring-avatars)) generates custom, SVG-based, round avatars from any username and color palette. Boring Designers - [React Icons 4.9](https://github.com/react-icons/react-icons) ↳ Include popular SVG icons into React projects easily. - [react-tracking 9.3.2](https://github.com/nytimes/react-tracking) ↳ Declarative tracking for React apps. - [html-react-parser 4.0](https://github.com/remarkablemark/html-react-parser) – HTML to React parser. - [react-webcam 7.1](https://github.com/mozmorris/react-webcam) – Webcam component. - [React Slider 10.2](https://slider-react-component.vercel.app/) – [Demos.](http://react-component.github.io/slider/?path=/story/rc-slider--handle) Jobs [Find React Jobs with 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) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. Hired This issue was curated by Terence C. Gannon and Peter Cooper 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