react_admin_ui_v1

React Admin UI는 TypeScript 및 React 기반으로 구축된 아름다운 오픈 소스 대시보드 사용자 인터페이스 프로토타입 입니다. 놀랍게도 약간 복잡한 구성 요소를 사용하여 사용자 인터페이스 프로토타입을 구축하는 것은 이번이 처음입니다. 따라서 제 목표는 IT 기관이나 개별 개발자라도 이 프로토타입을 사용하여 향후 프로젝트에 대한 통찰력을 얻을 수 있는 것입니다.

프로토타입의 기능, 핵심 가치 및 사용 사례에 대한 포괄적인 목록을 보려면 React Admin UI 미리보기를 살펴보세요.

이 저장소에는 React Admin UI Prototype의 핵심 시스템이 포함되어 있으며 두 개의 서로 다른 디렉터리로 나누어져 있습니다. Backend는 JSON API용이고(Vercel 배포용으로 이미 구성되어 있음) Frontend는 전체 사용자 인터페이스 프로토타입용입니다.

? 특징 및 구성

• ⚡️ Vite를 사용한 React 18 TypeScript
• React Router v6을 사용한 선언적 라우팅
• ? React Query v5를 사용한 원활한 데이터 가져오기
• React Icons v5로 최적화된 아이콘
• ? 스타일링 기초로서의 Tailwind CSS v3
• ? 기본 디자인 시스템인 Daisy UI v4
• ? 최적화된 데이터 그리드를 위한 Material UI v5
• Recharts v2를 사용한 아름다운 차트
• ? 그리고 더 많은 것...

설치 및 사용방법

빠른 시작 설치 및 사용 예는 아래를 참조하세요.

백엔드

백엔드 디렉터리 내부의 package.json 에 나열된 모든 종속성을 설치합니다.

 cd backend

npm install

기본적으로 Vercel 환경에서 실행되도록 API를 이미 배포했습니다. 라이브 API는 https://react-admin-ui-v1-api.vercel.app/에서 액세스할 수 있습니다. 그러나 백엔드를 직접 구성하려는 경우 아래에서 실행할 수 있습니다.

nodemon ./src/index.ts

API는 http://localhost:5000에서 로컬로 액세스할 수 있습니다.

프런트엔드

frontend 디렉터리 내부의 package.json 에 나열된 모든 종속성을 설치합니다.

 cd frontend

npm install

npm run dev

기본 API 엔드포인트를 변경하려면 ApiCollection.tsx로 이동하면 됩니다.

그런 다음 http://localhost:5173/에서 앱에 액세스할 수 있습니다.

? 질문이 있나요? 채팅하고 싶나요? 문제가 발생했나요?

이메일이나 LinkedIn과 같은 공식적인 접근 방식을 통해 언제든지 저에게 직접 연락하실 수 있습니다.

? 버그를 발견하셨나요? 특정 기능을 제안하시나요?

fransachmadhw/react_admin_ui_v1 저장소에 각각의 제목과 설명이 포함된 새로운 문제를 자유롭게 제출 하세요. 문제에 대한 해결책을 이미 찾았다면, 풀 요청을 검토해 보시기 바랍니다 !

✅ 요구사항

React Admin UI에는 20.11.0 LTS 이상의 노드 버전이 필요합니다. React Admin UI 요구 사항의 현재 목록을 찾으려면 백엔드 및 프런트엔드 내부 package.json 의 dependencies 및 devDependencies 섹션을 살펴보세요.

특허

React Admin Dashboard UI 프로토타입은 BSD-3-Clause 조건에 따라 출시됩니다.