基于Vue2.0(Vue-cli)+ElementUI+Express+Mongoose的全栈开发环境
前端页面部分基于vueAdmin项目,修复了其中的一些BUG。
npm install
首先,启动Express服务(4501端口),提供API接口,请确保已经安装MongoDB
npm run server
然后,开启前端部分开发环境(8088端口)
npm run dev
最后在8088端口开发前端部分即可,vue-cli已经把webpack的热替换功能加入了进去,十分方便。
后台的修改也是被nodemon
监控的,会自动在4501端口重启。
所以是全栈自动刷新,非常适合开发。
需要注意的是,这里配置了config/index.js
的
proxyTable:{
'/api' : 'http://localhost:4501'
}
这样就需要约定,Express后台的所有API接口都要以/api/*
来命名。
npm run build
然后浏览器访问:
http://localhost:4501/admin
项目名称:vue-admin-front 作者:雷婷婷 简介: 利用vue+iViewUI+vue-router+nodejs实现后台管理系统的搭建。 前端使用iViewUI框架进行架构,后台使用express框架进行架构。 技术栈: 1)使用iViewUI框架,配置webpack.config.js文件,下载相关模块 2)后台nodejs中的express框架 3)MongoDB作为数据库 4)
个人博客网站实现过程如下: 完成静态页面的布局。通过vue-cli框架 连接数据库,完成后台搭建 采用vue-resource做交互 本地运行没有任何问题。 运行方法是:先启动数据库,然后启动后台node index,然后再npm run dev启动项目。 项目目录如下: --build --config --node_modules --server --actions --db
简单的电商全栈项目搭建 一、技术栈 1、前端 前台:Vue + Vue-Router + Vuex + axios + Vant 后台:Vue + Vue-Router + Vuex + axios + ElementUI 2、后端: Node + Express + mongoose + cors + jwt 二、项目搭建 1、创建后台管理系统 第一步:创建项目并安装依赖: vue create
Vue 2.0已经正式发布好长时间了。想找一个Vue.js Vuex vue-route的学习项目来练手。做个电商App吧,上gitHub搜索了一下搜到一大堆,不过基本上都不是使用单文件组件开发的,更不用说基于Vue.js全家桶了。本项目不一样的地方在于使用vue-cli + webpack template人开发模式,还要求Web和移动端一体化,也就是响应式Web,而且不能Mock数据,额外需要
一.首先使用ElementUI实现后台的增删改查 用vue-cli先搭建一个项目admin,再创建一个文件夹,命名为serve,里面放自己写的接口数据和连接mongodb数据库等 在serve文件夹中操作 第一步 npm init -y 先初始化一个package.json 再安装express,mongoose,cors npm i express npm i mongoose npm i
1,安装element : vue add element 2,安装路由 : vue add router 3,创建路由的过程 : (1) 新建 vue页面 main.vue , (2)在router.js 文件中引入和注册 , (3)前台引入 <router-link to="/main">Main</router-link> 4,
Vue-admin 这是一个不简单的全栈后台管理系统。 想法 做一个全栈项目,可以发表文章,管理评论、用户、标签、文章、添加图片等类似于wordpress的项目,主要是学习mongoose操作mongodb数据库,学习一对多,多对多关系设计。 由于工作量很大,将后期陆续完成。 主要功能有: 首页 (一些文章新增,用户动态) 文章管理(文章列表+新增文章) 菜单管理(分配菜单) 角色管理(暂时只有两
这个项目最初其实是fork别人的项目。当初想接触下mongodb数据库,找个例子学习下,后来改着改着就面目全非了。后台和数据库重构,前端增加了登录注册功能,仅保留了博客设置页面,但是也优化了。 一、功能特点 一个基本的博客内容管理器功能,如发布并管理文章等 每个用户可以通过注册拥有自己的博客 支持markdown语法编辑 支持代码高亮 可以管理博客页面的链接 博客页面对移动端适配优化 账户管理(修
day1 1. vue cli 与ant design vue之前端建设 1. vue cli项目搭建 vue create demo 2. 使用ant deisign vue 官网 需要配置less时出现问题.bezierEasingMixin() 传送门 3. axios is not defined cnpm i axios // main.js import axios from '
day1 1. vue cli 与ant design vue之前端建设 1. vue cli项目搭建 vue create demo 2. 使用ant deisign vue 官网 需要配置less时出现问题.bezierEasingMixin() 传送门 3. axios is not defined cnpm i axios // main.js import axios from '
Vue Admin 是一个基于 Vue 2.0 和 Bulma 0.3 的 后台管理框架。 特性: 基于 Vue 2.0 和 Bulma 0.3 技术 响应式和弹性布局 多种图表类型 丰富的组件或参见 vue-bulma 基于优秀的第三方库
vue-element-admin 是一个后台前端解决方案,它基于 vue 和 element-ui实现。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。
该模块提供了一个基于Vue.js的纯静态后台管理系统的界面方案, 该模块克隆自:vue-admin-template,感谢PanJiaChen. 构建步骤 # Install dependencies npm install --registry=https://registry.npm.taobao.org # Serve with hot reload at localhost:9528
简介 开箱即用的基于配置的后台管理解决方案,最少的编写代码,通过配置文件即可实现:增,删,改,查,翻页 的功能。 它基于 vue 和 element和MongoDB。它使用了最新的前端技术栈,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级后台产品。 文档 讨论组 依赖 nodejs(需要单独安装) koa 2.0.0 项目依赖模块) Element UI
Django-Vue-Admin 是一套全部开源的快速开发平台,毫无保留给个人及企业免费使用。 前端采用ruoyi-ui 、Vue、Element UI。 后端采用Python语言Django框架。 权限认证使用Jwt,支持多终端认证系统。 支持加载动态权限菜单,多方式轻松权限控制。 特别鸣谢:Gin-Vue-Admin,RuoYi ,Vue-Element-Admin,eladmin-web。
在线预览 更新日志 相关依赖 vue-router iview axios vuex 功能 登录页 一周七天自动切换不同的壁纸(建议自己配置) 标签栏 点击标签切换页面 刷新当前标签页 关闭其他标签/关闭所有标签 注意: 组件的名称和路由的名称一定要一致,例如 Home.vue 组件名称 name: home,则在路由文件中也要给它设置为 name: home,否则页面内容不能缓存 // 在r