学习

如何在 AWS 平台使用 NodeJS 和 Redis 构建并部署您自己的分析仪表板

交互式分析仪表板有多种用途。它们使您可以共享数据,并为您提供所有重要信息,以便更快地做出改变游戏规则的决策。使用传统的关联式数据库构建实时动态仪表板可能需要复杂的查询集。通过使用像 Redis 这样的 NoSQL 数据库,您可以使用少量 Redis 命令构建强大的交互式动态仪表板。


让我们看看这是如何实现的。

  • 您将构建什么?
  • 您需要什么?
  • 快速入门
  • 它如何工作?
  • 数据如何存储
  • 导航应用

您将构建什么?
您将构建一个使用 NodeJS (JavaScript) 编写并部署到 AWS 的分析仪表板应用,该应用使用 Redis Bitmap。准备好开始了吗?好的,让我们直接深入了解。


    您需要什么?

  • NodeJS:用作一个开源、跨平台、后端 JavaScript 运行时环境,可在 Web 浏览器外部执行 Javascript 代码。
    Redis Cloud:用作实时数据库、缓存和消息代理。
  • NPM:用作包管理器。它允许您构建 Node 应用。

快速入门

准备环境


安装 Node - v12.19.0

  • 安装 NPM - v6.14.8

步骤 1. 注册免费的 Redis Cloud 账户

注册免费的 Redis Cloud 账户


在创建新订阅时选择 AWS 作为云供应商。数据库创建过程结束时,您将获得 Redis Cloud 数据库端点和密码。您可以保存以备后用。


步骤 2. 克隆仓库

 git clone https://github.com/redis-developer/basic-analytics-dashboard-redis-bitmaps-nodejs

步骤 3. 设置后端环境

首先我们将设置环境变量

进入 /server 文件夹 (cd ./server) 并执行以下命令
 cp .env.example .env
打开 .env 文件并添加 Redis Cloud 数据库端点 URL、端口和密码,如下所示
PORT=3000

# Host and a port. Can be with `redis://` or without.
# Host and a port encoded in redis uri take precedence over other environment variable.
# preferable
REDIS_ENDPOINT_URI=redis://redis-XXXX.c212.ap-south-1-1.ec2.cloud.redislabs.com:15564

# Or you can set it here (ie. for docker development)
REDIS_HOST=redis-XXXX.c212.ap-south-1-1.ec2.cloud.redislabs.com
REDIS_PORT=XXXX

# You can set password here
REDIS_PASSWORD=reXXX

COMPOSE_PROJECT_NAME=redis-analytics-bitmaps

步骤 4. 安装依赖

 npm install

步骤 5. 运行后端

 npm run dev

步骤 6. 设置前端环境

进入 client 文件夹 (cd ./client),然后

 cp .env.example .env
为 VUE_APP_API_URL 参数添加您选择的精确 URL 路径和端口号,如下所示
VUE_APP_API_URL=http://localhost:3000

步骤 7. 安装依赖

 npm install

步骤 8. 运行前端

 npm run serve

它如何工作?

数据如何存储:

事件数据存储在各种键和数据类型中,详情如下所述

对于每个时间范围:
  • 年:例如 2021
  • 月:例如 2021-03 (表示 2021 年 3 月)
  • 天:例如 2021-03-03 (表示 2021 年 3 月 3 日)
  • 月中的周:例如 2021-03/4 (表示 2021 年 3 月的第 4 周)
  • 任何时间

对于每个范围:
  • 来源
  • 操作
  • 来源 + 操作
  • 操作 + 页面
  • 用户 ID + 操作
  • 全局

对于每种数据类型/类型:
  • 计数 (作为字符串存储的整数)
  • 位图
  • 集合

它生成具有以下命名约定的键

 rab:{type}[:custom:{customName}][:user:{userId}][:source:{source}][:action:{action}][:page:{page}]:timeSpan:{timeSpan}

其中 [] 中的值是可选的。

对于每个生成的键,如 rab:count:*,数据存储方式如下: INCR {key}

示例
 INCR rab:count:action:addToCart:timeSpan:2015-12/3
对于每个生成的键,如: rab:set:*,数据存储方式如下:
 SADD {key} {userId}
示例
SADD rab:set:action:addToCart:timeSpan:2015-12/3 8
对于每个生成的键,如 rab:bitmap:*,数据存储方式如下:
 SETBIT {key} {userId} 1
示例
 SETBIT rab:bitmap:action:addToCart:timeSpan:2015-12/3 8 1

同期群数据

  • 我们存储那些注册后购买了某些产品的用户(操作顺序很重要)。
  • 对于 12 月的每次购买操作,我们首先检查用户是否执行了注册操作(注册计数器必须大于零)。
  • 如果是,我们将用户位设置为 1
示例
 SETBIT rab:bitmap:custom:cohort-buy:timeSpan:{timeSpan} {userId} 1
  • 示例 - 用户 ID 2 于 2015 年 12 月 17 日购买了 2 个产品。它不会被存储。
  • 示例 - 用户 ID 10 于 2015 年 12 月 17 日购买了 1 个产品,并于 2015 年 12 月 16 日注册。因此,它将存储为
SETBIT rab:bitmap:custom:cohort-buy:timeSpan:2015-12 10 1
  • 我们假设用户必须先注册才能购买。

留存数据

  • 留存是指在两个不同日期购买过的用户

  • 对于每次购买操作,我们检查用户在任何时间购买的产品是否多于在特定日期购买的产品(不包括当前购买)。

  • 如果是,我们将用户 ID 添加到集合中,例如

SADD rab:set:custom:retention-buy:timeSpan:{timeSpan} {userId}
  • 示例 - 用户 ID 5 于 2015 年 12 月 15 日购买了 3 个产品。他的留存不会被存储(特定日期购买产品数:2,任何时间购买产品数:0)。

  • 示例 - 用户 ID 3 于 2015 年 12 月 15 日购买了 1 个产品,之前于 2015 年 12 月 13 日购买了 1 个产品。他的留存将被存储(特定日期购买产品数:0,任何时间购买产品数:1),例如

SADD rab:set:custom:retention-buy:timeSpan:2015-12

数据如何访问:

总流量:

12 月
BITCOUNT rab:bitmap:custom:global:timeSpan:2015-12```
12 月的第 X 周
  BITCOUNT rab:bitmap:custom:global:timeSpan:2015-12/{X}
示例
BITCOUNT rab:bitmap:custom:global:timeSpan:2015-12/3

每页面流量({page} 是以下之一:主页, 产品1, 产品2, 产品3):

12 月
 BITCOUNT rab:bitmap:action:visit:page:{page}:timeSpan:2015-12
示例
BITCOUNT rab:bitmap:action:visit:page:homepage:timeSpan:2015-12
12 月的第 X 周
BITCOUNT rab:bitmap:action:visit:page:{page}:timeSpan:2015-12/{X}
示例
BITCOUNT rab:bitmap:action:visit:page:product1:timeSpan:2015-12/2

每来源流量({source} 是以下之一:Google, Facebook, 电子邮件, 直接访问, 推荐, 无):

12 月
 BITCOUNT rab:bitmap:source:{source}:timeSpan:2015-12
示例
BITCOUNT rab:bitmap:source:referral:timeSpan:2015-12
12 月的第 X 周
BITCOUNT rab:bitmap:source:{source}:timeSpan:2015-12/{X}
示例
BITCOUNT rab:bitmap:source:google:timeSpan:2015-12/1
趋势流量({page} 是以下之一:主页, 产品1, 产品2, 产品3):
12 月:

BITCOUNT rab:bitmap:action:visit:{page}:timeSpan:2015-12-01
 BITCOUNT rab:bitmap:action:visit:{page}:timeSpan:2015-12-31
  • 12 月第 1 周:与上述类似,但日期范围从 2015-12-01 到 2015-12-07
  • 12 月第 2 周:与上述类似,但日期范围从 2015-12-08 到 2015-12-14
  • 12 月第 3 周:与上述类似,但日期范围从 2015-12-15 到 2015-12-21
  • 12 月第 4 周:与上述类似,但日期范围从 2015-12-22 到 2015-12-28
  • 12 月第 5 周:与上述类似,但日期范围从 2015-12-29 到 2015-12-31
示例
 BITCOUNT rab:bitmap:action:visit:homepage:timeSpan:2015-12-29 => BITCOUNT rab:bitmap:action:visit:homepage:timeSpan:2015-12-30 => BITCOUNT rab:bitmap:action:visit:homepage:timeSpan:2015-12-31

购买的产品总数:

12 月
 GET rab:count:action:buy:timeSpan:2015-12
12 月的第 X 周
 GET rab:count:action:buy:timeSpan:2015-12/{X}
示例
GET rab:count:action:buy:timeSpan:2015-12/1