Stack Overflow
Stack Overflow

Questions tagged [remix.run]

For questions regarding programming with the Remix web framework.

Remix.run

Note: Please use this tag to ask questions regarding Remix.run - the web framework. If you have questions regarding Remix - the crypto IDE, please use the "remix" tag instead.

If you want visibility from the Remix team for your questions, make sure to open a GitHub discussion and select category Q&A.

Join the official Discord server to receive community support in the #help channel.

343 questions
15
votes
3 answers

Remix: middleware pattern to run code before loader on every request?

Is there a recommended pattern in Remix for running common code on every request, and potentially adding context data to the request? Like a middleware? A usecase for this might be to do logging or auth, for example. The one thing I've seen that…
davnicwil
  • 28,487
  • 16
  • 107
  • 123
13
votes
3 answers

Running google analytics script on Remix.run

I have built a web app with remix run and I want to add the Google analytics. How can I add the pure JS to head and body section without making the typescript angry?
Tolga Yiğit
  • 402
  • 3
  • 11
11
votes
1 answer

Remix Hydration failed: UI on server and client do not match

It's fine locally (known warning and CSS renders well), but on Vercel my Remix app gets this error: Hydration failed because the initial UI does not match what was rendered on the server. Business logic runs fine but CSS is utterly broken. Update…
nusantara
  • 1,109
  • 1
  • 15
  • 38
11
votes
1 answer

how to redirect from a utility function in remix run

I am using Remix-run and i want to redirect to my login page from a auth utility function. but it doesnt work. here is a similar function to my authentication utility method import { redirect } from 'remix'; async function authenticate(request){ …
hannad rehman
  • 4,133
  • 3
  • 33
  • 55
10
votes
1 answer

How do I change the port used by Remix.run's local development server?

By default, Remix.run seems to use Port 3000 for local development when running: ❯ npm run dev > dev > concurrently "npm run dev:css" "remix dev" [0] [0] > dev:css [0] > tailwindcss -o ./app/styles/tailwind.css --watch [0] [1] Watching Remix app…
Darian Moody
  • 3,565
  • 1
  • 22
  • 33
9
votes
0 answers

How to provide a Redux store to Remix JS project?

I've been following closely Remix Run JS (https://remix.run/) and I've been working with some tutorials, however, I haven't found anywhere here or in the web of how to implement a redux store: I was thinking in wrapping the App component like this…
Fer Toasted
  • 1,274
  • 1
  • 11
  • 27
8
votes
2 answers

Remix loader returning "undefined"

I am giving remix a good first-time try and I think I love its approach to data handling. However, I am facing an issue with data returning "undefined" from the loader wrapper. import { LoaderFunction } from "@remix-run/node"; import { useLoaderData…
Badt0men
  • 213
  • 2
  • 11
8
votes
5 answers

how to load Svg components in remix run application

I have some Svg files which i want to load as react components in remix run app. for example in create-react-app your could do something like this import { ReactComponent as Logo } from './logo.svg'; function App() { return (
{/*…
hannad rehman
  • 4,133
  • 3
  • 33
  • 55
8
votes
0 answers

Is there any alternative of history.length to upgrade react-router?

I want to upgrade the react-router package to v6. It has a dependency on the history package, and in the history package roadmap, the document says history.length will be deprecated and even deleted soon. You can take a look…
Emre Doğan
  • 137
  • 2
  • 11
7
votes
1 answer

Fetching data from server in Remix.run

I was exploring Remix.run and making a sample app. I came across an issue that has been bothering me for some time now. Correct me if I am wrong: action() is for handling Form submission, and loader() is for fetching data initially. For my…
canaryGrapher
  • 175
  • 2
  • 11
7
votes
1 answer

Handling action in Remix.run without POST

I read up on the Remix docs on action and most of information I can find on action is it uses the the form POST with button submit to trigger the action export default function Game() { const counter = useLoaderData(); return ( <> …
LuxuryWaffles
  • 1,518
  • 4
  • 27
  • 50
7
votes
1 answer

Handling UI State in Remix.run

I am trying out remix and ohh boy.. I am stuck on creating a simple counter (clicking button increase count) I guess I am not supposed to use the useState hook so I tried my luck with loader and action as I believe that this is where it should be…
LuxuryWaffles
  • 1,518
  • 4
  • 27
  • 50
7
votes
2 answers

Is there a way to refetch with useLoaderData in remix?

I'm learning remix and I'd have some functions in my loader that I call in my default route with useLoaderData like so : export const loader = async () => { const pokemon = await getRandomPokemon(); const types = await getAllPokemonTypes(); …
Jimmy Soussan
  • 652
  • 3
  • 14
7
votes
5 answers

window is not defined when trying to access environment variables in Remix

I'm trying to get some environment variables into the browser with Remix and I've been following this: https://remix.run/docs/en/v1/guides/envvars I have followed steps 1 and 2 exactly, however I'm not able to access window.ENV from the browser. I'm…
themanatuf
  • 2,880
  • 2
  • 25
  • 39
7
votes
3 answers

How to get SSR to work with fluentui /Remix run?

How to install fluent UI react with remix run? I believe this is important enough to be addressed here, as it is a stumbling block in the adoption of office-UI-fabric-react in the community.
surendar
  • 87
  • 1
  • 8
1
2 3
…
22 23