Adding Refine to Remix
I have remix project which is already working can I Refine to it. Do we have any douments How to get this done?
5 Replies
Hi @srinivasarajui. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Yes, you can add Refine to your existing Remix project. To do this, you need to install the
@refinedev/remix-router package and set up the router bindings for Refine. Here's a step-by-step guide based on the information extracts:
1. Install the @refinedev/remix-router package:
2. Use the routerProvider from @refinedev/remix-router to set up the router bindings for Refine. Define the action routes for your resources in the resources array and create your routes in the app/routes directory.
3. Create pages for your resources and routes as needed. For example:
- app/routes/posts._index.tsx - List page for posts
- app/routes/posts.show.$id.tsx - Detail page for posts
- app/routes/categories._index.tsx - List page for categories
- app/routes/categories.show.$id.tsx - Detail page for categories
4. Initialize the Refine app in the app/root.tsx file.
For more detailed information, you can refer to the Remix Router documentation (https://refine.dev/docs/packages/documentation/routers/remix) provided in the information extracts.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------Remix | refine
refine provides router bindings and utilities for Remix. This package will provide easy integration between refine and Remix for both existing projects and new projects without giving up the benefits of Remix.
<@659228943206842389> kapa.ai is still learning and improving, please let us how it did by reacting below
equal-aqua•2y ago
unfortunately not, but we want to prepare a document for this. For now, you can look at the sample project.
1. wrap your root to access refine features: https://github.com/refinedev/refine/blob/next/examples/with-remix-auth/app/root.tsx#L85
2. protected routes and layout
https://github.com/refinedev/refine/blob/next/examples/with-remix-auth/app/routes/_protected.tsx#L16
3. dependencies
https://github.com/refinedev/refine/blob/next/examples/with-remix-auth/package.json#L15
conscious-sapphireOP•2y ago
Currently new to both Remix and Refine Will give a try after some time