思路:1.使用mongoose 进行 数据库的链接 2.使用Schema来进行传输字段的定义 3.安装koa-router进行数据处理4.安装koa-bodyparser 进行post数据交互5.解决跨域 6.前端传递值 7.在router.pot里面 处理 前端传递过来的值. 一.连接数据库(1)建立一个项目文件夹: service , npm init (2)安装 mongoose连接数据库,Mongoose是一个开源的封装好的实现node和MongoDB数据通讯的数据建模库 ,npm i…
今天来做一个PHP电影小爬虫.我们来利用simple_html_dom的采集数据实例,这是一个PHP的库,上手很容易.simple_html_dom 可以很好的帮助我们利用php解析html文档.通过这个php封装类可以很方便的解析html文档,对其中的html元素进行操作 (PHP5+以上版本)下载地址:https://github.com/samacs/simple_html_dom下面我们以 http://www.paopaotv.com 上的列表页 http://paopaotv.com…
这个vue项目是紧跟着之前的项目跟我一起做一个vue的小项目(一)来的. 我继续后面的开发(写的比较粗糙,边学边记录) 下图是header头部的样式 header组件内容如下 //header.vue <template> <div class="header"> <div class="header-left">返回</div> <div class="header-input">输入…
接下来我们进行的是城市选择页面的路由配置 添加city.vue,使其点击城市,然后跳转到city页面 //router.js import Vue from 'vue' import Router from 'vue-router' import Home from '@/pages/home/Home' import City from '@/pages/city/City' Vue.use(Router) // 导出一组路由配置项 export default new Router({ ro…
Nodejs将JavaScript语言带到了服务器端,作为js主力用户的前端们,因此获得了服务器端的开发能力,但除了用express搭建一个博客外,还有什么好玩的项目可以做呢?不如就做一个网络爬虫吧.据说互联网上的流量90%以上都是爬虫贡献的,不知道真假,但起码证明了,爬虫是一种用途广泛的东西,尤其在电商比价领域,整个就是爬虫的技术较量,当然我要做的是爬虫中的弱鸡,只实现基本功能,先上源码. 下面简述一下实现过程.首先挑选爬取对象,这里选择的也是门槛比较低的新闻站cnBeta.com,因为每天上…
先看下我们所做项目的效果 这些数据都是我们在data中定义的,不是从后端数据中请求的.那么 接下来我们使用axios渲染数据 npm install axios --save 每个组件里面的数据都不相同,但是单个的组件去进行数据请求的话,那么ajax请求还是太多了,我们在home.vue中发起一个请求 我们使用mock数据,在static中创建一个mock文件夹写入json文件 vue中提出了一个转发功能,我们写的接口路径就可以直接同线上的一致 { "ret":true, "…
需求是这样的. 有一个需要显示若干方块型元素的小区域 数量比较少的时候显示一排 数量比较多的时候显示两排 用 grid 不好,因为当数量为奇数的时候需要两排里面的元素都乖乖的居中显示. 用 flex 的话,直接写需要写很多判断,因为行数不同的时候页面结构也会不同. 所以,我想到用二维数组(矩阵)来表示在什么时候想怎样显示. 上代码. // 波浪效果测试 import React from 'react' import Styles from './index.less' import Wave…
先了解下SSO 对于单点登陆浅显一点的说就是两种,一种web端的基于Cookie.另一种是跨端的基于Token,一般想要做的都优先做Token吧,个人建议,因为后期扩展也方便哦. 小程序也是呢,做成token的形式是较好的. 流程图 PS:图中4的文字打错了~ 1.启动服务 2.小程序初次加载app.js校验token,使用code去换取token 3.检测User信息是否存在code,不存在则注册新用户,最后返回对应用户Id 4.将随机Token与UserId一起存入Redis中 5.返回To…
import flask from flask import request #想获取到请求参数的话,就得用这个 server = flask.Flask(__name__) #吧这个python文件当做一个web服务 '): #satl是盐值,默认是123456 str=str+salt import hashlib md = hashlib.md5() # 构造一个md5对象 md.update(str.encode()) res = md.hexdigest() return res de…
先放一下这个完结项目的整体效果 下面跟我我一起进行下面项目的进行吧~~~ 接下来我们进行的是实现header的渐隐渐显效果,并且点击返回要回到首页 我们先看效果 在处理详情页向下移动过程中,header页出现,我们使用的是监听滚动的方法,然后动态传入样式 //src\pages\detail\components\Header.vue <template> <div> <router-link class="header-abs" tag="di…
接下来我们要做的是热门推荐页面,我们写一个推荐组件 使用的方法也是前端data中的数据渲染到页面上面,这里对文字过长取省略号的方法不成功使用了一个小技巧 使用了min-width:0 我们来看完整的代码和效果吧 //src\pages\home\components\Recommend.vue <template> <div> <div class="recommend-title">热销推荐</div> <ul> <l…
这个游戏的原理我分为11个步骤,依次如下: 1.布局, 2.画曲线(曲线由两个半径不同的圆构成) 3.画曲线起点起始圆和曲线终点终止圆 4.起始的圆动起来, 5.起始的圆沿曲线走起来 6.起始的圆沿曲线走起来,并在曲线初始位置处产生新圆 7.添加图片,这个图片是为了发射子弹 8.让图片跟随鼠标动起来 9.让动起来的图片跟随鼠标的位置发送子弹,并让子弹的颜色变红 10.图片发射的子弹和轨迹上的小圆碰撞检测 11.碰撞检测后让发射的子弹和轨迹上的小圆消失 这就是该程序步骤的的分解. 第一点:布局 <…
canvas加面向对象方式的贪吃蛇 2016-08-25 这个小游戏可以增加对面向对象的理解,可以加强js逻辑能力,总之认真自己敲一两遍收获还是不少啊!!适合刚学canvas的同学练习!! 废话不多说,直接来讲思路和代码. ----------------------------------------------------------------------------------------------------------------- 开发思路:首先要有蛇吃的食物,就是一个个canv…
学习总是枯燥的,对于Python小白的我来讲,更是乏味的.为了提高学习的兴趣,今天我就来写一个小程序练练手. 数字猜谜游戏相信大家都不陌生,A给出最小值最大值,B写一个该范围内的数,A猜测写下的是多少,B通过大小给出提示,并计算猜了多少次才猜对. 使用Python做出这个程序,我们应是A. 第一步,便是输入最大最小值: 第二步,在这个范围内随机取值: 第三步,设置一个计数器及猜测的数: 第四步,判断猜测的数是否正确,并给出提示: 接下来输入自己猜测的数,并根据提示继续猜测: 最后,给出猜测的次数…
接下来我们进行的是详情页动态路由及banner布局 先看页面的效果 下面是代码部分 <template> <div> <div class="banner"> <img src="//img1.qunarzz.com/sight/p0/1409/19/adca619faaab0898245dc4ec482b5722.jpg_600x330_f922b488.jpg" alt="" class="…
接下来我们对城市列表页面进行优化,除了对数据优化,也会进行节流处理 //src\pages\city\components\Alphabet.vue <template> <ul class="list"> <li class="item" v-for="item of letters" @click="handleLetterClick" @touchstart="handleTouc…
接下来我们进行的是轮播页面下面的导航页的开发 我们需要的是实现轮播页下面的图标,并且实现轮播效果 这个话,其实基本思路先是渲染出小图标,然后,我们要对页数进行判断,如果图标的个数展示的就是8个,那个这个就是一页轮播 如果大于8个,我们要计算是显示几个轮播页.再根据这个轮播页我们去渲染的数据 //icons.vue <template> <div class="icons"> <swiper> <!-- 这个是轮播的页数 --> <s…
接下来我们进行轮播的开发 安装插件,选用2.6.7的稳定版本 npm install vue-awesome-swiper@2.6.7 --save 根据其github上面的用法,我们在全局引用,在main.js中添加 //main.js import VueAwesomeSwiper from 'vue-awesome-swiper' require('swiper/dist/css/swiper.css') Vue.use(VueAwesomeSwiper) 在components里面写入S…
首先,使用node-webkit 做环境,废话不多说,直接贴HTML <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> &…
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-Type"…
接下来我们进行的就是城市列表页面数据额动态渲染. 也是在mock数据,进行动态渲染 //city.json { "ret": true, "data":{ "hotCities": [{ "id": 1, "spell": "beijing", "name": "北京" }, { "id": 3, "spell&quo…
接下来我们编写周末游组件 <template> <div> <div class="recommend-title">周末去哪儿</div> <ul> <li class="item border-bottom" v-for="item of recommendList" :key="item.id"> <div class="item-i…
项目架子 npm install --global vue-cli vue init webpack travel cd travel/ npm run dev 运行效果 添加home页及其路由,添加list页及其路由 移动端项目配置项完善 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalabl…
一.Apache配置 本实例需要使用php支持.要现在Apache中配置虚拟目录,在Apache下的httpd-vhosts.conf文件中添加如下代码 <VirtualHost *:80> DocumentRoot "D:/htdocs/backbone_demo" ServerName www.backbonedemo.cn </VirtualHost> 在windows的hosts文件中添加配置,hosts文件的位置在c:\windows\system32…
现在前端全栈里面有一种技术栈比较火 前端使用 vue 或者react 后端使用 koa2 mysql数据库 或者mongdb做数据储存 但是基本这样的全栈教程 都要收费 收费就收费吧 但是 有没有遇到非常好的教程 于是 准备硬着头皮看别人项目的源码 自己摸索 一步一步完成 koa + mongdb的后端学习 下面就写一个很简单的koa + mongdb 的数据库写入 user.js //这个页面写数据库连接 var mongoose = require('mongoose') var Schem…
和asp.net类似,一个FormAction对应Form文件夹 demo结构: ‘ 对于项目结构有疑问的: http://www.thinkphp.cn/document/60.html login.html <!DOCTYPE html> <html lang="en"> <head></head> <body> <meta charset="UTF-8"> <FORM method=…
新建一个java普通项目即可 这里用到了Jboss,需要安装Jboss,然后进入jboss-4.2.3.GA\client目录,拷贝所有的jar包到本项目的lib下. 3个接口分别如下所示: public interface Calculate { //计算器接口,有个加法 public String add(Double a,Double b); } public interface CalculateLocal extends Calculate { //此接口用于实现本地化,继承父类 }…
写完正则在浏览器上检测自己写得对不对实在是不方便,于是就撸了一个JS正则小demo出来. demo demo展示 项目地址 代码部分 首先把布局样式先写好. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js正则查找替换工具</title> <link rel="stylesheet&q…
Spring Boot最好的学习方法就是实战训练,今天我们用很短的时间启动我们第一个Spring Boot应用,并且连接我们的MySQL数据库. 我将假设读者为几乎零基础,在实战讲解中会渗透Spring框架中的一些知识点,并提供相关官方文档链接, 让我们一起在实战中高效学习. 该教学实例在github上, 项目文件地址 在这个实战学习中, 我们将使用Spring Boot与MySQL数据库构建一个简单的登陆系统,功能包含注册账户和登陆两个功能,并用Spring Boot官方推荐使用的thymel…