【Cursor实战】实现一个爬取Github Trending热榜插件

前言

今天继续使用Cursor练手,实现一个简单的获取Github trending信息的浏览器扩展,优秀开源项目一键触达。

限制

GitHub Trending 是国外网站,有时会出现拉取失败的情况,拉取失败时可以在浏览器打开看是否可以正常访问

Github Trending简介

GitHub Trending 是一个可以实时展示Github上最受关注和最受欢迎的开源项目,在这里我们可以时刻找到优秀的开源项目,学习到具有价值的技术和信息。

Github Trending官网地址:github.com/trending

使用Cursor开发

使用Cursor开发项目第一步还是要写清楚项目背景、要求,今天开发的是浏览器插件,为了使Cursor具备更强的浏览器插件知识和开发能力,我们可以使用大佬开发的Cursor提示词插件为项目添加一个.cursorrules(有要求的小伙伴也可以自己写)

使用Cursor Rules

Cursor插件市场搜索下面的插件进行安装

安装完成,使用快捷键【Cmd+Shift+P】唤起命令面板,选择【添加Cursor规则文件】回车

选择【Chrome插件】

添加完成后,我们就拥有了一个完整的浏览器插件的提示词

插件开发

有了提示词下面就是要通过提示词描述我们的需求了,我们的提示词可以大致描述如下:

markdown 复制代码
我准备开发一个基于V3版本的浏览器插件,该插件的主要功能是通过爬虫解析github trending网页获取对应的项目列表信息,我会为你提供相关材料和要求:
1. github trending地址:https://github.com/trending
2. 解析并获取网页中`Repositories`的下项目的详细信息,包括项目名称、描述、stars数、今天的stars数、follow数及项目url
3. 浏览器插件通过列表的形式合理展示爬取的项目列表信息,点击项目列表可以跳转到对应的github项目
- 插件页面结构简洁明了,使用大厂设计风格和配色方案          

为了让Cursor更好的理解和分析网址,可以将github.com/trending链接单...

等待Cursor完成,这里Cursor没有直接提供icon图标,而是给了2种生成图标的方式

在浏览器中打开 icons/icon_maker.html 将icon保存到项目

加载浏览器插件

在浏览器点击【管理扩展程序】或输入下面地址打开浏览器扩展

arduino 复制代码
chrome://extensions/

点击【加载已解压到扩展程序】,选择插件目录

加载完成后就可以看到插件信息

使用插件

在浏览器点击【扩展程序】,从插件列表找到对应插件

插件加载出来了,但是有问题

我们可以将问题告诉Cursor,让Cursor帮我们修复

修复完成后,点击插件的刷新按钮更新插件或者删除插件重新加载

修复完成后,可以看到基本信息了,效果看着还是蛮不错的,还加了语言类型标签👍。但是数据仍有问题,我们继续让Cursor尝试解决

|------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------|
| | |

经过了多轮尝试后,最终实现效果如下:

总结

今天这个案例Cursor除了在获取stars数、今日stars数和关注数的的环节卡壳,其他的任务完成的都非常好,对于复杂逻辑和不太容易使用语言能描述的需求建议直接使用示例的方式,通过示例引导Cursor理解我们想要表达的需求。

项目地址

项目放到Github了,感兴趣的小伙伴可以自行玩耍

Github地址:github.com/MisterZhouZ...

友情提示

见原文:【Cursor实战】实现一个爬取Github Trending热榜插件

本文同步自微信公众号 "程序员小溪" ,这里只是同步,想看及时消息请移步我的公众号,不定时更新我的学习经验。

相关推荐
leeyi2 小时前
流式传输引擎:Eino StreamReader 源码拆解(第61篇-E47)
llm·aigc·agent
卡卡罗特AI3 小时前
OpenAI模型,自主入侵顶级AI公司系统!后背发凉!
aigc·openai
iThinkAi3 小时前
别被那些“必装清单”骗了,我替你们踩完了 Codex Skills 的所有坑
aigc
张申傲3 小时前
拆解 harness9(9):Observability 可观测性
人工智能·aigc·agent·deepseek·harness
李剑一3 小时前
瑞幸也AI上了?我用AI命令行帮我点了一杯咖啡,但是我花了不止一杯咖啡钱
aigc·openai·ai编程
武子康3 小时前
Copilot Code Review 从固定 Reviewer 演进为可编程 Runtime,仓库控制面、Setup 供应链、Runner 资源和 MCP 工具同时被纳入审查决策
人工智能·github·aigc
K姐研究社5 小时前
Codex 怎么用国产模型?Kimi + CC Switch 接入配置指南
人工智能·aigc
wangruofeng14 小时前
姚顺雨长谈:在 Anthropic 和 Gemini 训练模型,英雄主义已经过时
llm·aigc
-XWB-16 小时前
【LLM】Agent Planning 完全指南:8 种纯 LLM 范式 + 8 种混合规划模式详解(二)
人工智能·经验分享·aigc·学习方法·ai编程
爱听歌的周童鞋18 小时前
霹雳吧啦Wz | AIGC | 图像生成篇 | DDPM介绍与公式推导 | 笔记 | (二) 优化目标引入 ELBO/VLB
aigc·diffusion model·ddpm·reverse process·image generate·forward process