说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家!

一丶项目介绍

  • 产品:关于手机移动端的租房网站
  • 角色:在这个产品中用户包括房东与房客
  • 功能:房东可以在这个平台发布自己的房屋,房客可以在这个平台寻找自己想要租的房子(类似短租平台)
  • 设计模式:使用前后端分离进行项目开发(后端不再控制前端的效果展示)

前端效果展示

二丶前后端分离

  • 前后端分离的认识
  • 叙述:用户直接在浏览器中输入网址,不再是后端对应的动态逻辑了,而是一个静态页面
    从/index 变成了 index.html文本文件,对于静态资源就从提供静态资源服务器中去拿(nginx) 
    前端页面中对于数据这块的需求必定是从后端拿去数据,后端也不需要去渲染模板,直接将前端
    需要的数据转换成json格式字符串返回给前端即可(通过jquery以及其他前端框架去将数据渲染到页面)
    具体做成什么效果,跟后端没有什么关系,前端什么时候需要数据,后端就给数据,这就是前后端分离。
  • 优点:无论对于手机上的浏览器还是app程序向后端拿数据时,只要在后端已经定义好了接口,这个接口都是可以直接用的,体现出后端接口的复用性。
  • 流程:用户在浏览器中输入网址的时候,需要向后端(nginx)去要网页,在这个网页中没有任何的数据,只是普通的前端呈现的样式而已,在这个网页当中的js里面,通过ajax方式向后端接口要取数据,后端接口当中给前端返回的是json字符串,前端拿到这个字符串在到ajax回调函数中,通过jquery方式把数据填充到页面上。
  • 缺点:对于搜索引擎优化SEO不友好,无法将网页的数据通过搜索引擎搜索关键字查询此网页信息,爬虫拿取页面信息,并没有任何数据,导致在搜索引擎上排名无法靠前

三丶项目需求

需求功能

1. 主页
    1.1 最多5个房屋logo图片展示,点击可跳转至房屋详情页面
    1.2 提供登陆/注册入口,登陆后显示用户名,点击可跳转至个人中心
    1.3 用户可以选择城区、入住时间、离开时间等条件进行搜索
    1.4 城区的区域信息需动态加载

2. 注册
    2.1 用户账号默认为手机号
    2.2 图片验证码正确后才能发送短信验证码
    2.3 短信验证码每60秒可发送一次
    2.4 每个条件出错时有相应错误提示

3. 登陆
    3.1 用手机号与密码登陆
    3.2 错误时有相应提示

4. 房屋列表页
    4.1 可根据入住离开时间、区域进行筛选,并可进行排序
    4.2 房屋信息分页加载
    4.3 区域信息动态加载
    4.4 筛选条件更新后,页面立即刷新

5. 房屋详情页
    5.1 需展示的详细信息参考设计图
    5.2 提供预定入口
    5.3 若是房东本人查看房屋信息时,预定入口不显示

6. 房屋预定
    6.1 由用户确定入住时间
    6.2 根据用户确定的入住离开时间实时显示合计天数与总金额

7. 我的爱家
    7.1 显示个人头像、手机号、用户名(用户名未设置时为用户手机号)
    7.2 提供修改个人信息的入口
    7.3 提供作为房客下单的查询入口
    7.4 提供成为房东所需实名认证的入口
    7.5 提供作为房东发布房屋信息的入口
    7.6 提供作为房东查询客户订单的入口
    7.7 提供退出的入口

8. 个人信息修改
    8.1 可以修改个人头像
    8.2 可以修改用户名
    8.3 登陆手机号不能修改
    8.4 上传头像与用户名分开保存
    8.5 上传新头像后页面理解显示新头像

9. 我的订单(房客)
    9.1 按时间倒序显示订单信息
    9.2 订单完成后提供评价功能
    9.3 已评价的订单能看到评价信息
    9.4 被拒绝的订单能看到拒单原因

10. 实名认证
    10.1 实名认证只可进行一次
    10.2 提交认证信息后再次进入只能查看信息,不能修改
    10.3 认证信息包含姓名与身份证号

11. 我的房源
    11.1 未实名认证的用户不能发布新房源信息,需引导到实名认证页面
    11.2 按时间倒序显示已经发布的房屋信息
    11.3 点击房屋可以进入详情页面
    11.4 对实名认证的用户提供发布新房屋的入口

12. 发布新房源
    12.1 需要用户填写全部房屋信息
    12.2 房屋的文字信息与图片分开操作

13. 客户订单(房东)
    13.1 按时间倒序显示用户下的订单
    13.2 对于新订单提供接单与拒单的功能
    13.3 拒单必须填写拒单原因
    13.4 若客户进行了订单评价,需显示

14. 退出
    14.1 提供退出功能

Flask项目之手机端租房网站的实战开发(一)的更多相关文章

  1. Flask项目之手机端租房网站的实战开发(三)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  2. Flask项目之手机端租房网站的实战开发(二)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  3. Flask项目之手机端租房网站的实战开发(十四)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  4. Flask项目之手机端租房网站的实战开发(六)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  5. Flask项目之手机端租房网站的实战开发(十一)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  6. Flask项目之手机端租房网站的实战开发(十)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  7. Flask项目之手机端租房网站的实战开发(九)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  8. Flask项目之手机端租房网站的实战开发(八)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  9. Flask项目之手机端租房网站的实战开发(四)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

随机推荐

  1. 从2014年D2前端技术论坛看前端发展趋势

    上周六有幸參加了在杭州阿里巴巴西溪园区举办的2014年D2前端技术论坛和晚上的酒会.实地感受了一下阿里巴巴前端开发的技术氛围和影响力.整体上看这次D2规模还是挺大的,国内前端的知名大牛基本上都到了. ...

  2. nagios插件之登陆防火墙实现session监控

    ssh_firewall_session.sh -- 登陆防火墙并运行dis session statistics firewall_check_sessions.c -- 调用上面脚本.过滤出ses ...

  3. The ORDER BY clause is invalid in views, inline functions, derived tables, subqueries, and common table expressions, unless TOP or FOR XML is also specified.

    https://stackoverflow.com/questions/30045871/sorting-the-view-based-on-frequency-in-sql-server Just ...

  4. android学习笔记五。1、Service深入学习

    一.Service,服务是没有界面而在后台长期运行的程序,可以看做是后台的Activity. 1.在Android中按返回键退出一个应用并不会(内存充足时)直接销毁一个进程,所以其中的子线程也可以在后 ...

  5. ajax的使用(一)

        ajax向服务器异步发送和接受数据,然后用JavaScript解析.Ajax核心规范的名称继承于你用来建立和发送请求的JavaScript对象:XMLHttpRequest.这个规范有两个等级 ...

  6. Vue自定义指令实现下拉加载:v-loadmore

    和methods平级: directives: { loadmore: {//自定义指令: 下拉加载 bind(el, binding) {    var p = 0;    var t = 0;  ...

  7. 思科模拟器之路由器-RIP-DNS解析server

    思科三层交换机之下的局域网搭建,请看这. 接下来将解说怎样通过路由器的RIP协议来连接多个局域网. 并设置DNSserver. 1.路由器RIP配置 RIP协议有个非常致命的缺点:就是它是依据路径长短 ...

  8. [Redux-Observable && Unit Testing] Mocking an ajax request when testing epics

    Often in unit tests we are focussing on the logic involved in crafting a network request, & how ...

  9. Java遍历目录下全部文件并替换指定字符串

    应用场景:比方有一个深层次的文件目录结构,如:javaAPI 每一个文件中面都有同样的内容,而我们要统一改动为其它内容.上千个文件假设一个个改动显得太不明智. import java.io.Buffe ...

  10. js29--装饰着模式

    //装饰者模式:就是在保证不改变原有对象的基础上,去扩展一些想要的方法或去求 var CarInterface = new BH.Interface('CarInterface' , ['getPri ...