#reactrouter — Bluesky Posts

Javi Aguilar

@itsjavi.com

2 weeks ago

It's just my impression or do you also feel #ReactRouter is being silently abandoned?

1 0 0 0

The Daily Tech Feed

@thedailytechfeed.com

2 months ago

Critical vulnerability CVE-2025-61686 in React Router allows unauthorized file access via directory traversal. Developers must upgrade to patched versions immediately. #ReactRouter #CyberSecurity #WebDevelopment Link: thedailytechfeed.com/critical-rea...

1 0 0 0

Shoper Gamer

@shopergamer.bsky.social

3 months ago

React Router คืออะไร

อ่านต่อ : www.blockdit.com/posts/6933b9...

#ShoperGamer #ReactRouter #React #Route #Routing #URL #SEO #Study #Knowledge #Feed

2 0 0 0

Gouranga Das Samrat

@gouranga-khulna.bsky.social

4 months ago

React Router v6 = cleaner, smaller, and more predictable. Simplicity wins again. #ReactRouter

0 0 0 0

Javi Aguilar

@itsjavi.com

4 months ago

feat: add Bun template by itsjavi · Pull Request #178 · remix-run/react-router-templates This PR adds a new template (based on the default one) for Bun servers. It sets up a simple Bun fetch server, with support for RSC builds (part of the code is based on @react-router/node). The temp...

please upvote this PR if you want a @bun.sh template for @reactrouter.com #React #ReactRouter github.com/remix-run/re...

3 0 0 0

Víctor Fernández de Alba

@sneridagh.dev

4 months ago

What we did last year

New blog post! 🚀 What We Did Last Year — a look back at how the #Plone community shaped Seven, the next-generation frontend, through this year’s sprints. sneridagh.dev/blog/what-we... #PloneConf2025 #reactjs #reactrouter #remix #volto

2 1 0 0

Frontend Dogma

@frontenddogma.com

5 months ago

Middleware in React Router Middleware is now stable in React Router!

Middleware in React Router, by @brophdawg11.com (@remix.run):

https://remix.run/blog/middleware

#reactrouter #remix

1 0 0 0

Raphaël 👨🏻‍💻

@raphaelbronsveld.com

5 months ago

How to use Middleware in React Router React Router middleware is here! See how to set it up, run it on server and client, and improve your routes with less code.

New post!

@reactrouter.com now has stable middleware and I had to write about it.

raphaelbronsveld.com/blog/how-to-...

Hope you like my OG image as well 🙃.

#react #reactrouter

1 0 0 0

@vishalicious213.bsky.social

6 months ago

In the previous iteration of the agency website, I used a Header component to render the hero section for each page. It was called from each page, so they passed props with h1 text. Now, I'm using a Layout component, so its different. I got it working like this:

#100Devs #webdev #react #reactrouter

9 0 1 0

@vishalicious213.bsky.social

6 months ago

Quick rundown of how to add a Layout component with React Router 7:

1. Make a Layout component somewhere (you can name it anything, I used Layout).

Import { Outlet } into it. Its like { children } & is where the page component content will render.

#100Devs #react #reactrouter #webdev

9 0 1 0

@proper-t.bsky.social

6 months ago

Clean routing added (/, /privacy, /legal). Dashboard is auth gated. Modular pages make future features and maintenance simpler. #ReactRouter #WebDev #SaaS #BuildInPublic

4 1 0 0

Gouranga Das Samrat

@gouranga-khulna.bsky.social

6 months ago

Routing in React made simple with react-router-dom: Use <Routes>, <Route>, <Link>, useNavigate, and useParams to build dynamic, multipage apps easily. Navigation done right! 🔄 #ReactRouter

0 0 0 0

Gouranga Das Samrat

@gouranga-khulna.bsky.social

6 months ago

Dynamic routes in React Router:
/user/:id + useParams() = powerful detail pages. Combine with useNavigate() for redirects. Routing logic just got easier. 🧭 #ReactRouter

0 0 0 0

Frontend Dogma

@frontenddogma.com

7 months ago

React Router and React Server Components: The Path Forward React Router's RSC support is more than just a new feature. It's a major architectural shift that makes it a much more powerful library while also making Framework Mode less coupled to any particular bundler.

React Router and React Server Components: The Path Forward, by @markdalgleish.com (@remix.run):

remix.run/blog/react-router-and-re...

#react #reactrouter #components #outlooks

0 0 0 0

Micheal Ndondo

@michealndo.bsky.social

7 months ago

A good time to end the day. #reactrouter

1 0 0 0

AntStack

@antstack.com

8 months ago

React Router v7 vs Remix: Understanding the Evolution and What to Use | AntStack - Full-Stack Serverless Company Discover how React Router v7 has integrated features from Remix, including SSR, data loading, and form handling. Learn whether you should stick with Remix or transition to React Router v7 for your pro...

React Router v7 vs. Remix: Which routing solution is right for your project?

This blog compares their evolution and helps you choose.

Read More: antt.me/cYIyFwcx

Let's Talk more on this: antt.me/ZIdLf7WX

#ReactRouter #RemixRun #WebDev #Frontend #Tech #AntStack

2 0 1 0

Frontend Dogma

@frontenddogma.com

9 months ago

Your React Meta-Framework Feels Broken, Here’s Why

Your React Meta-Framework Feels Broken, Here’s Why, by @redwoodjs.com:

rwsdk.com/blog/your-react-meta-fra...

#frameworks #react #nextjs #reactrouter #comparisons

2 1 1 0

Frontend Dogma

@frontenddogma.com

9 months ago

Wake Up, Remix

Wake Up, Remix, by (not on Mastodon or Bluesky):

https://remix.run/blog/wake-up-remix

#remix #reactrouter

0 0 0 0

Raphaël 👨🏻‍💻

@raphaelbronsveld.com

9 months ago

Starting with a fork of Preact, not exactly what I expected but exciting nonetheless ✨.

#remix #reactrouter

0 0 1 0

DEV Community

@dev.to.web.brid.gy

9 months ago

React Router v7: The Evolution React Needed If you're reading this, you're probably working with React or learning how to use it. And if that’s the case, you’ve surely heard of `react-router`, the most popular library for routing in React apps for years. But what you may not know is that in its latest version, React Router has evolved significantly. It now incorporates concepts from **Remix** like `loaders`, `actions`, `ErrorBoundaries`, `SSR support`, and more. **Remix**? That’s right. The Remix framework has always been built on top of React Router. But with this new version (v7), the experience has been unified—now you can use that same architecture directly in React Router, without needing to adopt a full framework. ## What Does React Router v7 Offer? The best way to understand what React Router v7 brings is by looking at its **three usage modes** , each designed for different levels of complexity and application needs: 1. Declarative Mode 2. Data Mode 3. Framework Mode Let’s break down what each one is and when to use them. ### Declarative Mode This is the classic approach you’re probably already familiar with. You use components like `<Routes>` and `<Route>` to define your routes, along with hooks like `useNavigate`, `useParams`, and so on. <Routes> <Route index element={<Home />} /> <Route path="about" element={<About />} /> <Route element={<AuthLayout />}> <Route path="login" element={<Login />} /> <Route path="register" element={<Register />} /> </Route> <Route path="concerts"> <Route index element={<ConcertsHome />} /> <Route path=":city" element={<City />} /> <Route path="trending" element={<Trending />} /> </Route> </Routes> This mode is perfect if you want a simple SPA using your own bundler (Vite, Webpack...), managing state with Zustand, Redux, or react-query, and you don’t need server-side rendering (SSR). ### Data Mode This is where React Router v7 really transforms. Instead of using components to define routes, you use a route config object. Each route can have a loader (to fetch data) and an action (to handle forms or mutations). const router = createBrowserRouter([ { path: "/", element: <div>Hello World</div>, }, ]); ReactDOM.createRoot(document.getElementById("root")).render( <RouterProvider router={router} /> ); A more complete example with a `loader` and `action`: createBrowserRouter([ { path: "/items", loader, action, Component: Items, }, ]); async function loader() { const items = await fakeDb.getItems(); return { items }; } async function action({ request }) { const data = await request.formData(); await fakeDb.addItem({ title: data.get("title") }); return { ok: true }; } function Items() { const data = useLoaderData(); return ( <div> <TodoList items={data.items} /> <Form method="post"> <input type="text" name="title" /> <button type="submit">Crear</button> </Form> </div> ); } This mode is ideal if you're building a complex SPA and want to avoid useEffect chaos, centralizing your data flow. You can also keep your current stack and deploy wherever you want (Vercel, Netlify, Firebase, etc.). 📌 I recommend checking out this ejemplos, and stay tuned—I'll be publishing more articles on how to make the most of this mode. ### Framework Mode This mode turns React Router into a full framework with SSR support. You start from scratch using a CLI, and it’s designed for apps that need SEO or super-fast initial loads. It has the best TypeScript support, shares the `loaders` and `actions` concept from Data Mode, and gives you full control. 👉 However, keep in mind: * You need to define your deployment setup from the start. * Not all libraries work well with SSR. * Your team should understand the difference between CSR and SSR. * It works best with Tailwind or styling approaches compatible with SSR. That said, if your app is private or doesn’t need SEO, I’d recommend sticking with Declarative or Data Mode to avoid unnecessary complexity. ## So, Is It Worth It? Many React frameworks are adding complexity to the frontend with their latest updates. React Router v7 gives you a clear, flexible alternative: * Start with Declarative Mode if you just need routing. * Move to Data Mode to better manage data and forms. * And go full Framework Mode only if SSR is truly required. All without locking yourself into a single approach from day one. 💡 In upcoming posts, I’ll dive deeper into `loaders`, `actions`, and data-mode architecture—building projects from scratch, testing, and real-world integrations. Are you interested in React Router v7? Want to see practical examples or comparisons with other solutions? Let me know in the comments—I’d love to hear from you.

0 0 0 0

Víctor Fernández de Alba

@sneridagh.dev

9 months ago

Plone 7 frontend (Seven) · Issue #6638 · plone/volto PLIP (Plone Improvement Proposal) Responsible Persons Proposer: Víctor Fernández de Alba (@sneridagh) Seconder: Timo Stollenwerk (@tisto) Last Modification: March 2025 Abstract Modernize Volto usin...

🚀 Beethoven Sprint 2025 is starting on Monday! Few pointers for those attending (also remotely).

Seven PLIP: github.com/plone/volto/...
Docs: volto.readthedocs.io/seven/
RR7 official Docs: reactrouter.com/home
RR7/Remix YT: www.youtube.com/@Remix-Run
#Plone #Seven #Volto #reactrouter

3 0 1 0

Mayorkun

@samuelayan.bsky.social

10 months ago

🔥 This is epic! Congrats on teaming up with Kent and EpicWeb — can’t wait to learn from your deep dive into react-router. Routing mastery unlocks so much power in frontend dev. Following this closely! 🚀

#ReactRouter #EpicWeb #WebDev #ReactJS #DevCommunity

1 0 1 0

Alex Ware

@alexware9.bsky.social

10 months ago

#ReactRouter or #TanStackRouter?

1 0 0 0

Triplex.dev

@triplex.dev

10 months ago

Triplex loves React Router

Here's an example on how you can use React Router with Triplex

#reactjs #webdev #reactrouter

2 1 1 0

@inmobi-info.bsky.social

10 months ago

useParams()でidがundefinedになるテストエラーの解決法【React Router】 #ReactRouter – Qiita はじめに React Router を使ったコンポーネントでよく出るエラーのひとつが、useParams() で URL パラメータが取得できずにテストが落ちることでした。ここでは、そのエラーの原因と解決方法を整理します。 useParams()とは React Router のフックのひとつです。 const { id } = useParams(); このように書くと、/user/abc123 のようなURLから id: "abc123" を取得できる。ただしRouterコンテキストの中でしか使えないです。今回は useParams を使って、URLの id に応じたユーザーの個人ページ（例：/taro → 太郎さんのページ）を表示するために使いました。エラーの例 TypeError: Cannot read properties of undefined (reading 'id') このエラーは useParams() で id を読み込もうとしているのに、テスト中は id を持つ URL パラメータが渡っていない状態で起こりました。エラーの原因n const { id } = useParams(); 上記のようなコードがあるコンポーネント（例：

useParams()でidがundefinedになるテストエラーの解決法【React Router】 #ReactRouter – Qiita

はじめに React Router を使ったコンポーネントでよく出るエラーのひとつが、useParams() で URL パラメータが取得できずにテストが落ちることでした。ここでは、そのエラーの原因と解決方法を整理します。 useParams()とは React Router のフックのひとつです。 const { id } = useParams(); このように書くと、/user/abc123 のようなURLから id: "abc123"…

0 0 0 0

@genox.bsky.social

10 months ago

GitHub - tegonal/react-router-templates Contribute to tegonal/react-router-templates development by creating an account on GitHub.

My open source week contrbution at tegonal github.com/tegonal/reac... #reactrouter #opensource

2 0 0 0

Panos Angel

@panosangel.bsky.social

10 months ago

Next.js vs. React Router(Remix): Home Page Structure – Part 3 Now that the fonts are in place, it’s time to start building! In this post, I’m recreating the structure of the Tartarus Insight homepage using both Next.js and React Router. The layout includes some ...

🚀New Blog Post🚀
I'm rebuilding tartarusinsight.com using Next.js & React Router, and I'm documenting every step!📖

🏡Homepage
Check it out! 👇
opensourceodyssey.com/next-js-vs-r...

#WebDev #JavaScript #Coding #buildinpublic #AI #opensource #Nextjs #reactrouter #react

4 0 0 0

Javi Aguilar

@itsjavi.com

10 months ago

#ReactRouter 7 clientLoader allows you to pass data from localStorage to your page component without ui flashing.

try that in nextjs

1 0 0 0

DIY Devs

@diydevs.bsky.social

11 months ago

React Router and the Remix’ed path CVE-2025-31137

Another important vulnerability was just found in React Router + Remix (Express adapter): malicious headers could lead to cache poisoning & more. It's been patched in v7.4.1 & 2.16.3. Details here: zhero-web-sec.github.io/research-and...

#WebSecurity #ReactRouter #Remix #JavaScript #WebDev

0 0 0 0

caleb

@caleb.jasik.xyz

11 months ago

has anyone explored react router v7 in framework mode documented by storybook?

it seems that integrating routing into storybook is almost always a large chore

#StoryBook #ReactRouter #React #Vite

0 0 0 0