Weekly #035
文章推荐
Testing HTML With Modern CSS
https://heydonworks.com/article/testing-html-with-modern-css
本文介绍了如何使用现代 CSS 作为 HTML 测试工具,作者提及了他之前开发的 REVENGE.CSS 以及 CSS 选择器在 HTML 测试中的应用。通过 CSS 选择器的发展,可以更精确地测试 HTML 结构,并通过自定义属性和层级来描述错误信息。作者强调了使用 CSS 进行 HTML 测试的优势,可以避免使用 JavaScript,更符合视觉开发者的工作流程,并适用于设计系统和可访问性测试。通过示例展示了如何利用 CSS 选择器来发现特定的 HTML 问题,包括无标签的面包屑导航和内容不在可访问性区域内等。文章指出,通过在 CSS 文件中编写测试代码,可以方便地应用于各种开发环境,并提供了实际工作中的应用场景。
21 HTML Tips You Must Know About
https://dev.to/devshefali/21-html-tips-you-must-know-about-55j7
这篇文章分享了 21 个 HTML 编程技巧,包括创建联系链接、折叠内容、使用语义化元素、组合表单元素等。还介绍了如何改进下拉菜单、优化视频播放、支持多重选择等用技巧。另外,还提到了如何管理文件类型、控制图像加载、增强可访问性等重要内容。文章内容丰富,适合想要提升 HTML 编程技能的开发者阅读参考。
An Interactive Guide to CSS Container Queries
https://ishadeed.com/article/css-container-query-guide
这篇文章详细介绍了 CSS 容器查询的概念、解决的问题、语法和常见陷阱。通过示例演示了如何使用容器查询来根据容器宽度而非视口宽度来调整 UI 布局,解决了使用媒体查询时容器大小变化导致布局问题的困扰。容器查询语法包括容器类型和容器名称的定义,以及样式查询的用法。同时指出了容器查询的常见问题,如容器无法根据内容大小调整、无法对容器本身进行查询等。最后,列举了容器查询的用例,例如构建新闻部分、卡片组件等。
工具介绍
Dot
https://github.com/alexpinel/Dot
Dot 是一个独立的开源应用程序,旨在轻松使用本地 LLMs 和 RAG 进行文档交互,类似于 Nvidia 的 Chat with RTX。用户可以通过 RAG 加载多个文档,支持的文档类型包括 pdf、docx、pptx、xlsx 和 markdown。除了 RAG,用户还可以切换到 Big Dot 进行与文档无关的交互,类似于 ChatGPT。Dot 是基于 Electron JS 构建的,主要功能来自 Python 捆绑安装,包含所有必要库和文件。用户可以安装打包的应用程序或自行设置开发项目。
Weblog
https://github.com/coignard/weblog
Weblog 是一个极简的基于纯文本的博客引擎,使用 PHP 编写,受到 RFC 格式的简单性和结构的启发。它旨在将内容显示为纯文本,保持简单、轻量且易于设置,无需数据库。通过使用配置文件进行简单的设置管理,将博客帖子保存为 txt 文件,而不需要数据库存储,并提供了一些配置选项,如最大行宽度、内容缩进长度、博客帖子存储目录等,同时提供了基本的 Nginx 配置以便快速部署。通过访问博客 URL 可以查看所有帖子,添加帖子名称可访问单独的帖子,并且支持按日期或分类查看相应帖子。
1filellm
https://github.com/jimmc414/1filellm
1filellm 是一个命令行工具,用于从各种来源聚合和预处理数据到单个文本文件,并将其复制到剪贴板。它支持本地文件、GitHub 存储库、GitHub 拉取请求、GitHub 问题、ArXiv 学术论文、YouTube 成绩单、网页文档、Sci-Hub 托管论文等来源。用户可以通过组合来自这些不同来源的内容,快速创建信息密集的提示,以便更轻松地将数据导入大型语言模型(LLMs)中。该工具还提供诸如文本预处理、Web 抓取、Sci-Hub 集成等功能,使得数据处理更加高效便捷。
霓虹翻译
霓虹翻译是一款划词翻译工具,可以帮助用户提升阅读效率,记忆单词,管理单词,并结合 AI 技术提供精准翻译。通过自动高亮已翻译单词、单词气泡功能和便捷交互方式,提供无障碍的阅读体验。用户可以在浏览网页时轻松学习外语,加快语言学习速度,优化研究过程,让学习变得轻松有趣。
GenPage
GenPage 是一款利用 AI 为每个潜在客户生成个性化着陆页的工具。它可以帮助您在冷调联络中获得更高的回复率,让您的邮件不再显得千篇一律。您只需简单介绍您的产品或服务,GenPage 就能为每个潜在客户生成专属的着陆页链接,让您的联络更具个性化和吸引力。通过使用 GenPage,您可以轻松设计着陆页、为每个潜在客户生成独特链接,并大幅提高您的联络回复率、预约率和销售业绩。
Codepilot
Codepilot 是一款旨在加速 SaaS 应用程序开发的终极工具包,为您提供一切所需以快速推出产品。通过快速交付、基于 Next.js 框架的高效构建、精心设计的组件和与第三方工具的无缝集成,Codepilot 让开发过程更轻松,让您专注于创新。其功能涵盖支付、身份验证、电子邮件、数据库、管理面板、用户面板等各种现代 SaaS 应用程序所需的常见功能。此外,Codepilot 还提供了丰富的技术栈选择,包括 React、Next.js、Prisma、Stripe 等,让您可以根据自己的需求和规则选择合适的技术。无论是初学者还是有经验的开发人员,Codepilot 都为您提供了高效的开发解决方案,助您快速推出成功的产品。
BokenMap
BokenMap 是一个免费的网站,让用户可以创建自己去过的国家和城市的地图,并展示旅行经历。用户可以列出他们曾经居住过、访问过和中转过的国家和城市,共有 193 个联合国成员国和 58 个额外的州/区可选。用户可以通过嵌入代码在个人博客、网站或社交媒体上展示自己的旅行地图。BokenMap 提供了三种简单的状态类型:居住、访问、中转,让分享旅行经历变得简单易行。
Demopond
Demopond 是一款能够免费创建精美的互动产品演示的工具。用户可以无限发布演示,并享受专业外观,而且所有这些服务都是免费的。此外,Demopond Pro 版本还提供更多强大功能,适应团队和创作者的高级需求,包括邀请多个用户、添加自定义域和获得优先支持等。用户可以选择每月 29 美元或每年 290 美元的升级版本,体验更多增值服务。
FAKR MRR
这是一个可以帮助你制作虚假的 Stripe MRR 仪表板的工具,让你可以向朋友炫耀,并获得点赞。通过这个工具,你可以自定义想要展示的 MRR 数字,让你看起来更成功。此外,该工具还可以让你分享至社交媒体,增加自己的影响力。
PicassoPix
PicassoPix 是一款全方位的 AI 图像工具箱,提供多种 AI 图像生成和处理工具,让用户轻松增强、放大和转换照片。通过与 PicassoPix AI 对话,用户可以访问完整的 AI 图像工具套件,包括文本转图像、自拍转风格化肖像、图像编辑等功能。这款工具集中了多种 AI 功能,让创意无缝连接,让用户摆脱管理多个订阅的麻烦,体验无缝的创造力。
ExcelMaster
ExcelMaster 是一款领先于其他 Excel 公式和 VBA 助手的 AI 助手产品。它能够处理复杂的 Excel 结构,解决困难的公式和 VBA 任务,远远超过其他公式机器人,如 Copilot 和 ChatGPT。ExcelMaster 提供生成、修复和学习功能,拥有专业版和高级版,订阅费用较高但确保准确性。用户数据安全有保障,绝不存储 Excel 文件。相较于 Microsoft 365 Copilot,ExcelMaster 无订阅要求、支持更复杂的结构,并在公式和 VBA 生成方面表现更加出色。
CommentMax
CommentMax 是一个简单、轻量且极速的评论系统,可轻松集成到任何网站中。它提供了评论审核、投票系统、访客评论、封禁功能等多种功能,用户可以根据需要选择免费计划或付费计划。通过 CommentMax,您可以管理和监控网站评论,提升用户互动体验,同时还能享受优质的技术支持。
Chart Builder
https://textquery.app/tools/chart-builder
Chart Builder 是一个免费的图表生成器工具,可以从您的 CSV/TSV 数据创建干净漂亮的图表,包括饼图、条形图、折线图、面积图、散点图和圆环图。与 Excel/Google 表格的图表相比,这个工具提供了更美观的替代选择,可以自由使用图表,并且不会将与您的输入相关的数据发送到服务器。
Twitter Search
https://cookiewriter.com/marketing-tools/twitter-search
Twitter Search 是一个简化 Twitter 搜索的工具,提供了简单直观的用户界面,让用户可以轻松地进行搜索。用户只需输入搜索查询,点击结果按钮即可在 Twitter 上搜索相关内容。该工具支持各种搜索选项,包括关键词、用户名、喜欢、回复等,方便用户根据需求筛选结果。
Landing generator
https://github.com/m0wer/landing_generator
Landing generator 是一个可以在几分钟内生成带有电子邮件集合的登录页面的工具。通过配置文件和模板,用户可以定义多个页面,然后在 Docker 容器启动时从模板呈现这些页面。电子邮件收集通过简单的表单完成,将电子邮件发送到后端,后端将其存储在每个站点的 CSV 文件中。前端和后端由同一个容器提供服务,每个工作线程只有一个进程。用户可以通过设置配置文件并运行 Docker 容器来快速使用这个工具。
SaaS Name Generator
SaaS Name Generator 是一款由 AI 驱动的 SaaS 名称生成器,可帮助您快速生成引人注目的 SaaS 名称,并在几秒钟内检查域名可用性。只需选择行业和喜欢的前缀和后缀,即可获得完美的 SaaS 名称。
AI Song Cover Generator
https://aisongcovergenerator.com
AI 歌曲封面生成器是一个无需艺术或编程技能,即可轻松制作引人入胜的歌词封面的工具。它使用高级 AI 算法(如 Stable Diffusion XL),在大量音乐风格和元素上训练,以确保对音乐有深入的理解,从而生产出独特定制的歌曲封面。用户可以上传歌词来创作视觉吸引力的封面,通过简单的文本提示表达歌曲的情感和风格。AI 歌曲封面生成器还允许用户将人声曲目转化为具有代表性的动态、视觉吸引力的封面。整个过程不需要注册,支持在线访问且完全免费。
LLM API Pricing Calculator
LLM API Pricing Calculator 是一个用于比较不同大型语言模型成本的工具,用户可以根据输入提示和输出来估算调用 API 的费用。在此计算器中展示了多个知名的大型语言模型,包括 GPT 系列、Gemini 系列和 Claude 系列等。用户可以选择不同模型、输入输出代币的单位来计算费用,并了解每个模型的定价情况。此工具可以帮助用户在选择合适的语言模型时,对不同模型的成本进行比较。
Story and Image Generator
https://github.com/bobbyiliev/cloudflare-ai-worker-demo
这是一个结合了两个 AI 模型的 Story and Image Generator 应用程序,能够根据用户提供的提示生成故事和图像。通过 Cloudflare Workers 来提供 HTML 内容和处理生成故事和图像的请求。用户可以访问演示页面,输入提示并点击“生成”按钮来生成故事和图像,生成的内容会即时显示在页面上。
Free Headshot AI Generator
https://headshotaigenerator.com
这是一个免费的 AI 头像生成器,通过输入描述,可以即时生成独特的头像。适用于专业和个人用途,生成的头像可以免费商用。没有生成次数限制,随时可以生成所需的头像。
YouTube timecode link generator for mobile
https://tahoe.be/youtube-timecode
这个项目是一个 YouTube 移动端时间码链接生成器,可以让用户方便地创建特定时间点的视频链接。用户只需粘贴 YouTube 链接并设置时间,即可生成相应的时间码链接。这个工具解决了在移动设备上无法创建时间码链接的问题,为用户提供了更加便捷的体验。
资源汇总
Cascade
https://github.com/d-ivashchuk/cascade
Cascade 是一个开源的 SaaS 模板,旨在尽可能减少技术选择上的冗余,让用户能够从第一天开始编写业务逻辑。该模板选用大部分开源工具,包括 Next.js、tRPC、Prisma 等,同时还涵盖了一些自托管和 SaaS 工具,如 Postgres、Auth.js、PostHog、Plausible、Lemon Squeezy 等,旨在帮助用户快速开始,而且大多数工具都有免费计划。此外,该模板还提供支持工具,如 Sentry、Trigger.dev、Storybook、Lost Pixel、Crisp 等,。整体而言,Cascade 是一个功能强大、扩展性强且旨在帮助用户快速启动和开发业务应用的免费 SaaS 模板。
TWBlocks
TWBlocks 是一个免费的 SaaS 网站区块资源库,基于 React 和 Tailwind 开发,提供了多种精美设计的网站区块,包括 Headers、Features、Pricings、CTAs、FAQs 等多个组件,适用于 SaaS 网站的搭建和定制。用户可以轻松复制粘贴这些组件,并结合 shadcn-ui 主题进行定制,支持暗黑模式和亮色模式。
Click Wheel JS
Click Wheel JS 是一个由 AE Studio 制作的 JavaScript 库,可以在任何网站上添加 iPod 风格的滚轮。这个 JavaScript 库让网站导航更加高效,类似于 iPod 上的点击滚轮操作。通过 Click Wheel JS,用户可以像在 iPod 上一样点击和滚动浏览网页内容,体验更加顺畅的网站导航方式。