这篇博客的源代码是我的正在写的在线简历 完整代码(项目暂未完成) 预览地址
在本地预览项目的时候用的http-server
前端的两大块:
但是无法存储数据!
数据必须存在服务器上,这样任何设备访问服务器都可以得到数据,如果存在客户端的本地,那么其他客户端设备无法读取到.所以数据必须存储在服务器的数据库上
我们必须买一个服务器,在上面安装数据库.
打开阿里云服务器,最低配置且带宽最小的服务器每月30人民币.
如果给简历加留言功能,我们可以使用一个简易的服务器
使用leancloud,提供简易有廉价的服务器服务.
这个leancloud服务会提供给你api,调用API可以简单操作后台,包括数据库和服务器.但是,只能用他的api.不能自己写后端代码.不需要在服务器部署数据库,省去在服务器上创建表等一切繁琐的后台操作.直接调用API就可以操纵数据库. 用它提供的的API可以非常简单得创建表,保存数据等等,操作如后台一样.只是数据库和服务器都是这个平台帮你设置好的,你可以在前台直接发请求,操纵他的数据库.
只要会基本的js语法,了解http.使用他提供的API,就可以操作它提供的服务器了.是一个非常适用前端人员练习的产品 缺点:不安全!!!只能当练手用.前台就可以修改数据库代码.而且知道id之后,任何人任何地方都可以修改数据库
PS:我们学习js就是为了能看懂别人(大神)的代码和文档,然后使用他的功能.用CRM(拷贝,运行,修改)套路去学习任何你没有学习的前端知识. 面试造飞机,工作拧螺丝是正确的面试方法.只有你懂了如何得到的这个文档,你就能看懂文档,然后就能熟练使用文档写的功能.
leancloud 一个自带数据库和增删改查(CRUD)功能的后台系统。
拥有:
登录注册、手机验证码功能(收费) 存储任意信息 读取任意信息 搜索任意信息 删除任意信息 更新任意信息 等功能。
基本的增删改查功能
请看下面两个官方的文档: 1.JavaScript SDK 安装指南 2.数据存储入门教程 · JavaScript
我在此演示一下基本的使用. 下面演示如何使用 LeanCloud 存一个 Hello World到他的后台数据库上. 分为下面几步:
详细截图预与演示: 下面这几步都是看1.JavaScript SDK 安装指南这个文档 第一步:首先创建一个应用
进入后
界面的基础用途如图所示 注意创建的应用要等几分钟才能部署好,等几分钟,刷新页面知道应用出现在进行下面的步骤
第二步:引入 av-min.js
,得到 window.AV
对象
如图:
引入存储服务的SDK
第三步: 拷贝初始化的代码
这里的id和key每个应用都不一样.是专属的.
第四步: 测试,看看是否能够成功存储到服务器中的数据库.这一步仍然拷贝文档中的代码,按照文档中的提示做
Hello Word!
就是在数据库中新插入的数据
CRM学习代码法中C(拷贝)和R(运行)完毕,接下来实行M(修改),修改代码
下面用我的项目再重新看一下整个过程:
首先引入SDK,再引入一个message.js
模块用来写添加数据到数据库的代码
接着按照文档中的要求拷贝代码,然后稍加修改
代码的解释都在注释里
刷新页面后会自动发送一个请求,然后把save({})里的对象里的属性添加到数据库的表中.
结果:
发送了两个请求:
不要管请求是什么
下面查看数据库,看看数据是否添加成功
table2表中多了一条记录,记录中的两个字段正是测试的两个字段
以上就是LeanCloud的基本使用过程 下面用LeanCloud完成留言功能
两个功能:
批量获取对象的API(一个对象在这里就是数据库一个表中的一条记录)
完整代码:
结果
注意:
form
表单的submit
事件,不要监听提交按钮的点击事件.因为如果用户输入了信息,点击回车,那么用户的意愿还是提交,但是他并没有点击按钮,所以不会触发提交事件.这个form
表单的submit
事件包含submit
按钮被点击和在任意input
打回车.用户提交有可能打回车,有可能点按钮
map()
和forEach()
的使用例如
query.find().then(fn1,fn2)
.then(fn3.fn4)
含义是:
fn1
,如果失败执行回调函数fn2
.fn1
和fn2
都没有报错,那么执行fn3
,如果fn1
和fn2
中有一个报错,那么执行fn4
实现效果: