技术周刊第35期:使用 AI 自动生成 Commit Message

前端爱好者周刊 (Github: shfshanyue/weekly),每周记录关于前端的开源工具、优秀文章、重大库版本发布记录等等,周刊中优秀文章会在公众号全栈成长之路逐一推送。每周一发布,订阅平台如下,欢迎订阅。

小技巧

  • Go:Go语言支持并发编程,goroutine 和 channel 是 Go 语言并发的核心。
  • Rust:Rust严格的所有权规则使得我们无须手动做内存管理,同时编译器还会避免出现数据竞争等并发问题。
  • Rust:match语句是Rust的重要特性,它可以匹配各种模式,包括结构体、元组、枚举等,使得复杂的逻辑表达更简洁。
  • JavaScript:理解异步编程和Promise、async/await是Javascript开发中的重要一环。
  • CSS:CSS Flexbox和Grid提供了更加现代和强大的布局方式。
  • 使用 Ctrl + T 可以快速打开新的浏览器标签页。
  • 使用 Ctrl + Shift + T 可以重新打开最近关闭的标签页。
  • 使用 Ctrl + F 可以在当前页面内进行搜索。

文章推荐

一、 DevTools Tips & Tricks

技术周刊第35期:使用 AI 自动生成 Commit Message

文章介绍了使用开发者工具的技巧,以提升前端开发的效率。包括:

  • 在 Chromium 浏览器检查悬停弹出元素
  • 使用 logpoints 替代 console.log 调试代码
  • 在 Chromium 中模拟可折叠设备
  • 自动完成样式输入
  • 切换颜色格式
  • 在 DevTools 中捕捉高分辨率屏幕截图
  • 查看和复制页面上发生更改的样式
  • 利用实时表达式简化经常使用的 JavaScript 表达式输入过程
  • 调试导致水平滚动条的溢出元素

还提供了相关资源链接,比如 DevTools Tips 和 Dev Tips,供读者进一步学习。

开源与库

一、 pragmatic-drag-and-drop: 一个灵活的拖放库

技术周刊第35期:使用 AI 自动生成 Commit Message

该项目是 Atlassian 开发的低级别拖放工具链,它允许使用浏览器内建的拖放功能,并支持任何视图层。此工具链已应用于 Trello、Jira 和 Confluence 等大型产品。

Pragmatic drag and drop 提供了一系列可重用的包,以便开发人员创建定制的拖放体验,包括:

  • 核心功能包:无视觉语言或便捷性依赖,灵活创建拖放体验。
  • 视觉输出:提供快速构建一致性用户体验的可选视觉输出。
  • 辅助技术控制:提供工具链用于辅助技术用户的友好拖放体验。
import React, { useEffect, useRef } from "react";
import { dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";

function DropTarget() {
  const ref = (useRef < HTMLDivElement) | (null > null);

  useEffect(() => {
    const el = ref.current;
    if (!el) {
      throw new Error("ref not set correctly");
    }

    return dropTargetForElements({
      element: el,
    });
  }, []);

  return <div ref={ref}>Drop elements on me!</div>;
}

开发利器

一、 aicommits:AI 自动生成 Git 提交信息的 CLI 工具

AI Commits 是一个命令行界面(CLI)工具,使用 OpenAI 的 GPT 模型生成适用于 Git 提交的信息。使用方法如下:

  1. 安装 aicommits:通过 npm 安装此工具。
  2. 设置 API 密钥:获取并设置 OpenAI 平台的 API 密钥。
  3. 配置和使用:通过 aicommits config set 命令进行配置,可设定包括本地化、提交信息类型等选项。使用时,运行 aicommits 生成提交信息。

该工具还支持生成遵循 Conventional Commits 规范的提交信息,并可以集成到 Git 钩子,以自动产生和编辑提交信息。

代码示例:

# 安装 aicommits
npm install -g aicommits

# 设置 OpenAI API 密钥
aicommits config set OPENAI_KEY=<your token>

# 生成提交信息
aicommits

# 生成 Conventional Commits 规范的提交信息
aicommits --type conventional # or -t conventional

二、 plandex:在终端中构建复杂任务的 AI 编程引擎

Plandex 利用 AI 助力编写代码,支持终端中高效管理任务。需设置 OPENAI_API_KEY 环境变量,提供快速安装脚本和源代码编译指令。

作为命令行工具,Plandex 通过拆分大型任务、管理上下文和版本控制助力软件开发。

# 快速安装 Plandex
curl -sL https://plandex.ai/install.sh | bash

使用前需配置环境变量并运行 plandex new 来创建新计划。以下是我通过它重构页面组件 app.tsx 的截图。

技术周刊第35期:使用 AI 自动生成 Commit Message

原文链接:https://juejin.cn/post/7356531073470824457 作者:程序员山月

(0)
上一篇 2024年4月12日 下午4:11
下一篇 2024年4月12日 下午4:21

相关推荐

发表回复

登录后才能评论