Refine Project Builder
- Atul
- Programming
- July 18, 2024
Table of Contents
Refine seems a tool which can build React based projects with many, frontend, authentication, router, databases.
There are good templates too, where great apps are showcased.
First run:
npm create refine-app@latest
Output:
______________________________________
/ Refine: Because real devs don't just \
\ click, they code! /
--------------------------------------
\ ^__^
■-■¬\_______
(__)\ )\/\
||----w |
|| ||
✔ Downloaded remote source successfully.
? Choose a project template …
▸ Vite Creates a refine React Vite project.
Next.js Creates a refine Next.js project with SSR support.
Remix Creates a refine Remix project with SSR support
Choose project template:
Choose the project name and then backend service.
✔ What would you like to name your project?: · test-run
? Choose your backend service to connect: …
▸ REST API Installs REST API Data Provider.
NestJS Query Installs NestJS Query Data Provider.
GraphQL API Installs GraphQL API Data Provider.
Strapi v4 Installs Strapi v4 Data Provider.
nestjsx-crud Installs Nestjsx-crud Data Provider.
Airtable Installs Airtable Data Provider.
Supabase Installs Supabase Data Provider.
Appwrite Installs Appwrite Data Provider.
Hasura Installs Hasura Data Provider.
nestjsx-material-auth0-yarn
Choosing UI
? Do you want to use a UI Framework?: …
▸ Headless No UI framework package will be installed.
Ant Design Installs Ant Design package.
Material UI Installs Material UI package.
Tailwind CSS Installs Tailwind CSS package.
Choosing pages and Auth
✔ Do you want to add example pages?: · mui-example
? Do you need any Authentication logic?: …
▸ None No Auth Provider will be installed.
Custom Installs a mock Auth Provider.
Auth0 Installs Auth0 with NextAuth.js
Google Installs Google with NextAuth.js
Keycloak Installs Keycloak with NextAuth.js
Choosing package manager
? Choose a package manager: …
Npm Dependencies will be installed via npm
▸ Yarn Dependencies will be installed via yarn
PNPM Dependencies will be installed via pnpm
After this it will create a complete project.