前言

最近公司要求基于公司的hadoop平台做一个关于电信移动网络的数据分析平台,整个项目需求大体分为四大功能模块:数据挖掘分析、报表数据查询、GIS地理化展示、任务监控管理。由于页面功能较复杂,所以采用前后端分离方式开发。前端采用webpack+vue+vue-router+axios技术栈,后端用django进行开发。从搭建到上线,整个项目前前后后花了差不多一个月时间,中途也遇到一些问题,不过还好都解决了。由于是个人项目,所以我打算把源码贡献出来大家一起讨论学习。

源代码

后端:https://github.com/dotafeiying/myproject

前端:https://github.com/dotafeiying/appfont

关于技术选型

由于页面交互较多,所以整个项目采用前后端分离方式开发。使用Vue.js作为前端框架,代替Django本身较为孱弱的模板引擎,Django则作为服务端提供api接口,使得前后端实现完全分离,更适合单页应用的开发构建。

使用框架

前端:

webpack + vue + axios + element-ui + iview + zui + jquery

后端:

django + celery

数据库:

mysql + redis

数据分析:

impala + pandas + sklearn

项目目录

前端

后端

实现的功能

1、文件上传预览

2、异步任务执行

3、websocket实现实时进度

4、表格分页

5、excel文件动态导出

6、pandas数据分析

7、impala大数据实时查询分析

8、KMeans、DBSCAN聚类分析

9、距离计算算法优化

10、GIS地图展示

11、websocket实现实时进度和动态渲染

12、百度地图批量经纬度转换(服务端实现)

13、历史数据流式查询,解决数据量过大问题

14、树组件懒加载,改善用户体验

15、excel文件流式导出

16、celery异步任务监控管理,websocket实时监控

17、django后台管理

18、项目部署nginx+uwsgi+django+centos7.5

效果图:

文件上传前进行数据核查和预览

异步任务执行和实时进度

表格分页

海量点聚类分析和GIS展示

历史数据流式查询和树节点懒加载

异步任务实时监控和管理

从零开始搭建django前后端分离项目 系列一(技术选型)的更多相关文章

  1. 从零开始搭建django前后端分离项目 系列四(实战之实时进度)

    本项目实现了任务执行的实时进度查询 实现方式 前端websocket + 后端websocket + 后端redis订阅/发布 实现原理 任务执行后,假设用变量num标记任务执行的进度,然后将num发 ...

  2. 从零开始搭建django前后端分离项目 系列三(实战之异步任务执行)

    前面已经将项目环境搭建好了,下面进入实战环节.这里挑选项目中涉及到的几个重要的功能模块进行讲解. celery执行异步任务和任务管理 Celery 是一个专注于实时处理和任务调度的分布式任务队列.由于 ...

  3. 从零开始搭建django前后端分离项目 系列二(项目搭建)

    在开始项目之前,假设你已了解以下知识:webpack配置.vue.js.django.这里不会教你webpack的基本配置.热更新是什么,也不会告诉你如何开始一个django项目,有需求的请百度,相关 ...

  4. 从零开始搭建django前后端分离项目 系列六(实战之聚类分析)

    项目需求 本项目从impala获取到的数据为用户地理位置数据,每小时的数据量大概在8000万条,数据格式如下: 公司要求对这些用户按照聚集程度进行划分,将300米范围内用户数大于200的用户划分为一个 ...

  5. 从零开始搭建django前后端分离项目 系列五(实战之excel流式导出)

    项目中有一处功能需求是:需要在历史数据查询页面进行查询字段的选择,然后由后台数据库动态生成对应的excel表格并下载到本地. 如果文件较小,解决办法是先将要传送的内容全生成在内存中,然后再一次性传入R ...

  6. Django前后端分离项目部署

    vue+drf的前后端分离部署笔记 前端部署过程 端口划分: vue+nginx的端口 是81 vue向后台发请求,首先发给的是代理服务器,这里模拟是nginx的 9000 drf后台运行在 9005 ...

  7. luffy项目搭建流程(Django前后端分离项目范本)

    第一阶段: 1.版本控制器:Git      2.pip安装源换国内源    3.虚拟环境搭建        4.后台:Django项目创建 5.数据库配置              6.luffy前 ...

  8. nginx+vue+uwsgi+django的前后端分离项目部署

    Vue+Django前后端分离项目部署,nginx默认端口80,数据提交监听端口9000,反向代理(uwsgi配置)端口9999 1.下载项目文件(统一在/opt/luffyproject目录) (1 ...

  9. List多个字段标识过滤 IIS发布.net core mvc web站点 ASP.NET Core 实战:构建带有版本控制的 API 接口 ASP.NET Core 实战:使用 ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目 Using AutoFac

    List多个字段标识过滤 class Program{  public static void Main(string[] args) { List<T> list = new List& ...

随机推荐

  1. SDN的初步实践--通过netconf协议控制交换机

    1.近期在做一个云服务项目,需要与物理交换机配合实现,通过python编程实现了对物理交换机的控制,完全不需要命令行手工配置交换机, 一定程度上实现了SDN的集中控制的思想. 2.架构图如下: 3.利 ...

  2. IIS做反向代理重定向到NodeJS服务器

    1. 安装ARR 2. 建立虚拟目录并配置URL Rewrite 3. 启动ARR

  3. Java相关问题整理

    1. OkHttpClient调用出现大量CLOSE_WAIT. 问题定位: 凡是系统中出现大量的CLOSE_WAIT,说明你的代码写的有问题,即:没有关闭连接. 在OkHttpClient中,默认时 ...

  4. (转载)解决NVIDIA显卡驱动“没有找到兼容的图形硬件”的问题

    (转载)解决NVIDIA显卡驱动“没有找到兼容的图形硬件”的问题 原出处:http://www.cnblogs.com/longdouhzt/archive/2012/02/28/2370660.ht ...

  5. vue缓存页面【二】

    keep-alive是vue内置的一个组件,可以使被它包含的组件处于保留状态,或避免被重新渲染. 用法:运行结果描述:input输入框内,路由切换输入框内部的内容不会发生改变.在keep-alive标 ...

  6. Web前端:博客美化:二、鼠标特效

    1.获取JS权限 因为是js代码所以需要放在 侧边栏公告 里 没开通之前,有一个申请的链接,点击即可,我是第二天才看到过审的 ^-^ 2.Ctrl+C.Ctrl+V 数组里的文字随自己心情啦 另:30 ...

  7. SparkSQL【1.x版本】字段敏感不敏感问题

    一.特征 1.SqlContext默认大小写不敏感,如果DataFrame中有字段相同,大小写不同,在使用字段的时候不会引起歧义. 2.HiveContext提供更多的Hive预置函数,可以更高效的进 ...

  8. mssql sqlserver update delete表别名用法简介

    转自:http://www.maomao365.com/?p=6973  摘要: 在sql脚本编写中,如果需要在update delete 中使用表别名的方法,必须按照一定的规则编写,否则将会出现相应 ...

  9. 数据库之mysql篇(2)—— mysql常识引入/用户授权

    常识引入 1.概念: 数据库:本质上是一个文件夹 1)查看本机所有数据库:show databases; 结束符:分号[:],一切数据行的结尾都以分号作为结束 2)创建数据库:create  数据库名 ...

  10. syslog的坑

    先看看代码: g_log, err := syslog.NewLogger(syslog.LOG_INFO, ) 再看看syslog的源码: // NewLogger creates a log.Lo ...