All Projects → topfullstack → Node Vue Moba

topfullstack / Node Vue Moba

Licence: mit
Node.js (Express.js) + Vue.js (Element UI) 全栈开发王者荣耀手机端官网和管理后台

Projects that are alternatives of or similar to Node Vue Moba

Blog
大前端技术为主,读书笔记、随笔、理财为辅,做个终身学习者。
Stars: ✭ 3,179 (+323.87%)
Mutual labels:  express, element-ui
vue-admin-better
🚀🚀🚀vue admin,vue3 admin,vue3.0 admin,vue后台管理,vue-admin,vue3.0-admin,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus,vue admin plus,vue admin pro
Stars: ✭ 12,962 (+1628.27%)
Mutual labels:  admin-dashboard, element-ui
Filmsys
一个使用Vue全家桶和后台Express框架结合Mysql数据库搭建起来的移动端电影售票和管理系统,实现了热映、即将上映、电影和影院全局搜索、评论、选座、购票、点赞、收藏、订单等一系列购票和管理流程功能
Stars: ✭ 217 (-71.07%)
Mutual labels:  express, element-ui
Fontend
使用Node、Vue、ElementUI、iViewUI,验证码等等搭建一个综合性网站(含后台管理系统)
Stars: ✭ 97 (-87.07%)
Mutual labels:  express, element-ui
Ktv Select music System
KTV点歌系统,含后台管理系统(完整版)
Stars: ✭ 305 (-59.33%)
Mutual labels:  express, element-ui
Questionnaire
📋 问卷系统
Stars: ✭ 128 (-82.93%)
Mutual labels:  express, element-ui
vueAdmin
采用Vue+Vue-router+element实现的后台管理模板
Stars: ✭ 15 (-98%)
Mutual labels:  admin-dashboard, element-ui
Element Vue Admin
vue admin template base on element 2
Stars: ✭ 73 (-90.27%)
Mutual labels:  element-ui, admin-dashboard
Doclever
做最好的接口管理平台
Stars: ✭ 2,849 (+279.87%)
Mutual labels:  express, element-ui
nuxt-element-dashboard
⚡️develop your admin-dashboard fast
Stars: ✭ 45 (-94%)
Mutual labels:  admin-dashboard, element-ui
Generator Expressjs Rest
Project template for an ExpressJS application
Stars: ✭ 41 (-94.53%)
Mutual labels:  express, admin-dashboard
Vue Element Admin Tpl
Admin platform template base on vue + element-ui
Stars: ✭ 384 (-48.8%)
Mutual labels:  element-ui, admin-dashboard
Vue Element Admin
🎉 A magical vue admin https://panjiachen.github.io/vue-element-admin
Stars: ✭ 73,044 (+9639.2%)
Mutual labels:  element-ui, admin-dashboard
Cool Admin Api
cool-admin-api 是基于egg.js、typeorm、jwt等封装的api开发脚手架、快速开发api接口
Stars: ✭ 188 (-74.93%)
Mutual labels:  express, element-ui
D2 Admin
An elegant dashboard
Stars: ✭ 11,012 (+1368.27%)
Mutual labels:  element-ui, admin-dashboard
Login
Vue + Vue-router + Vuex 实现前端页面及逻辑,Express 实现注册登录登出的RestFul API 。
Stars: ✭ 246 (-67.2%)
Mutual labels:  express, element-ui
Vue Admin Beautiful
🚀🚀🚀vue3 admin,vue3.0 admin,vue后台管理,vue-admin,vue3.0-admin,admin,vue-admin,vue-element-admin,ant-design,vue-admin-beautiful-pro,vab admin pro,vab admin plus主线版本基于element-plus、element-ui、ant-design-vue三者并行开发维护,同时支持电脑,手机,平板,切换分支查看不同的vue版本,element-plus版本已发布(vue3,vue3.0,vue,vue3.x,vue.js)
Stars: ✭ 10,968 (+1362.4%)
Mutual labels:  element-ui, admin-dashboard
vue-element-admin-ts
vue-element-admin 的 typescript 版本
Stars: ✭ 101 (-86.53%)
Mutual labels:  admin-dashboard, element-ui
Nuxt Ssr
✨vue+nuxt+sass+node+express+MongoDB 实现的SSR项目。
Stars: ✭ 323 (-56.93%)
Mutual labels:  express, element-ui
Nideshop Admin
NideShop 开源微信小程序商城(后台管理系统)
Stars: ✭ 550 (-26.67%)
Mutual labels:  element-ui, admin-dashboard

【全栈之巅】Node.js + Vue.js 全栈开发王者荣耀手机端官网和管理后台

本项目是 Bilibili 全栈之巅 视频教程相关源码 https://github.com/wxs77577/node-vue-moba 持续更新中... 敬请关注

一、 入门

  1. 项目介绍
  2. 工具安装和环境搭建(nodejs,npm,mongodb)
  3. 初始化项目

二、 管理后台

  1. 基于Element UI的后台管理基础界面搭建

  2. 创建分类

  3. 分类列表

  4. 修改分类

  5. 删除分类

  6. 子分类

  7. 通用 CRUD 接口

  8. 装备管理

  9. 图片上传 (multer)

  10. 英雄管理

  11. 编辑英雄 (关联,多选,el-select, multiple)

  12. 技能编辑

  13. 文章管理

  14. 富文本编辑器 (quill)

  15. 首页广告管理

  16. 管理员账号管理 (bcrypt)

  17. 登录页面

  18. 登录接口 (jwt,jsonwebtoken)

  19. 服务端登录校验

  20. 客户端路由限制 (beforeEach, meta)

  21. 上传文件的登录校验 (el-upload, headers)

三、移动端网站

  1. "工具样式"概念和 SASS (SCSS)
  2. 样式重置
  3. 网站色彩和字体定义 (colors, text)
  4. 通用flex布局样式定义 (flex)
  5. 常用边距定义 (margin, padding)
  6. 主页框架和顶部菜单
  7. 首页顶部轮播图片 (vue swiper)
  8. 使用精灵图片 (sprite)
  9. 使用字体图标 (iconfont)
  10. 卡片组件 (card)
  11. 列表卡片组件 (list-card, nav, swiper)
  12. 首页新闻资讯-数据录入(+后台bug修复)
  13. 首页新闻资讯-数据接口
  14. 首页新闻资讯-界面展示
  15. 首页英雄列表-提取官网数据
  16. 首页英雄列表-录入数据
  17. 首页英雄列表-界面展示
  18. 新闻详情页
  19. 新闻详情页-完善
  20. 英雄详情页-1-前端准备
  21. 英雄详情页-2-后台编辑
  22. 英雄详情页-3-前端顶部
  23. 英雄详情页-4-完善

四、发布和部署 (阿里云)

  1. 生产环境编译
  2. 购买域名和服务器
  3. 域名解析
  4. Nginx 安装和配置
  5. MongoDB数据库的安装和配置
  6. git 安装、配置ssh-key
  7. Node.js 安装、配置淘宝镜像
  8. 拉取代码,安装pm2并启动项目
  9. 配置 Nginx 的反向代理
  10. 迁移本地数据到服务器 (mongodump)

五、进阶

  1. 使用免费SSL证书启用HTTPS安全连接
  2. 使用阿里云OSS云存储存放上传文件
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].