R
Refine

ask-any-question

Migrate from CRA to Next.JS

Ccorrect-apricot12/10/2023
CRA authentication is no longer working for my project, how can I change from CRA to Next.JS
Kkapa.ai12/10/2023
Hi @ely8891. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- I'm sorry, but the provided extracts do not contain specific information on how to migrate from Create React App (CRA) to Next.js. However, they do provide some insights on setting up a Next.js project and implementing authentication using NextAuth.js or refine's built-in authentication features. Here's a general guide based on the information available: 1. Create a new Next.js project: You can create a new Next.js project using the create-next-app command. You will be prompted to enter your project name to complete the installation. You can use either yarn or npm as your package manager.
yarn create next-app
yarn create next-app
2. Start the project: Once the installation is completed, move into your project directory and start the project using the yarn dev command.
yarn dev
yarn dev
3. Install NextAuth package: If you want to use NextAuth for authentication, you can install it using the yarn add next-auth command.
yarn add next-auth
yarn add next-auth
4. Implement Authentication: In Next.js, you can achieve authentication control in multiple ways. On the client-side, you can wrap your pages with the Authenticated component from @refinedev/core to protect your pages from unauthenticated access. On the server-side, you can use your authProvider's check function inside server-side functions (getServerSideProps) to redirect unauthenticated users to other pages like login. For page-level authentication, the server-side approach is recommended. Source (https://refine.dev/docs/router-integrations/next-js/#authentication) Please note that this is a general guide and the specifics might vary based on your project requirements. For detailed instructions, you might want to refer to the official Next.js and refine documentation. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai12/10/2023
<@274276392286289921> kapa.ai is still learning and improving, please let us know how it did by reacting below
Ccorrect-apricot12/10/2023
@kapa.ai Is the CRA Legacy still supposed to work? or is my issue with the authprovider methods not being called unrelated?
Eextended-salmon12/10/2023
Hey @ely8891, sorry for the issue. Can you check this release notes https://github.com/refinedev/refine/releases/tag/%40refinedev/core%404.46.0 ?We released an update on the Authenticated component last week which might be the cause for your issue. Its very easy to fix btw ๐Ÿš€
GitHub
Release @refinedev/core@4.46.0 ยท refinedev/refine
Minor Changes #5343 dd8f1270f6 Thanks @alicanerdurmaz! - fix: hideForm should remove all form fields. (submit button, form fields, rememberMe checkbox, forgot password link, etc.) but the /regist...
Ccorrect-apricot12/13/2023
yo cheers, I applied unique keys to each authenticated element. Despite that, when I mutate Login for example, it's never called. It worked up until X time ago (7 months at most) - I left the project untouched

Looking for more? Join the community!

R
Refine

ask-any-question

Join Server
Recommended Posts
I'm getting this error please helpSomething went wrong when trying to get installed `refine` packages. โœ“ refine devtools is running aModify displayed data for CRM templateHello, I've started using the CRM dashboard template and I like it a lot. I understand that it fetchhow to customize sidebar with muihow do i customize sidebar with muiuseDrawerFormI am opening the modal with the following path: inquiry/edit/88/authority-create. When I close the mIntegrating a Progress Bar with useDataGrid Fetch in React: Is it Possible?Hello, I'm currently exploring the useDataGrid hook from the refine library in a React project and How to call validation function?How can I manually call the validation function myself when using `useModalForm` hook?HistoryHello, I have a problem. When I use filters and sorting and pagination, they do not save new search How to get the resources definitions from the server(runtime resources)?I am implementing a protocol-driven CMS client based on refine, but I find nothing in the refine docHow to create custom action for refinewe already have actions like create, edit, show, list. want to add a archive action too with all thei want to create a custom page and i want all the permission from its parentconst leads = { name: "leads", list: List, create: Create, edit: Edit, show: Show, archiResources having me confusedI tried using useList, but it didn't call the route I added in the list. instead its calling a `/camInsert to a list field on supabaseHi, I have a list of text on a supabase table field. When I use auto generate for create page, the cboolean form values turning as "error"so i am making a dialog for edit the values are correct but as soon form renders on its last render Resources from the serverHi, Has anyone tried getting resources from the server?X Overflow when Chakra UI Sider is collapsed with parent resourcesHello, When collapsing the default Chakra UI sider with parent resources the sider overflows and lis it possible to paginate the useMany hook?I'm using the useMany hook in order to fetch relational data from multiple Airtable tables. It is re