Things I learned from Remix

I've been a React user since 2017. I've used Gatsby and NextJS. It's about time I try Remix. I finally had a chance when I submitted a project for the Linode hackathon: Moon Stats Project

Things I liked

You don't need to use react query or swr to handle server side changes. Remember when you need to update your data after you submitted a form? Remix does it for you by using the combination of action, loader and Form

I'm using ValidatedForm from remix-validated-form in this instance, but you can use a normal html form if you wish.

<ValidatedForm validator={validator} method="post">
  ... your input fields here
 <button type="submit">Submit</button>
</ValidatedForm>

When you submit that form it goes to the action function, which looks something like:

export const action: ActionFunction = async ({ request }) => {
  const formData = await request.formData()
  const values = Object.fromEntries(formData)

  const fetched = await fetch(url-here, {
    method: 'POST',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      ... fields
    }),
  })

  const res = await fetched?.json()

  return { res }
}

Now wherever in the site that you're using a loader function that has been updated by your action, will automatically update without any useEffect or any listener function!

Another cool thing is the ease of using cookie session with their API. It's secure and dev-friendly. It's well-documented here Remix Sessions. This makes user auth config process in front-end a breeze.

There's so many other cool things that I haven't tapped on. Feel free to ask me any questions about Remix or how to set it up, and I'll be glad to answer :)

Cheers, FM

Things I learned from using Remix

Things I liked