create-react-app + reactrap 構(gòu)建簡單管理頁面

想給自己的小程序博客構(gòu)建一個后臺管理界面,第一考慮是用react+antd。但是一想,自己的需求很簡單,需要的組件也很少,簡單的幾個form界面,antd的話太重了,部署到1m小水管服務(wù)器上加載速度勢必很慢。第二考慮是不用ui組件,只用react,但又受不了自己的css還有審美太爛。綜合之下還是用bootstrap,怎么寫也難看不到哪去,比antd稍微輕量一點。react版的bootstrap叫reactrap。
https://reactstrap.github.io/
https://www.html.cn/create-react-app/docs/getting-started/


用createreactapp創(chuàng)建項目

npx create-react-app mini-blog-admin
cd mini-blog-admin
npm start

添加路由

npm install --save react-router-dom

添加reactrap

npm install --save reactstrap bootstrap@4

使用

在 src/index.js 文件的開頭導(dǎo)入 Bootstrap CSS 和可選的 Bootstrap 主題 CSS :
import 'bootstrap/dist/css/bootstrap.css';

在 src/App.js 文件或自定義組件文件中導(dǎo)入所需的 reactstrap 組件:
import { Button } from 'reactstrap';

react-router示例
https://reacttraining.com/react-router/web/example/basic

可以開動寫代碼了

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容