使用vue制作简单的bangumi数据分析前端

Anime Garden:基于开放API与结构化数据的动画资源聚合平台 在数据驱动的互联网时代,API(应用程序编程接口)作为系统间数据交互的标准化桥梁,已成为现代软件开发的核心组件。其原理是通过预定义的协议和格式,允许不同应用安全、高效地交换信息。这种技术价值在于极大提升了数据的可访问性和可编程性,使开发者能够基于现有服务快速构建个性化工具。在资源聚合与内容分发领域,通过API对多源异构数据进行清洗、解析和结构化处理,能够将原始的非结构化信息转化为机器可读的格式,从而支撑起精准搜索、自动化订阅等高级应用场景。本文聚焦的Anime Garden项目,正是这一理念的典型实践。它围 阅读详情

用vue做了一个web应用的前端并且进行了生产环境的部署。

​演示地址:http://digbgm.masterkagami.com

源码仓库:https://github.com/viogami/DigBGM_vite

使用vite构建,我写了大量注释,入门级玩具,基本从0开始做的。
使用了响应式布局,但更支持pc界面。
目前调用的bangumi的api还没链接后端。

后端准备用go写。实现对bangumi的数据分析。目前完成了调用bangumi的api获取各种数据。但准备搁置了,有空闲了去开发后端。🤗


不得不说vue是真的好用,基本官方文档就能解决90%的问题,构建后大小也很惊人, 只有几MB。
其实完成了这个,vue的使用倒没有熟练多少,更多是了解了很多前端技术栈的知识,特别是走完从开发到生产环境部署的全流程,实践一遍可以学到很多以为简单但并没那么简单的事情。比如api的调用跨域,build的nginx的反代理问题,刷新404问题,都是典中典,新手是这样的😨

前端最大的问题,我觉得是配css,这是最折磨的,特别我还有轻微强迫,还好我也不是主营前端,css凑合吧…

如果可以,​给个star鼓励一下🥰

api:在Bangumi上构建您的应用 Bangumi API 开始使用 API 前,请至 创建应用。 欢迎 PR 提供更详细的文档描述或格式优化。 立即下载

相关推荐

bangumi-ga:基于bangumi-data和bangumi.tv api的蜘蛛

Bangumi API爬虫 基于中的bangumi id,使用进行数据爬取的爬虫。 因为Bangumi的API有CORS限制,所以写了这个爬虫+利用(白嫖)jsdelivr cdn加速给我自己写的番剧网站使用。 因为使用GitHub Actions来更新数据就直接叫做bangumi-ga了。(很随便的命名方式。 使用注意 :warning: :warning:请不要叉,因为GitHub Actions也将过去。那样会给番组计划的服务器造成压力;又或者请求过多,有可能触发拒绝请求的保护机制,导致工作流程失败。 数据不是实时,利用GitHub Actions每天爬取最新的数据。与最新的数据最大会有一天的时差。 数据不是番组计划全站的数据,只包含bangumi-data里面有bangumi id的。bangumidata里没有bangumi id的数据不会爬取。据我所知,在更新这readme时的最新版本0.3.30中是有

【亲测免费】 Bangumi API —— 你的二次元信息宝藏

Bangumi API —— 你的二次元信息宝藏 1、项目介绍 Bangumi API 是一个开放的、社区驱动的项目,旨在为开发者和爱好者提供获取二次元相关数据的接口。这个API覆盖了动漫、番剧、游戏等丰富的内容,让你能轻松地构建自己的二次元世界。它遵循标准的 RESTful 设计原则,并且持续更新以保持与Bangumi网站的数据同步。 2、项目技术分析 Bangumi API 使用 YAML 格...

gitblog_00077的博客 2114

Windows Server 域控搭建:AD DS 规划、部署与排障实战

活动目录(AD DS)是 Windows Server 中用于集中管理账号、计算机与策略的核心目录服务,其底层依赖 DNS、Kerberos 和 LDAP 完成身份认证与资源定位。通过域控制器统一身份、组策略和权限边界,企业可显著降低多机环境下账号维护、权限分配与审计成本。十几到上百台终端、有共享隔离与合规要求的局域网,通常适合部署域控;小规模环境则未必划算。围绕域名规划、DNS 指向、OU 设计、FSMO、备份恢复和常见加域故障,域控搭建与 AD 运维需要兼顾前期规划与长期排障,才能让 Windows S

weixin_33845881的博客 761

使用 APIfox 进行OAuth 2.0 登录测试 (以bangumi为例)

通过弹出来的网页,登录账号获得授权之后就可以拿到Token了。步骤 1:获取客户端 ID 和客户端密钥。注意回调地址,待会要用到。设置为OAuth 2.0。最后点击获取Token。登录创建一个新应用。APIfox 客户端。

zxxbilan的博客 611

FreeModbus V1.6主机模式实战:如何在STM32上实现Modbus RTU主从一体通信

本文详细介绍了如何在STM32平台上利用FreeModbus V1.6开源协议栈实现Modbus RTU主从一体通信。文章深入剖析了V1.6版本主机模式的架构设计,提供了从硬件配置、串口与定时器移植到FreeRTOS操作系统适配的完整实战指南,并分享了数据缓冲区管理、多线程协同及高级调试技巧,为构建稳定可靠的工业通信网关提供了系统化解决方案。

weixin_29194255的博客 373

【全解析 | PTA】浙大版《Python 程序设计》题目集-第一章

Python浙大版PTA题解

wzhh_的博客 5527

【亲测免费】 探索Bangumi-Data:一个强大的二次元资源库与API

探索Bangumi-Data:一个强大的二次元资源库与API 项目简介 是一个面向二次元爱好者的开放源代码项目,它提供了一个全面、实时更新的动漫数据集,并提供了丰富的RESTful API接口,便于开发者和爱好者获取和利用这些信息。无论是为你的个人项目增加动漫资讯,还是构建自己的二次元应用,Bangumi-Data都是一个值得信赖的资源库。 技术分析 该项目基于Python编写,利用了Django...

gitblog_00060的博客 2492

【RT-DETR涨点改进】独家注意力改进篇 | 手把手教你在RT-DETR上使用LSKAttention大核注意力机制(助力目标检测极限涨点)含多种创新改进点

本文提出了一种LSKA大核注意力机制优化RT-DETR模型的方法。LSKA通过将2D深度卷积核分解为级联的1D水平和垂直核,显著降低了计算复杂度和内存占用,尤其在处理大卷积核时优势明显。该模块在图像分类、目标检测等视觉任务中保持与LKA相当的性能,同时展现出更强的鲁棒性。文章详细介绍了LSKA的网络结构、核心代码实现方法,并提供了多种RT-DETR改进方案,包括rtdetr-r18-LSKA、rtdetr-l-LSKA等7种yaml配置文件,通过实验验证了该方法的有效性。

Ai缝合怪、助力小伙伴高效发论文 252

action php,Action.php

class BangumiAPI{/** OooOooOooO **/private static $bangumiAPI = null;/** 静态成员 **///应用程序名private static $appName = "BGMYetu";//api链接private static $apiUrl = "https://api.bgm.tv";/** 成员 **///用户名(邮箱)pub...

weixin_32236415的博客 384

C#实现自己的远程桌面控制工具

1. 创建一个winform工程并添加RDP客户端COM组件。右击工具箱,然后点击选择项,选中下图所示组件并点击确定。为窗口加载时添加自动连接远程桌面代码。3.调试运行程序,验证远程桌面控制。拖放RDP控件到窗口中。2.编写远程桌面连接代码。

6089

EMB电子机械制动系统和EHB电子液压制动系统控制功能的对比

EMB电子机械制动系统相比EHB液压制动系统具有显著优势:响应速度更快(<100ms)、控制精度更高(±2N·m)、能实现单轮独立控制,支持0.1%级制动力调节。在ABS、ESC等安全功能上表现更优,制动平顺性和NVH性能更好,同时提升能量回收效率15%-20%。特别适合智能驾驶需求,可使AEB等系统响应时间缩短50ms,紧急制动距离减少1米以上。EMB系统完美契合高阶自动驾驶对快速响应和精准控制的要求。

m0_59012156的博客 885

探索 Bangumi 新境界:基于 React/TypeScript/Vite 的前端之旅

探索 Bangumi 新境界:基于 React/TypeScript/Vite 的前端之旅 随着前端技术的不断发展,我们迎来了一个令人兴奋的开源项目 —— Bangumi Frontend Project。这不仅仅是一个项目,它是对于追番、漫谈社区的一次技术革新,为热爱ACG文化的开发者和用户提供了一个全新的交互平台。让我们一起揭开它的神秘面纱。 项目介绍 Bangumi Frontend Pro...

gitblog_00358的博客 431

链接文件及功能安全:基于Tasking的LSL链接文件知识点梳理及实际应用分析

本文旨在记录研究链接文件时所遇到的问题及个人理解,以便日后查阅。在探索过程中,我遇到了诸多问题,同时对链接文件有了初步的认识。通过记录这些问题与理解,我希望能够为后续的研究提供清晰的思路和有价值的参考。这不仅是对研究过程的总结,更是对未来学习和实践的有力支持。

梦想技术家 1103

AutoBangumi 日历视图完全指南:按放送日组织订阅番剧、Bangumi.tv 放送表集成与手动调度

AutoBangumi(AB)自 v3.2 起内置了日历视图(Calendar View),它将你订阅的全部番剧按周一到周日的放送日组织成一张周历,并深度集成 Bangumi.tv 放送表数据自动标注每部番剧的播出星期。本文基于 [英文官方文档](https://link.gitcode.com/i/74b4f7afe66be4f7691eca1a652a25a6) 并结合仓库源码,完整讲解日历视

gitblog_00237的博客 341

IEM模型,地表粗糙度模拟

利用微波反演土壤水分时候,利用IEM模型可以实现对随机地表的模拟

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

AutoBangumi 网络设置(Network Settings)完全指南:TMDB 与 Bangumi API 端点及密钥配置

网络设置是 AutoBangumi 中负责"外部元数据源"的配置区块:它决定了番剧元数据(标题、季度、集数、海报)从哪个 TMDB 接口获取、番剧日历从哪个 Bangumi 接口获取,以及调用时携带哪个 API 密钥。默认配置即可开箱即用,但当网络环境无法直连官方端点、或希望摆脱内置共享密钥的限流时,你就需要理解并修改这三项参数。读完本文,你将掌握网络设置每一项的含义、`config.json`

gitblog_00636的博客 212

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

Ani (Animeko):一款开源弹幕追番平台,从找番到看完一集只要 5 步

Ani,曾用名 Animeko,是一款用 Kotlin 编写的开源弹幕追番平台。它把 Bangumi 收藏同步、在线与 BT 双类型资源播放、弹幕和离线缓存放在同一个界面里,覆盖 Android、iOS、Windows、macOS 和 Linux 五个平台。 ## 追番这件事,你现在的流程可能是这样的 先看 Bangumi 上的剧情和评分,确认要追哪部;再翻几个资源站找字幕组的发布页,对比哪个

gitblog_00526的博客 644

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

动漫花园:跨端追番工具,进度不丢的免费选择

手机看到第 8 集,切到电脑发现进度全没了,这种追番断点你大概率遇到过。动漫花园(animation-garden)是一个基于 Compose Multiplatform 构建的全平台追番工具,内置 BT 种子与在线视频源,观看进度和收藏都能同步,一部手机或一台电脑装下就能用。 ## 1. 上手:从安装到打开第一集 ### 下载哪个版本 从官方渠道下载你所在平台的安装包即可,它覆盖 Andr

gitblog_00879的博客 516

OpenStock 免费股票工具完整指南:实时行情、自选股与价格提醒五步跑起来

如果你还在手动刷好几个标签页盯价格,OpenStock 值得花十分钟配起来:这是一款**免费的开源股票工具**,自带实时行情、自选股、价格提醒、TradingView 图表与 AI 每周要闻,全程零订阅费,AGPL-3.0 协议开源。 [![OpenStock 免费股票工具仪表盘:实时行情、自选股与热力图面板](https://raw.gitcode.com/GitHub_Trending/op

gitblog_00545的博客 445

3步搭建智能媒体库:MoviePilot让NAS影视管理变简单

MoviePilot是一个专注于NAS媒体库自动化管理的开源工具,通过智能化的设计和简洁的操作界面,让电影和电视剧的自动化管理变得前所未有的轻松。这个基于FastApi + Vue3现代化架构的项目,为影视爱好者提供了完整的自动化管理体验,让您的媒体库管理从繁琐变为简单。 ## 🎬 为什么你需要一个媒体库自动化工具? 在数字媒体时代,我们收藏的电影和电视剧越来越多,手动管理这些内容变得异常繁

gitblog_00061的博客 396

AutoBangumi 全自动追番工具:基于 RSS 的番剧下载、自动重命名与媒体库整理原理详解

AutoBangumi 是一款基于 RSS 订阅的全自动番剧下载与整理工具,用户只需在 Mikan Project 等站点订阅番剧,即可由程序自动完成新剧集追踪、下载、重命名与目录整理。本文以项目官方"关于"文档为骨架,结合 [RSS 引擎](https://link.gitcode.com/i/2cdc0a57426e72b8dc46b1712a54579e)、[重命名器](https://li

gitblog_00426的博客 1186

我的周刊(第048期)

我的信息周刊,记录这周我看到的有价值的信息,主要针对计算机领域,内容主题极大程度被我个人喜好主导。这个项目核心目的在于记录让自己有印象的信息做一个留存以及共享。???? 项目flet[1]用 Python 开发跨平台 Flutter 应用:FletBGmi[2]BGmi 用于订阅 bangumi 漫画更新的项目,支持 Web UI 和终端:BGmiappwrite[3]Appw...

howie6879's blog 765

Animeko 跨平台追番实用指南:一个 App 同步进度、缓存与看番

Animeko(曾用名 Ani)是一款开源追番应用,把找番、追番、看番放在同一个应用里。它用 Kotlin Multiplatform 编写,即一套代码同时跑在 Android、iOS、Windows、macOS、Linux 上,支持 Bangumi 云同步观看记录、离线缓存和 BitTorrent 边下边播。如果你受够了"资源在网页、进度在网页、弹幕在网页",这篇指南会带你把它用起来。 ##

gitblog_00363的博客 733

基于OpenClaw与CloudBase的对话即代码实践:构建智能追番助手

函数调用(Function Calling)是大语言模型(LLM)实现工具使用能力的关键技术,它使模型能够将自然语言指令解析为结构化的API调用参数,从而连接外部工具与数据源。其核心原理是通过精心设计的提示词(Prompt Engineering),引导模型理解用户意图并输出符合预定格式的JSON数据,实现从“对话”到“可执行代码”的转换。这一技术价值在于极大降低了开发智能对话系统的门槛,开发者无需训练复杂的NLP模型,即可快速构建能理解模糊意图、调用多样服务的应用。典型的应用场景包括智能客服、个人助理、自

weixin_30482383的博客 368

如何在2026年免费下载B站视频?BiliTools哔哩哔哩工具箱完整使用指南

还在为无法保存B站的精彩内容而烦恼吗?BiliTools哔哩哔哩工具箱正是为你准备的完美解决方案!这款跨平台开源工具让你轻松下载B站视频、番剧、音乐等各类资源,支持4K超高清、HDR等高级格式,还能完整保存弹幕和字幕。无论你是Windows、macOS还是Linux用户,都能获得一致流畅的体验。 ## 从新手到高手:BiliTools如何解决你的真实痛点 想象一下这个场景:你发现了一个精彩的B

gitblog_00436的博客 538

ANI-RSS安装使用教程:5分钟部署你的RSS自动追番工具

ANI-RSS是一个基于RSS自动追番的Web工具,你填好萌番小组的RSS链接,新番更新后它自动抓种子、推给你的下载器,再完成刮削和洗版。把它装到家庭服务器上,之后你只需要看新番出现,不用手动盯。本文按"装起来 → 验证跑通 → 改配置"的顺序讲一遍完整的ANI-RSS安装与使用方法,有Docker的话5分钟就能跑起来。 ## 先把它跑起来 运行环境很简单:这是个Java程序,宿主机需要Jav

gitblog_01118的博客 79
上一篇: Axios中请求成功了,却仍然被catch捕获
下一篇: 各种编程语言性能和难易度对比
空气力学先驱
博客等级 码龄6年 154粉丝 30原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值