vue+node+mongodb实现的页面

源代码地址:https://github.com/GainLoss/vue-node-mongodb 目前这个项目实现的是: 1.利用vue-cli实现前台页面的编写 (1)页面的跳转利用的是vue-router:基本是$.router.push这种方法还有就是使用命名路由和动态路由 (2)页面每一部分使用的是组件components:里面涉及的有父子组件之间的数据传递还有生命周期函数 2.使用vue-resource从后台获取数据 (1)不加参数的传递 (2)加参数的传递 3.使用exp…

vue+node+mongodb实现的功能

用vue+node +mongodb实现前后台交互的页面代码,已经上传到github上, 地址是: https://github.com/GainLoss/vue-node-mongodb https://github.com/GainLoss/vue-manger 实现一个基本交互功能:http://www.cnblogs.com/GainLoss/p/6927626.html 踩过的坑:http://www.cnblogs.com/GainLoss/p/6929299.html 这次说的是在…

后台管理系统：vue&node&MongoDB（一）

后台管理系统使用工具: Vue Node Mongodb Element-ui 一.后台(Node+Mongodb) 前期准备: 需要下载的包: mongooes -------- 连接 mongodb express --------- web应用框架 crypo --------- 加密 body-parser --------- post解析模块文件夹的大致内容(需要创建的文件) 注册:在这里注册使用get来接收前端发来的请求(zhuce.js) // 引入一个exp…

学习笔记：Vue+Node+Mongodb构建简单商城系统（一）

所需前置知识: HTML.CSS.JS.Vue.ES6.Npm.Webpack.Node.Express.Mongodb 项目整体架构: IDE:webstorm: 项目建立过程(cmd常用命令行指令): node的安装下载连接:https://nodejs.org/en/ npm的安装 npm install -g npm 查看node版本:node -v 查看npm版本:npm -v 安装vue模块:npm install vue --save 安装webpack:npm install…

vue+node+mongoDB火车票H5（七）-- nodejs 爬12306查票接口

菜鸟一枚,业余一直想做个火车票查票的H5,前端页面什么的已经写好了,node+mongoDB 也写了一个车站的接口,但接下来的爬12306获取车次信息数据一直卡住,网上的爬12306的大部分是python,node的资料比较少,而且本身也不会node.js, 没有任何基础,只能看着文档写几个小demo... nodejs爬取查票接口,获取json数据,由于12306的查票接口返回的数据是经过加密的,所以要再对result进行解析输出写这个的时候,找了好多,还学了python,准备用pthon…

vue+node+mongoDB 火车票H5（四）---完成静态页面

各项配置都好了,就可以开始写静态页面了,先别急着写,看一下页面又哪些公用的部分可以提取出来的,统一放到components组件文件夹中 header头部文件夹放一些头部常用组件,如首页的banner切换封装一个swiper组件,tab切换封装一个tab组件,头部的标题封装一个vHeader组件 footer底部文件加放一些页面底部常用组件,如首页的菜单menu组件,列表页的筛选filter组件另外,注意每新建一个页面一定要到router里的index.js中去配置,例如,添加了index.vu…

一个 Vue + Node + MongoDB 博客系统

源码耗时半载(半个月)的大项目终于完成了.这是一个博客系统,使用 Vue 做前端框架,Node + express 做后端,数据库使用的是 MongoDB.实现了用户注册.用户登录.博客管理(文章的修改和删除).文章编辑(Markdown).标签分类等功能. 很早之前就想写一个个人博客.学了 Vue 之后,把前端部分写出来,然后 Node 一直拖拖拉拉的学了很久,中间又跑去实习了一段时间,所以直到回学校之后才列了个计划把这个项目实现了. 翻出之前写的前端部分,好丑啊,干脆推掉重写吧.前端模仿的…

vue+node+mongodb前后端分离博客系统

感悟历时两个多月,终于利用工作之余完成了这个项目的1.0版本,为什么要写这个项目?其实基于vuejs+nodejs构建的开源博客系统有很多,但是大多数不支持服务端渲染,也不支持动态标题,只是做到了前后端分离,对于博客类系统seo肯定很重要,索性就自己动手写了这个项目,其中也遇到了不少问题, 因为基于服务端渲染的项目不多,自己能力也有限,所以用了好长时间.这里特别感谢@lincenying,提供了登录功能的解决思路,也是我在开发过程中遇到最难解决的问题,本项目基于vue-hackernews-2…

vue+node+mongoDB前后端分离个人博客(入门向)

最近学习了VUE,自己为了学习做了个小小的博客,功能很简单,不过开发过程中也遇到了很多坑,所以记录下来方便以后使用.欢迎大家交流学习. 功能实现了用户注册.登录.token检测登录.用户留言.个人中心.图片上传.博客管理(文章的修改和删除).文章编辑(Markdown).标签分类等功能. 前端使用vue全家桶(cli,router,vuex,axios),框架用的elementUI 后端使用node,框架用的express,mongoose: 数据库采用mongodb 响应式,移动端勉强能看.…

vue+node+mongoDB 火车票H5（六）---城市列表保存到MongoDB数据库并且启用node.js服务

把车站列表保存到数据库,并且从本地创建服务 node.js创建httpserver 1.搭建基于express的运行环境全局安装express-gengerator cnpm install -g express-gengerator 2.创建express项目,创建了本地服务 express server 生成server目录,目录下的bin是可执行文件,运行bin下的www文件启动服务 node server/bin/www 启动成功打开浏览器localhost:3000 server下的…

vue+node+mongoDB 火车票H5（二）---vux和less的配置

vue基本环境配置好之后,就可以开始开发页面了开发页面之前先了解一下项目结构,原始的目录结构为: config是配置文件,环境配置好了开发阶段可以不再去修改了,node_modules文件夹是打包的一些依赖,可以通过npm安装其他需要的依赖,都会被装到这个文件夹里 src文件夹是开发中用到最多的文件夹,assets这是模板里放图片的,可以用,也可以不用,一般用images习惯了,可以改成images,也可以放在page下 components文件夹是放一些通用组件,可以自己根据业务需求来写,p…

vue+node+mongoDB 火车票H5（一）---准备工作，基本配置

前端菜鸟一枚,由于公司项目用到了vue,我虽然参与了,但是很多环境配置和流程还不是特别清楚,就想自己个人业余做个webapp看看, 对于完全新手而言,很多坑会纠结很久,所以想借此机会自己做的同时记录各种坑,网上的vue项目搜的的大都是仿饿了么,由于公司项目做的是火车票, 所以我就找了找火车票相关app,界面上我更喜欢飞猪的橙色基调,所以决定仿飞猪的火车票部分,从最基本的开始,先让项目运行起来: 项目地址:https://github.com/leitingting08/train 已完成一些静态…

vue+node+mongoDB 火车票H5（五）---城市选择

选择城市,支持搜索,储存选择过城市的历史记录,点击索引能跳到相应位置 1. 父子组件传值,trainCity城市选择组件,选择城市后改变父组件的值 2. 把城市数组按照字母A到Z排序 3.点击字母索引,跳到相应位置 4.支持搜索框搜索具体实现代码:https://github.com/leitingting08/train/blob/master/src/components/cityselect/train-city.vue…

学习笔记：Vue+Node+Mongodb 构建简单商城系统（二）

前面几个月工作有点忙,导致构建简单商城系统的计划搁置近三个月.现在终于有时间重新回过头来继续本计划.本篇主要记录自己在阿里云服务器上搭建node运行环境的整个过程,以及对其中遇到的一些问题的思考. 一. 注册域名言归正传,既然是构建商城系统,那么必然涉及到域名.服务器.等一些必要的硬件设备.对于域名这个问题,是很好解决的,直接上阿里云注册一个就好了,域名注册都是需要花钱的,至于买什么样的域名,这个要看你自己想要建一个什么功能的网站,这个域名对于用户来说最好朗朗上口,这样好记.有些域名会比较贵,…

vue+node+mongoDB 火车票H5（三）---git提交时忽略不想提交的文件

想要把项目通过git提交到GitHub上,但提交时并不想提交node_modules文件夹,这个文件夹太大 git 提交代码时不提交配置文件夹node_modules 在.gitignore文件中添加node_modules,就表示忽略这个文件夹,不提交到远程,再运行git status的时候,就会发现写在.gitignore里的文件夹不显示,提交时不会提交到远程 .gitignore .DS_Store node_modules npm-debug.log* yarn-debug.log* y…

每天记录一点：NetCore获得配置文件 appsettings.json vue-router页面传值及接收值详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发

每天记录一点:NetCore获得配置文件 appsettings.json 用NetCore做项目如果用EF ORM在网上有很多的配置连接字符串,读取以及使用方法由于很多朋友用的其他ORM如SqlSugar,NH,Dapper等,在读取连接字符串的时候,往往把信息保存到一个配置文件中,例如appsetting.json, 网上有很多关于读取appsetting.json都是通过注入的方式, 在ORM读取配置的时候,都是在一个类库里面,所以用注入的方式有时候不适合[个人理解] 因以上场景…

mongodb & vue & node.js

mongodb mongodb & vue & node.js https://docs.mongodb.com/manual/tutorial/install-mongodb-on-windows/ https://stackoverflow.com/questions/2404742/how-to-install-mongodb-on-windows https://www.tutorialspoint.com/mongodb/ https://www.tutorialspoint.c…

一个 Vue & Node 的全栈小项目

约学 - 可以寻找一起自习的小伙伴的Web APP 一个基于 Vue & Node 的移动端全栈小项目在线演示(请使用移动端查看效果) 源码地址: https://github.com/G-lory/yuexue (感觉要被玩坏了…我知道有很多bug…发现bug可以告诉我……谢谢dalao们……) 部分页面截图(不许吐槽我首页的背景图片! 技术栈前端:Vue2 vue-router Webpack axios sass MintUI Iconfont 后端:NodeJS(v8.…

服务器小白的我，是如何将 node+mongodb 项目部署在服务器上并进行性能优化的

前言本文讲解的是:做为前端开发人员,对服务器的了解还是小白的我,是如何一步步将 node+mongodb 项目部署在阿里云 centos 7.3 的服务器上,并进行性能优化,达到页面 1 秒内看到 loading ,3 秒内看到首屏内容的. 搭建的项目是采用了主流的前后端分离思想的,这里只讲服务器环境搭建与性能优化. 效果请看 https://biaochenxuying.cn 1. 流程开发好前端与后端程序. 购买服务器与域名服务器上安装所需环境(本项目是 node 和 mongodb…

源码讲解 node+mongodb 建站攻略（一期）第二节

源码讲解 node+mongodb 建站攻略(一期)第二节上一节,我们完成了模拟数据,这次我们来玩儿真正的数据库,mongodb. 代码http://www.imlwj.com/download/nodejs/demo1.rar 首先给大家看看目录结构. 大家可以比对一下,跟第一节我们加了那些内容. 1,我们新建文件夹schemas,新建文件movie.js,主要提供对数据模型,实例化,对数据的增删改查方法. var mongoose=require('mongoose'); var Movi…

vue+node.js+webpack开发微信公众号功能填坑——v -for循环

页面整体框架实现,实现小功能,循环出数据,整体代码是上一篇 vue+node.js+webpack开发微信公众号功能填坑--组件按需引入修改部门代码 app.vue <yd-flexbox> <yd-flexbox-item>能耗排行</yd-flexbox-item> <yd-flexbox-item>房间号</yd-flexbox-item> <yd-flexbox-item>能耗程度</yd-flexbox-item&g…

[慕课笔记] node+mongodb建站攻略

如何利用node+mongodb来快速搭建一个电影网站? 一:后端部分整个网站的后端是由node.js来驱动的,所以在后端需要安装node.js,以及在这个基础之上的框架express,它能够帮助我快速的搭建web应用,然后数据库选用的mongodb,以及对mongodb快速建模的工具mongoose.后端的模板引擎用的是jade关于时间个日期的格式化选用的是Moment.js底下的这四个模块都是通过npm安装的,npm是node自带的. 二:前端部分前端部分会选用jQuery的类库以及bo…

VUE Node模式下，如何改变菜单的颜色，如何将超长文字缩略显示，在鼠标进入后展开全部显示，鼠标移出则恢复缩略显示

VUE Node模式下,如何改变菜单的颜色,如何将超长文字缩略显示,在鼠标进入后展开全部显示,鼠标移出则恢复缩略显示: “事件”引起变量值的变化,系统引擎自动根据变量值的变化刷新页面在VUE Node模式下设置变量.使用变量: 在VUE Node模式下使用鼠标移入移出点击事件: 在VUE Node模式下通过改变Class改变颜色.文字缩略等: 具体实现注意事项: 在VUE Node模式下通过改变Class改变颜色.文字缩略等改变元素的显示要素(颜色.缩略.大小.背景等等)可以通过更改元素对应…

vue 移动端项目切换页面，页面置顶

之前项目是pc端是使用router的方式实现置顶的 //main.js router.afterEach((to, from, next) => { window.scrollTo(0, 0) }) 但是改了移动端就没有效果了,稍微查了一下,好像说是要body里才有用. 可能与我使用了vux-ui有关在深究router方式还是找新方法的选择上,我选了后者, //自定义的common.js // 这个方法通过递归找到滚动的元素,用于置顶页面 function getScrollParent (n…

node+mongodb+ionic+cordova

node + mongodb1,环境 windows 1,install nodejs 2,install npm | cd npmjs node cli.js install -gf1.1 2.node 开发nmp install express -g | nmp remove express -g npm install express-mongoose 1,express -e myProject ejs change htmlvar ejs = require('ejs') ;app.e…