Remix后臺開發(fā)之remix-antd-admin配置過程
Remix Antd Admin
一款基于 Remix / Antd / Echarts / Styled-components 的管理系統(tǒng)，可快速進行項目初始化。（本項目偏前端）
Project experience URL
訪問地址（注意部署在 vercel）：remix-antd-admin.vercel.app/
項目倉庫地址：github.com/yyong008/re…
Current Remix Version
1.51.0
設計動機
Remix 的設計范式簡單方便，整個應用就是一個路由器，并且是前后端打通的路由器。表單設計使得 Remix 的表單能力更加簡單方便。在后臺管理系統(tǒng)中，數(shù)據(jù)展示與數(shù)據(jù)錄入，以及頁面切換占據(jù)重要位置，Remix 設計似乎特貼的簡單貼切。集成 Antd UI 項目能力，能快速實現(xiàn)具有漂亮 UI 簡單的后臺管理系統(tǒng)。
核心包
| 包 | 說明 |
|---|---|
| remix | 1.51.0（核心包） |
| antd | 5.3.1（核心 UI 包） |
| styled-components | css-in-js 解決方案（核心 css 解決方案） |
| remix-utils | Remix 的 常用工具，例如：僅僅在服務端然組件 <ClientOnly> 組件（核心工具） |
國際化
| 國際化包 | 說明 |
|---|---|
| remix-i18next | 很容的方式翻譯你的 remix 應用 |
| i18next | - |
| react-i18next | - |
| i18next-browser-languagedetector | - |
圖表庫
選圖表注意支持 ssr
| 圖表庫 | 說明 |
|---|---|
| echarts | 5.3.9 主要圖表（考慮 Remix 需要服務端渲染等問題） |
| echarts-for-react | 基于 React 封裝 echarts 組件 |
| react-mind | React 腦圖 |
| react-mindmap | React 腦圖 |
| react-wordcloud | React 云詞圖 支持 ssr |
| reactflow | 流程圖 |
| echarts-liquidfill-ssr | 水滴圖 |
裁剪工具
pnpm install react-advanced-cropper
Remix 優(yōu)點
簡單明了的路由書寫范式，簡單的數(shù)據(jù)獲取和表單能力
- 強大的文件路由范式
- loader 獲取數(shù)據(jù)
- action 處理表單數(shù)據(jù)
用法
使用 pnpm
# 服務器 pnpm run dev # pnpm dev # 構建 pnpm run build # pnpm build # 開發(fā)環(huán)境服務器 pnpm run start # pnpm start
格式化工具
"scripts": {
"prettier": "prettier --write app/ public/locales"
},
支持
目前作者長期處于愛發(fā)電的狀態(tài)，如果本項目能夠幫助到你不妨請作者喝一杯咖啡，有你的支持，開源項目將得到更好的維護，也崔進輸出更加高質量的代碼，當然也可以參與到此項目中成為項目的參與者，同時期望提出寶貴意見以便項目能得到更好的維護和發(fā)展。
以上就是Remix后臺開發(fā)之remix-antd-admin配置過程的詳細內(nèi)容，更多關于remix-antd-admin后臺的資料請關注腳本之家其它相關文章！
相關文章
這篇文章主要介紹了React ref的使用詳解，幫助大家更好的理解和學習使用React，感興趣的朋友可以了解下2021-04-04
React中使用react-player 播放視頻或直播的方法
這篇文章主要介紹了React中使用react-player 播放視頻或直播，本文教大家如何使用react框架及創(chuàng)建實例的代碼,本文內(nèi)容簡短給大家介紹的非常詳細，需要的朋友可以參考下2022-01-01
react-native-video實現(xiàn)視頻全屏播放的方法
這篇文章主要介紹了react-native-video實現(xiàn)視頻全屏播放的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
react中使用echarts,并實現(xiàn)tooltip循環(huán)輪播方式
這篇文章主要介紹了react中使用echarts,并實現(xiàn)tooltip循環(huán)輪播方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-01-01
本篇文章主要介紹了基于react后端渲染模板引擎noox發(fā)布使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
這篇文章主要為大家介紹了React?懸浮框內(nèi)容懶加載實例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-11-11
Can't?perform?a?React?state?update?on?an?unmoun
這篇文章主要為大家介紹了Can't?perform?a?React?state?update?on?an?unmounted?component報錯解決方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-12-12
在React的生命周期鉤子和合成事件中，多次執(zhí)行setState，會被調(diào)用幾次，本文就詳細的介紹一下，感興趣的可以了解一下2021-11-11
這篇文章主要介紹了React+Electron快速創(chuàng)建并打包成桌面應用，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習吧2022-12-12
這篇文章主要為大家詳細介紹了react實現(xiàn)復選框全選和反選組件效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08