Dev 표시: React.js 및 Bootstrap 5의 오픈 소스 관리 대시보드 UI 라이브러리

안녕하세요, 개발자 여러분! Themesberg의 제 팀과 함께 React.js 및 Bootstrap 5에서 첫 번째 관리 대시보드 UI 라이브러리 구축을 완료했습니다! 우리는 그것을 Volt React Dashboard라고 부르기로 결정했습니다.

live demo 및 Github repository 을 확인할 수 있습니다. MIT 라이센스에 따라 오픈 소스입니다. 별은 오픈 소스 사랑을 전파하는 데 도움이 될 것입니다 <3

빠른 시작

Themesberg에서 등록 및 다운로드하거나 이 저장소를 복제하십시오.

프로젝트의 zip 다운로드

원사 사용

Yarn이 설치되어 있는지 확인하십시오.
yarn 설치 후 터미널을 열고 기본 volt 폴더에서 yarn install를 실행하여 모든 프로젝트 종속성을 다운로드합니다.

yarn install

그런 다음 터미널에서 다음 명령을 실행하여 개발 모드에서 앱을 시작합니다.

yarn start

브라우저에서 보려면 http://localhost:3000을 여십시오. 코드를 변경하면 브라우저에 자동으로 반영됩니다.

프로덕션 파일을 생성하려면 homepage 값을 package.json에서 앱이 호스팅될 도메인 이름으로 변경한 후 터미널에서 다음 명령을 실행합니다.

yarn build

NPM 사용

Node.js이 설치되어 있는지 확인하십시오. 설치된 노드 버전이 8.10 이상이고 npm이 5.6 이상인지 확인하십시오.

Node.js를 설치한 후 터미널을 열고 기본npm install 폴더에서 volt-react-dashboard/를 실행하여 모든 프로젝트 종속성을 다운로드합니다. node_modules/ 폴더에서 찾을 수 있습니다.

npm install

그런 다음 터미널에서 다음 명령을 실행하여 개발 모드에서 앱을 시작합니다.

npm run start

브라우저에서 보려면 http://localhost:3000을 여십시오. 코드를 변경하면 브라우저에 자동으로 반영됩니다.

프로덕션 파일을 생성하려면 homepage 값을 package.json에서 앱이 호스팅될 도메인 이름으로 변경한 후 터미널에서 다음 명령을 실행합니다.

npm run build

선적 서류 비치

모든 구성 요소, 플러그인 및 시작하기는 당사의 online documentation 에 철저하게 문서화되어 있습니다.

파일 구조

다운로드 내에서 다음 디렉토리와 파일을 찾을 수 있습니다.

Volt React Dashboard
.
├── LICENSE.md
├── README.md
├── package-lock.json
├── package.json
├── public
│   ├── android-chrome-192x192.png
│   ├── android-chrome-512x512.png
│   ├── apple-touch-icon.png
│   ├── browserconfig.xml
│   ├── favicon-16x16.png
│   ├── favicon-32x32.png
│   ├── favicon.ico
│   ├── index.html
│   ├── manifest.json
│   ├── mstile-150x150.png
│   ├── robots.txt
│   ├── safari-pinned-tab.svg
│   └── site.webmanifest
├── src
│   ├── assets
│   │   ├── img
│   │   └── syntax-themes
│   ├── components
│   │   ├── AccordionComponent.js
│   │   ├── Charts.js
│   │   ├── Code.js
│   │   ├── CodeEditor.js
│   │   ├── Documentation.js
│   │   ├── Footer.js
│   │   ├── Forms.js
│   │   ├── Navbar.js
│   │   ├── Preloader.js
│   │   ├── Progress.js
│   │   ├── ScrollToTop.js
│   │   ├── Sidebar.js
│   │   ├── Tables.js
│   │   └── Widgets.js
│   ├── data
│   │   ├── charts.js
│   │   ├── commands.js
│   │   ├── features.js
│   │   ├── notifications.js
│   │   ├── pages.js
│   │   ├── tables.js
│   │   ├── teamMembers.js
│   │   └── transactions.js
│   ├── index.js
│   ├── pages
│   │   ├── HomePage.js
│   │   ├── Presentation.js
│   │   ├── Settings.js
│   │   ├── Transactions.js
│   │   ├── components
│   │   ├── dashboard
│   │   ├── documentation
│   │   ├── examples
│   │   └── tables
│   ├── routes.js
│   └── scss
│       ├── volt
│       └── volt.scss
└── yarn.lock

자원

데모: https://demo.themesberg.com/volt-react-dashboard

다운로드 페이지: https://themesberg.com/product/dashboard/volt-react

설명서: <#>

라이선스 계약: https://themesberg.com/licensing

지원: https://themesberg.com/contact

문제: Github Issues Page

프로로 업그레이드

이 오픈 소스 소프트웨어를 지원하고 싶다면 Volt Pro React Dashboard이라는 이 React 대시보드의 프리미엄 버전을 확인하도록 초대합니다. 800개가 넘는 React 구성 요소, 맞춤형 플러그인 및 20개의 예제 페이지가 있습니다.