R
Refine

ask-any-question

Nextjs app router

Fflat-fuchsia1/19/2024
How setup refine using the latest nextjs app router and shadcn ui
Kkapa.ai1/19/2024
Hi @Yash pede. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the information provided in the extracts, there isn't enough information on how to set up refine using the latest Next.js app router and shadcn UI. However, I can guide you on how to set up refine with Next.js and a general approach to adding a UI library. To set up a Next.js refine project, you can use the create refine-app command-line interface (CLI). Here's how you can do it:
npm create refine-app@latest <name of your application>
npm create refine-app@latest <name of your application>
You will be prompted to choose your preferences for the project. Select the following options to proceed:
Choose a project template · refine(Next.js)
What would you like to name your project?: · <name of your application>
Choose your backend service to connect: · <Your choice>
Do you want to use a UI Framework?: · Headless
Do you want to add example pages?: · No
Do you need i18n (Internationalization) support?: · No
Choose a package manager: · npm
Choose a project template · refine(Next.js)
What would you like to name your project?: · <name of your application>
Choose your backend service to connect: · <Your choice>
Do you want to use a UI Framework?: · Headless
Do you want to add example pages?: · No
Do you need i18n (Internationalization) support?: · No
Choose a package manager: · npm
After setting up the project, you can add the shadcn UI library to your project. Usually, this involves installing the library via npm or yarn and then importing the components you need in your project. However, the exact steps may vary depending on the specific library. Please note that the information on how to integrate shadcn UI with refine is not provided in the extracts. For more detailed instructions, you should refer to the official documentation of shadcn UI and refine. For more information on how to add SSR-Next.js to your Refine project, you can check out this guide (https://refine.dev/docs/guides-and-concepts/ssr/nextjs/). Sources: - Building React admin panel with NextUI and refine (https://refine.dev/blog/next-ui-react-admin-panel#what-is-refine) - Build a Progressive Web App (PWA) with Next.js (https://refine.dev/blog/next-js-pwa#project-setup) - Refine vs AdminBro - Comparison Admin Panel Framework (https://refine.dev/blog/refine-vs-adminbro#ssr---nextjs-support) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
Kkapa.ai1/19/2024
<@757439175321452587> kapa.ai is still learning and improving, please let us know how it did by reacting below
Fflat-fuchsia1/19/2024
no no but i want to use the app directory setup for nextjs

Looking for more? Join the community!

R
Refine

ask-any-question

Join Server
Recommended Posts
When sidebar is collapsed, changing page on paginated list open sidebar menu itemWhen changing the page, the page and offset query parameter of path is modified and is detected as aUseMany missing in some generated pages by the MUIinferencerWhats the reason why some List pages are generated by the MUIinferencer with the UseMany methods andgraphql mutationi am using graphql for and i want to pass different meta fields for getOne and update using useForm Filter a table field with outside component and stateHi guys, I'm using useTable to get data from database, here is my useTable code ```const filter = sugraphql mutationI am trying to use useForm from ``` import { useForm } from "@refinedev/react-hook-form"; ``` i waUpdate specific field by using mutate useUpdateHi guys, I'm using mutate of useUpdate() to update a record on my db How can I just update a specifiedit modalI am trying to create a edit modal inside the card. my card contains only name which can be edited oHiding a button in the Navbar based on User Role (MUI)Hi, How can i hide a button in the Nav bar based on the role of the user connected? (MUI)Filtering with useList and state operationHi guys, I currently have a List with useList to get data from a table with supabase Now I have a buHow does useLogin with custom authProvider?I want use custom authProvider and login.include options in useManylike pagination how to add include method in useTable hooks or any other hooks?Showing error message from server on HTTP errorHello, I'm a backender and playing with Refine so I'm new to React. I have an "create new item" page