--- title: "How to make a purely client-side SPA with Next.js" publication: "React Status" issue: 331 published_at: "2023-03-22" canonical_url: "https://react.statuscode.com/issues/331" --- Plus React finds a new home, why React isn't verified, and the latest libraries and updates. | #​331 — March 22, 2023 [Read on the Web](https://react.statuscode.com/issues/331) Together with [![Tuple logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_102,h_40/e_make_transparent/co_white,e_outline:7/qp571egcdphpynhtnexv.png)](https://tuple.app?utm_source=cooperpress&utm_medium=newsletter&utm_campaign=sponsorship-blitz&utm_content=React+Status_Sponsored+Link) React Status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/swmmm1xyaxiparyor7gt.jpg)](https://react.dev/) [`react.dev`: The New Home for React](https://react.dev/) — Stand aside `reactjs․org`, there’s a new official homepage in town. Available in beta form for some time now, the new site represents a huge step forward in the guides on offer, both in terms of quantity and in representing modern React development practices. Dan Abramov and Rachel Nabors explain more [in this introductory blog post](https://react.dev/blog/2023/03/16/introducing-react-dev). React.js Project [How to Start a React Project in 2023](https://www.robinwieruch.de/react-starter/) — There are lots of ways, but this well-regarded author explains the pros and cons of a few approaches, and gives you a few options targeting specific use cases you might have. Robin Wieruch [![\](https://copm.s3.amazonaws.com/918e61d2.png)](https://tuple.app?utm_source=cooperpress&utm_medium=newsletter&utm_campaign=sponsorship-blitz&utm_content=React+Status_Sponsored+Link) [Tuple, a Lightning-Fast Pairing Tool Built for Remote Developers](https://tuple.app?utm_source=cooperpress&utm_medium=newsletter&utm_campaign=sponsorship-blitz&utm_content=React+Status_Sponsored+Link) — Pair programming over blurry Zoom sessions leads to hours wasted manually dictating code. That’s time that could be spent building features customers want. Tuple’s low-latency remote control and crystal-clear screen sharing gets work shipped faster. Tuple sponsor [Do The New React Docs 'Pretend SPAs Don't Exist Anymore'?](https://wasp-lang.dev/blog/2023/03/17/new-react-docs-pretend-spas-dont-exist) — Matija picks up on something in the new React new docs that suggests the use of a “React powered framework” is recommended unless “your app has unusual constraints.” However, as we'll see in the next item, a framework like Next.js can still be just fine for single page apps.. Matija Sosic (Wasp) **IN BRIEF:** - ⭐️ Dan Abramov shows us [how to make a purely client-side SPA with Next.js](https://gist.github.com/gaearon/9d6b8eddc7f5e647a054d7b333434ef6) while still using dynamic routing. In the comments, someone shows [how you could use Astro for this, too.](https://gist.github.com/gaearon/9d6b8eddc7f5e647a054d7b333434ef6?permalink_comment_id=4508518#gistcomment-4508518) - Vladimir Angelov has implemented the [7GUIs](https://eugenkiss.github.io/7guis/) challenge [in React using signals](https://github.com/vangelov/7GUIs) for managing state. - 😆 We've learnt [🐦 why the official React Twitter account isn't verified](https://twitter.com/reactjs/status/1636510852974280706) – React hasn't got enough pocket money.. [Internationalization in Next.js 13 With React Server Components](https://www.smashingmagazine.com/2023/03/internationalization-nextjs-13-react-server-components/) — An example of creating a multilingual app that uses [next-intl](https://next-intl-docs.vercel.app) to implement the i18n with minimal client-side footprint. Jan Amann (Smashing Magazine) [Where Did Hooks Come From?](https://reacttraining.com/blog/where-did-hooks-come-from) — With apologies to the philosopher Santayana, “_those who cannot remember the past are condemned to repeat it_”. So here’s a quick history lesson on from whence React hooks came, lest we start going ‘round in circles. Brad Westfall [Building Framer Motion Animations Inside a Qwik Application](https://www.builder.io/blog/framer-motion-qwik) — Also touches on [Motion One](https://motion.dev/) as a bonus, an animation library similar to Framer but lighter and faster to use. Yoav Ganbar ▶[Balancing Legacy Code, Content Creation, and Career Growth with the Primeagen](https://www.whiskeywebandwhatnot.fm/balancing-legacy-code-content-creation-and-career-growth-with-the-primeagen/) Whiskey Web and Whatnot sponsorpodcast [Deploy a React App on the Digital Ocean _App Platform_](https://docs.digitalocean.com/developer-center/deploy-a-react-app-on-app-platform-with-self-hosted-supabase/) — Along with a self hosted Supabase instance. Timothy Mamo [How to Stop a React Component from Rendering](https://www.amitmerchant.com/how-to-stop-a-react-component-from-rendering/) — You can return `null` from a component to indicate that it should render nothing. Amit Merchant 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/vlhzv6xrtk6uebzlkgak.jpg)](https://github.com/recharts/recharts) [Recharts 2.5: Chart Library Built with React and D3](https://github.com/recharts/recharts) — Easy to deploy with declarative components, native SVG support, and lightweight dependency on D3. Line, bar, scatter, composed, pie, and radar charts are offered. There are [lots of examples](https://recharts.org/en-US/examples), complete with code. recharts [Bright: A React Server Component for Syntax Highlighting](https://bright.codehike.org/) — Customizable and includes all of VS Code’s syntax highlighting themes, some of which are demonstrated on the page. Code Hike [Try Stream’s Free Trial of SDKs for In-App Chat](https://getstream.io/try-for-free/?utm_source=ReactStatus&utm_medium=Promoted_Newsletter&utm_content=Developer&utm_campaign=ReactStatus_January2023_trial_klmh22) Stream sponsor [React ProseMirror: Integrate the ProseMirror Editor with React](https://github.com/nytimes/react-prosemirror) — [ProseMirror](https://prosemirror.net/) is a toolkit for building rich text editors for the Web. The New York Times [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rzwf3k6lbigdi2l6k5kj.jpg)](https://github.com/react-native-datetimepicker/datetimepicker) [React Native DateTimePicker 7.0](https://github.com/react-native-datetimepicker/datetimepicker) — A React Native date & time picker component for iOS, Android and Windows. v7.0 adds support for TurboModules on Android and supports the so-called [New Architecture.](https://reactnative.dev/docs/new-architecture-intro) Vojtech Novak et al. [A 'Breathing Halftone' Animation for Pictures](https://github.com/ozluy/breathing-halftone) — Hard to describe but interesting. [Here’s the actual effect.](https://nnriyc.csb.app/) Yusuf Ozlu Jobs [Senior React Developer](https://angel.co/company/tempmee-2/jobs/2611086-senior-react-developer) — Join the TempMee team and work on exciting projects from anywhere in the world 🌎💻 don't miss out, [apply here.](https://angel.co/company/tempmee-2/jobs/2611086-senior-react-developer) TempMee [Software Engineer](https://jobs.ashbyhq.com/stickermule/1539721e-7c7d-4f45-a5b0-17e5c02d7bd0?utm_source=Cooperpress) — Join our happy team. Stimulus is a social platform started by Sticker Mule to show what's possible if your mission is to increase human happiness. Stimulus [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=easy-job-hunting) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. Hired **QUICK RELEASES:** - [Downshift 7.6](https://github.com/downshift-js/downshift) ↳ Primitives to build accessible combobox/dropdown components. - [React Table Library 4.1](https://github.com/table-library/react-table-library) ↳ An 'almost headless' table library. - [Solito 3.1](https://github.com/nandorojo/solito) ↳ React Native + Next.js, unified. - [Beautiful React Hooks 4.3](https://github.com/antonioru/beautiful-react-hooks) ↳ Numerous tailor-made React hooks. - [markdown-to-jsx 7.2](https://github.com/probablyup/markdown-to-jsx) ↳ Customizable React Markdown component. - [React Native Testing Library 12.0](https://github.com/callstack/react-native-testing-library) ↳ There's [a migration guide.](https://callstack.github.io/react-native-testing-library/docs/migration-v12) 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