Learn how to generate social preview images for your website with Remix and Tailwind. Use Vercel's Satori package with Remix for dynamic open graph images. Fetch fonts from Google automatically.
Published on www.jacobparis.com
Build a server-side filter UI with Remix
Create a filter bar that stores its state in the URL. Use the OData query string format to parse and serialize the filters. Create a custom hook to manage the filter state.
Where to host your Remix app in 2023
Should you host your Remix app on a serverless provider like Netlify, Vercel, Cloudflare Pages, or AWS Lambda? Or a long-lived server like Fly, Render, Railway, or DigitalOcean? This guide will help you choose the right hosting option for your app.
Server-side pagination with Remix
Use query parameters to implement server-side pagination with Remix. Create a rolling pagination component that shows the current page along with a few pages before and after it, like Google Search.
Handle both JSON and FormData in Remix
Use formdata for progressive enhancement and json for a better developer experience. Parse request bodies based on their content type, and parse fetchers read pending requests.
Multiple forms and actions on a page with Remix
A Remix action is an endpoint for POST requests, and all forms will submit to the same action. Add a name and value to your submit button to know which form was submitted, and use that to determine which action to take.
Add Drizzle ORM to a Remix app
Drizzle is a typescript ORM for type-safe database access and automatic migrations. Add it to your Remix app to get started with SQLite.