/admin-starter

大数据管理后台界面模板脚手架

Primary LanguageTypeScript

🎉大数据管理后台模板🎉

📣介绍

大数据管理后台模板是由Angular框架开发,以TypeScript作为主要开发语言,基于ngx-admin项目改进的一个管理后台基础起步模板。

该项目旨在节约开发者项目前端基础页面搭建时间:hourglass:。

📌功能列表

  1. 登录
  2. 概览页
  3. 🙆‍♀️用户信息页(用户信息概览,🔔用户通知)
  4. 🙆‍♀️用户设置(基础信息设置、账户设置、🔔通知设置)
  5. 📘开发手册
  6. 注销

💻运行环境

环境要求

软件 版本 描述
系统 windows 操作系统
Git 2.13.2.windows.1 代码版本控制
Node v8.11.4 Node.js安装包
NPM 5.6.0 npm包管理器
CLI 6.1.5 angular项目脚手架
VS Code 1.14.2 前端代码编辑器

▶️运行步骤

  • 安装node.js和npm

    node.js下载地址

    查看node.js版本: node -v

    查看npm版本: npm -v

  • 安装angular cli

    npm install -g @angular/cli

  • 克隆项目到本地运行

    • 下载安装git

      git下载地址

      查看git版本: git --version

    • 克隆项目

      git clone https://github.com/yulongbb/admin-starter.git

    • 运行项目

      • 安装项目依赖的npm包: npm install

      -在默认端口4200运行项目并自动打开浏览器: ng s -o

👉基础操作

添加示例导航

app/pages/page-menu.ts文件中添加示例导航

 {
   title: '示例模块一',
   icon: 'nb-locked',
   children: [
     {
       title: '示例功能一',
       link: '/pages/example',
     },
   ],
 },

新建示例页面

app/pages/example下添加示例页面

ng generate component pages/example

添加路由导航链接

app/pages/pages-routing.component.ts文件添加示例路由

 {
    path: 'example',
    component: ExampleComponent,
 },

💯 💅

📚学习资源文档

Angular官方中文文档

ngx-admin参考文档