Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/Innei/naive-ui-dashboard-template

Naive UI Dashboard Template with TypeScript, WindiCSS.
https://github.com/Innei/naive-ui-dashboard-template

naiveui template vue3 vue3-typescript

Last synced: 3 months ago
JSON representation

Naive UI Dashboard Template with TypeScript, WindiCSS.

Host: GitHub
URL: https://github.com/Innei/naive-ui-dashboard-template
Owner: innei-template
Created: 2021-06-23T11:58:49.000Z (over 3 years ago)
Default Branch: master
Last Pushed: 2023-12-13T09:04:52.000Z (11 months ago)
Last Synced: 2024-05-01T16:34:35.444Z (6 months ago)
Topics: naiveui, template, vue3, vue3-typescript
Language: HTML
Homepage: naive-ui-dashboard-template.vercel.app
Size: 2.02 MB
Stars: 55
Watchers: 4
Forks: 10
Open Issues: 8
Metadata Files:
- Readme: readme.md
- Funding: .github/FUNDING.yml

Awesome Lists containing this project

awesome-vite - naive-ui-dashboard-template - UI friendly, Vue 3 + TSX + TailwindCSS 2 JIT + PostCSS + Naive UI. (Get Started / Templates)
fucking-awesome-vite - naive-ui-dashboard-template - UI friendly, Vue 3 + TSX + TailwindCSS 2 JIT + PostCSS + Naive UI. (Get Started / Templates)

README

# Naive UI Dashboard Template

This template is taken from [Mx Space Admin v2](https://github.com/mx-space/mx-admin) and styled the same way.

- TailwindCSS
- Vue 3 TSX
- PostCSS
- Pinia

# Usage

Just use it as a regular template, you can style it in 'configs.json' and change theme color in `src/styles/index.css`.

```
pnpm i
pnpm run dev
```

# Addons

## REST Request

You can check code from `src/utils/rest.ts`, this is a simple request wrapper with umi-request or you can replace with another request library.

This usage is very easy and clearly. E.g.

```ts
import { RESTManager } from 'utils/rest.ts'

RESTManager.api.your.request.path.get() // will GET https://endpoint/your/request/path
```

## Setup Api

This template provide a simple debug view for api testing in route `/setup-api`. This view provide a form to set temporarily endpoint. And change your request endpoint immediately. By this function, you can test local server api but on production environment.

![](https://cdn.jsdelivr.net/gh/Innei/fancy@master/2022/0706212514.png)

# UI screenshots

![](https://cdn.jsdelivr.net/gh/Innei/fancy@master/2021/0623195639.png)
![](https://cdn.jsdelivr.net/gh/Innei/fancy@master/2021/0623195623.png)

## License

> [Personal Website](https://innei.ren/) · GitHub [@Innei](https://github.com/innei/)