跳转至

实用小工具

图像处理

翻译工具

  • pot-desktop，跨平台的 AI 翻译和 OCR 软件，Pot 官网；
  • Easydict，Mac 下的 AI 翻译和 OCR 软件；
  • Trancy，浏览器插件，AI 网页翻译与视频字幕，支持 Desktop 和 Mobile；
  • 沉浸式翻译，浏览器插件，AI 网页翻译与视频字幕，支持 Desktop 和 Mobile；
  • 欧路词典；

爬虫

  • firecrawl，用提示词从任何网站爬取内容并转换为 LLM 结构化数据（爬取 - 抓取 - 清洗）；

AI图表

  • Napkin，将文本转换为视觉效果，生成各种图表；
  • Flourish，将原始数据转化为交互式可视化数据，让任何数据栩栩如生；

在线绘图

网文排版

Markdown 工具

手写公式转 LaTeX

  • MyScript Math：支持手写数学公式，自动转 LaTeX 或 MathML，MyScript 此外还有集成手写框架 iinkTS 及 iOS、Android 客户端，都很棒；
  • SimpleTex：好用的公式识别编辑神器，提供 跨平台客户端 和 在线体验 供使用；
    • 支持手写、截屏截图、PDF文件的公式识别；
    • 支持80+语言识别、各种类型的复杂公式、化学结构式识别；
    • 支持识别后在结果上直接编辑，支持常见 LaTeX 命令补全；
    • 识别结果支持 Markdown 或 LaTeX 格式；

前端工具

  • 文本工具：Sublime Text、Atom；
  • 开发工具：Cursor、Visual Studio Code、HBuilderX；
  • 集成 IDE：WebStorm；
  • 在线工具：CodePen、JSFiddle、JS Bin、CSS Grid Generator；

代码执行可视化

  • Python Tutor，一个在线的代码执行过程可视化工具，支持 Python、Java、C、C++ 和 JavaScript；

正则表达式可视化

在浏览器中调试

Chrome、Safari 都内置了 Web 调试工具，直接用。步骤参考 现代 JS 教程：debugging-chrome。

1. 开发者工具

Chrome：F12 或 command+option+i；
Safari：command+option+i；

2. 控制台-Console

按 Esc，底部会弹出一个控制台，可输入命令然后按 Enter 执行。

3. 断点-Breakpoints

步骤参考 现代 JS 教程：断点（Breakpoints）。

设置开关：

  • 启用/禁用，所有断点；
  • 启用/禁用，出现错误时自动暂停脚本执行；
  • 打断点；
  • 重载页面，F5 或 command+R，观察变化；

跟踪执行：

  • 恢复（Resume）：继续执行，快捷键 F8；
  • 下步（Step）：运行下一条指令，快捷键 F9；
  • 跨步（Step over）：运行下一条指令，但不会进入到一个函数中，快捷键 F10；
  • 步入（Step into）：快捷键 F11；
  • 步出（Step out）：继续执行到当前函数的末尾，快捷键 Shift+F11；
  • Continue to here，在代码中的某一行右键里。当你想要向前移动很多步到某一行为止，但是又懒得设置一个断点时非常的方便；

4. debugger命令

可以在代码中用 debugger 命令来暂停代码：

function hello(name) {
    let phrase = `Hello, ${name}!`;
    debugger;  // <-- 调试器会在这停止
    say(phrase);
}

这样的命令只有在开发者工具打开时才有效，否则浏览器会忽略它。

5. 日志记录

可以在代码中用 console.log() 函数输出日志来观察代码执行情况：

for (let i = 0; i < 5; i++) {
    console.log("value", i);
}

学习教程

VS Code

前端开发

图解算法

数据科学

教育学

add_circle2024-11-21update2025-02-17

加载评论中...