狂奔滴小马 | 前端工程师成长部落阁

Vibe Coding 自建一个知识星球

maqi1520@163.com (狂奔滴小马) — Sun, 07 Jun 2026 00:00:00 GMT

hello，各位做自媒体的朋友们，你们在社交平台上发布内容的时候是否会存在以下问题，

storyboard 是 AI 剪视频的前置条件

maqi1520@163.com (狂奔滴小马) — Sun, 07 Jun 2026 00:00:00 GMT

使用AI剪辑视频的步骤

国产大模型前端设计效果对比

maqi1520@163.com (狂奔滴小马) — Mon, 01 Jun 2026 00:00:00 GMT

不吹不黑。国产大模型 minimax 3.0 对比 GLM 5.1，对比小米MiMo-V2.5-Pro。前端设计效果，同样的提示词，哪个效果比较好？aicoding

我用 Codex 跑视频字幕的大致流程

maqi1520@163.com (狂奔滴小马) — Mon, 01 Jun 2026 00:00:00 GMT

这套流程做的事很简单：给一段视频和一段配音，先用本地工具识别字幕，再修掉明显错字，最后把带样式的硬字幕烧进视频。需要的话，还可以从字幕里提炼封面标题，把封面插到视频开头。

AI 写作用哪个 Agent skill 好？

maqi1520@163.com (狂奔滴小马) — Thu, 28 May 2026 00:00:00 GMT

现在大家都会用 AI 辅助写作，但 AI 写出来的内容有一个很明显的特征，就是特别像 Markdown 里的结构化文字。

如何在 Codex 中使用DeepSeek模型

maqi1520@163.com (狂奔滴小马) — Thu, 28 May 2026 00:00:00 GMT

Codex token 限额之后，大家怎么办？等下一个 5 小时，还是升级 token plan？

Codex 额度又超了，找人体验我的 VibeCoding 网站

maqi1520@163.com (狂奔滴小马) — Tue, 26 May 2026 00:00:00 GMT

最近把「纸笺工坊」又完善了一版，想找一些朋友帮忙体验一下。

Reasonix：一个 DeepSeek 专用的终端 Coding Agent，值不值得试？

maqi1520@163.com (狂奔滴小马) — Mon, 25 May 2026 00:00:00 GMT

昨天刷 Hacker News，看到一条讨论挺热闹：有人做了个叫 Reasonix 的终端 coding agent，专门对接 DeepSeek API，主打 prefix cache 命中率高、长会话成本低。帖子 500 多 upvote，评论 200 多条。我顺着链接点进去看了看，也翻了翻评论区...

如何使用Codex做出更有细节的网站

maqi1520@163.com (狂奔滴小马) — Sun, 24 May 2026 00:00:00 GMT

最近我在尝试用 Codex 做一个更好看的网页，发现一个比较实用的流程：不要一上来就让它照着某个网站直接生成页面，而是先让 GPT Image2 帮你把设计稿和素材准备好，再交给 Codex 去实现。

新上线「纸笺工坊」：把文字变成手写稿

maqi1520@163.com (狂奔滴小马) — Mon, 18 May 2026 00:00:00 GMT

最近新上线了一个网站，叫做纸笺工坊，可以快速生成手写风图片，做这个网站的目的是为了和 md2card 互补。

使用 Codex 来做视频，来试试 HyperFrames

maqi1520@163.com (狂奔滴小马) — Fri, 08 May 2026 00:00:00 GMT

做视频不一定要用 Premiere 、剪映等剪辑软件了，

DeepSeek 专家模式对比 Xiaomi MiMo 前端设计能力

maqi1520@163.com (狂奔滴小马) — Wed, 08 Apr 2026 00:00:00 GMT

我一直在找一个前端设计能力出色的国产大模型，想在产品中代替 gemini 3 模型，今天我们来的对比 Xiaomi MiMo-V2-Pro 和 DeepSeek 专家模式，简直让我惊呆了，其他能力暂且不论，就论前端设计能力，已经超出了我的心理预期，下面开始测评。

Claude Code 把 source map 开源了？

maqi1520@163.com (狂奔滴小马) — Tue, 31 Mar 2026 00:00:00 GMT

这不是一次黑客攻击，也不是内部员工泄密。

Vibe Coding 做了2个项目后，我总结了这些实战技巧

maqi1520@163.com (狂奔滴小马) — Sun, 08 Mar 2026 00:00:00 GMT

Vibe Coding 的效率天花板，不在你写 prompt 的能力，而在你给 AI 搭建的"工作环境"。

Vibe Coding 后，我是如何上线两款SaaS产品

maqi1520@163.com (狂奔滴小马) — Wed, 25 Feb 2026 00:00:00 GMT

使用 md2card 将文章转成了卡片形式

用 Remotion 做产品宣传视频，我走过的坑和建议

maqi1520@163.com (狂奔滴小马) — Sat, 14 Feb 2026 00:00:00 GMT

最近我上线了我的新产品 vibe2design，然后就想——能不能自己做几个产品宣传视频？毕竟 remotion-best-practices 爆火，周安装量 89.0K。那咱就试试呗。

这款Figma插件让设计师能够 Vibe Design

maqi1520@163.com (狂奔滴小马) — Fri, 13 Feb 2026 00:00:00 GMT

嗨大家好，我是小马, 今天想和大家聊聊一个最近让我挺兴奋的产品——Vibe Design。

nano-banana 加 lovart 生成长图比 md2card 还好用

maqi1520@163.com (狂奔滴小马) — Sun, 31 Aug 2025 00:00:00 GMT

今天看了赛博禅心的公众号文章，尝试了 lovart + nano-banana 生成长图的功能，简直太好用了。并且这2天使免费使用的。

md2card 更新啦！组合纹理背景模式

maqi1520@163.com (狂奔滴小马) — Mon, 18 Aug 2025 00:00:00 GMT

哈喽大家好，我是小马。今天要和大家分享 md2card 的最新功能更新，这次我们带来了两个非常实用的改进：

MD2Card 重磅更新，推荐返现

maqi1520@163.com (狂奔滴小马) — Fri, 20 Jun 2025 00:00:00 GMT

你好，我是小马，MD2Card 的作者。今天带来一个激动人心的更新！

md2card 让卡片制作妙趣横生

maqi1520@163.com (狂奔滴小马) — Mon, 26 May 2025 00:00:00 GMT

在日常的知识整理和卡片笔记中，如何让内容更生动、更有趣？md2card 的贴纸功能，正是为此而生！

如何用豆包生成这种“胶囊图”？

maqi1520@163.com (狂奔滴小马) — Thu, 22 May 2025 00:00:00 GMT

最近网络上，ai 生成的胶囊图💊很火。

如何从零构建 Deep Research Agent ？

maqi1520@163.com (狂奔滴小马) — Mon, 05 May 2025 00:00:00 GMT

Deep Research Agent 是什么？

如何将知识卡片导出PDF，适配A4纸打印

maqi1520@163.com (狂奔滴小马) — Mon, 14 Apr 2025 00:00:00 GMT

最近经常收到一些老师和同学的反馈，希望将知识自己整理 Markdown 文档制作成美观知识卡片，并且需要打印出来方便知识巩固和记录。

5 分钟完成 😛emoji 选择器

maqi1520@163.com (狂奔滴小马) — Tue, 08 Apr 2025 00:00:00 GMT

在 21st.dev 上找到组件，就可以直接通过 shadcn cli 集成到项目中。

在 Next.js 中快速支持 PWA

maqi1520@163.com (狂奔滴小马) — Fri, 04 Apr 2025 00:00:00 GMT

使用 md2card 2分钟制作

DeepSeek 更新打破了我刚刚上线的产品，可直接生成精美的小红书卡片

maqi1520@163.com (狂奔滴小马) — Tue, 25 Mar 2025 00:00:00 GMT

最近，我上线一款应用 md2crad 可以将 markdown 转变为知识卡片，但是昨天DeepSeek的这次更新，让我刚上线的产品就失去了价值。因为可以直接在 deepseek 中实现知识卡片的制作，并且UI审美也非常出色。

波普艺术，到底是什么风格？

maqi1520@163.com (狂奔滴小马) — Sun, 23 Mar 2025 00:00:00 GMT

今天看到看到橘子老师《用 Figma 和 AI ，解锁文字卡片自由》的文章，很有帮助，右边是@橘子汽水铺老师制作的卡片。文章中提到的 ai 工具就是 Claude，而国内大部分人是无法使用到 Claude，今天就花了几小时调整，让 md2crad 也支持了这种风格，大家可以用 Markdown来制...

MD2Card 支持移动端访问啦

maqi1520@163.com (狂奔滴小马) — Mon, 10 Mar 2025 00:00:00 GMT

在V2EX 社区发了帖子推广，V2EX的氛围很不错，发帖半小时就有 70 的在线访问量，那是相当的不错了，可能大家对我提到的哪些是 AI 实现的比较感兴趣。

Markdown 秒变小红书卡片

maqi1520@163.com (狂奔滴小马) — Thu, 06 Mar 2025 00:00:00 GMT

用 http://md2card.com 粘贴 Markdown，直接生成爆款卡片！

网站迁移后，如何通过 Cloudflare 实现 301 重定向？

maqi1520@163.com (狂奔滴小马) — Sat, 22 Feb 2025 22:55:57 GMT

在网站迁移过程中，301 重定向是至关重要的一步。它不仅可以确保用户访问旧域名时自动跳转到新域名，还能将旧域名的 SEO 权重传递到新域名，避免流量损失和搜索引擎排名下降。

Mockups 宝藏网站，帮你生成惊艳产品宣传图

maqi1520@163.com (狂奔滴小马) — Sat, 22 Feb 2025 00:00:00 GMT

来来来，给你们安利一个宝藏网站——Shots.so！这个网站简直就是前端设计的救星，让你轻松创建惊艳的Mockups，分分钟提升你的作品集质感！

2 句对话，Ai 就帮我实现了图片剪裁工具

maqi1520@163.com (狂奔滴小马) — Wed, 19 Feb 2025 00:00:00 GMT

我使用的是 GitHub copilot

我用 Cursor改版了前端工具箱功能展示

maqi1520@163.com (狂奔滴小马) — Tue, 18 Feb 2025 00:00:00 GMT

这是一个一站式前端开发工具集合，旨在提升开发效率。

小程序开发为什么不香了？真相揭秘！💔

maqi1520@163.com (狂奔滴小马) — Mon, 10 Feb 2025 00:00:00 GMT

作为一个前端开发者，最近真的被小程序劝退了！😭 虽然小程序开发成本低，但坑真的不少，今天就来给大家扒一扒为啥小程序没那么香了👇

在闲鱼卖deepseek 赚疯了

maqi1520@163.com (狂奔滴小马) — Fri, 07 Feb 2025 00:00:00 GMT

打开闲鱼，随便看了下，销量还挺高，先有在闲鱼卖部署教程，后有卖 APIkey。

🌟 Google官宣Gemini 2.0家族三款新模型！开发者必看！

maqi1520@163.com (狂奔滴小马) — Thu, 06 Feb 2025 00:00:00 GMT

1\. Gemini 2.0 Flash

当我问deepseek前端工程师失业后，如何挣钱时，我呆了

maqi1520@163.com (狂奔滴小马) — Wed, 05 Feb 2025 00:00:00 GMT

真是把我能想到的，和想不到的都整理出来了，真的很佩服，只是没有这般执行力\[尴尬\]

😍订阅号助手支持 Markdown 排版啦✨

maqi1520@163.com (狂奔滴小马) — Sat, 11 Jan 2025 00:00:00 GMT

今天要给大家分享一个超棒的消息呀🎉 订阅号助手现在支持 Markdown 排版咯👏

10 张图，说透 Kubernetes 架构和数据流

maqi1520@163.com (狂奔滴小马) — Mon, 30 Sep 2024 00:00:00 GMT

如何使用 Playwright 来模拟 API 请求和修改 API 响应

10 张图，说透 Kubernetes 架构和数据流

maqi1520@163.com (狂奔滴小马) — Mon, 30 Sep 2024 00:00:00 GMT

本文是通过插图详细解释每个 Kubernetes 组件。

如何将 docker 单节点部署应用改成集群部署？

maqi1520@163.com (狂奔滴小马) — Sun, 22 Sep 2024 00:00:00 GMT

在项目开发中，Docker Compose 是一种常见的工具，能够帮助开发者在本地轻松启动多容器应用。然而，当应用扩展到生产环境，单节点的 Docker Compose 可能无法满足高可用性、容错和扩展需求。这时候，我们可以考虑将 Docker Compose 部署迁移到 Kubernetes 这样...

如何将 docker 单节点部署应用改成集群部署？

maqi1520@163.com (狂奔滴小马) — Sun, 22 Sep 2024 00:00:00 GMT

我在学习Kubernetes中的实践

提示词工程天花板【汉语新解】- 原理浅析

maqi1520@163.com (狂奔滴小马) — Mon, 16 Sep 2024 00:00:00 GMT

使用 Next.js 复刻【汉语新解】应用

【质量保障】Playwright 使用入门

maqi1520@163.com (狂奔滴小马) — Sun, 01 Sep 2024 23:03:43 GMT

playwright 介绍 Playwright 是一个端到端（E2E）测试框架，它可在所有现代浏览器中运行功能强大的测试和自动化。支持多种编程语言 API，包括 JavaScript

【质量保障】E2E 中的 mock api 测试

maqi1520@163.com (狂奔滴小马) — Sun, 01 Sep 2024 00:00:00 GMT

如何使用 Playwright 来模拟 API 请求和修改 API 响应

将 Node 应用 Express.js 部署到 Vercel

maqi1520@163.com (狂奔滴小马) — Thu, 09 May 2024 22:14:19 GMT

前言之前有期视频介绍过，在 Vercel 上可以免费部署很多应用，包括 Next.js、Nuxt、Remix。除了 Node.js 甚至还支持其他语言，包括 Go、 Python、Ruby

35岁，我失业了

maqi1520@163.com (狂奔滴小马) — Thu, 09 May 2024 22:13:02 GMT

Hello 大家好，我是一名 90 后、工作 10年+ 的前端程序员。其实已经离职 2 周多了，本以为这只是一个短暂的过渡期，但是没想到会这么长，甚至会长时间。在 BOSS 上沟通了 250+

35 岁，被裁后，一个月找工作现状

maqi1520@163.com (狂奔滴小马) — Tue, 09 Apr 2024 22:05:48 GMT

失业一个月，聊聊被裁后这一个月，我找工作的情况，这个月内总共打招呼了 385 家，投递了 56 家，实际应该不止 56，因为我把简历写在了自己的博客中。约面 5 家，最后只通过了 1 家。

普通程序员要如何技术写作变现？

maqi1520@163.com (狂奔滴小马) — Fri, 15 Mar 2024 15:42:31 GMT

AI 爆发，技术写作还有意义吗？ 2023 年，人工智能爆发，ChatGPT 的出现对许多行业产生了巨大的冲击。对我来说，原本以为写博客、建立个人知识库等学习方式会变得可有可无，但实际情况是，写作变得

Shadcn UI 现代 UI 组件库

maqi1520@163.com (狂奔滴小马) — Wed, 15 Nov 2023 21:17:55 GMT

Shadcn UI 现代 UI 组件库前言不知道大家是否使用过 Shadcn UI，它在Github 上拥有了 35k star，它与大多数 UI 组件库(如 Ant desgin 和 Chakr

大家都在嘲笑 Next.js 14

maqi1520@163.com (狂奔滴小马) — Fri, 03 Nov 2023 19:56:06 GMT

上周 Next.js 14 发布了，该版本相较于 13，没有任何 API 变更，主要更新点是 Turbopack 带来了大幅的性能提升以及 Server Actions 功能进入稳定版本。

基于 Tauri，我写了一个 Markdown 桌面 App

maqi1520@163.com (狂奔滴小马) — Thu, 13 Jul 2023 18:23:59 GMT

本文视频地址前言大家好，我是小马。去年，我开发了一款微信排版编辑器 MDX Notes。它可以自定义组件、样式，生成二维码，代码 Diff 高亮，并支持导出 Markdown 和 PDF 等功

Vercel 推出数据库存储服务，助力全栈开发

maqi1520@163.com (狂奔滴小马) — Thu, 04 May 2023 12:59:18 GMT

Vercel 是一个流行的 React.js、Next.js 等前端应用部署平台，我们可以一键将 Github 上的应用部署上线，但它缺少一个重要部分：数据库。不过现在已经有了四种新数据库可供选择。

使用 Web Speech API 和 ChatGPT API 开发一个智能语音机器人

maqi1520@163.com (狂奔滴小马) — Fri, 21 Apr 2023 18:03:16 GMT

随着 AI 的不断发展，我们前端工程师也可以开发出一个智能语音机器人，下面是我开发的一个简单示例，大家可以访问这个视频地址查看效果。

2023 web 设计趋势

maqi1520@163.com (狂奔滴小马) — Fri, 21 Apr 2023 18:02:50 GMT

在过去的一年里，我们在网页设计领域看到了很多令人兴奋的发展。而在这篇文章中，我们来预测下 2023 年的设计趋势。本文附有所有例子的链接。准备好了吗？让我们来看看!

如何使用 ChatGPT 3.5 API 创建自己的智能应用？

maqi1520@163.com (狂奔滴小马) — Mon, 03 Apr 2023 23:57:20 GMT

本文介绍了 openai 的 api 使用方法，以及如何使用 openai 的 playground 生成需要的 messages 信息。并且通过一个 Next.js 实战例子，结合 ChatGPT

基于 ChatGPT API 的划词翻译浏览器脚本实现

maqi1520@163.com (狂奔滴小马) — Tue, 28 Mar 2023 18:05:49 GMT

最近 GitHub 上有个基于 ChatGPT API 的浏览器脚本，openai-translator，短时间内 star 冲到了 9.7k，功能上除了支持翻译外，还支持润色和总结功能。

三分钟 ChatGPT 接入钉钉机器人

maqi1520@163.com (狂奔滴小马) — Thu, 16 Mar 2023 18:27:23 GMT

ChatGPT 大家应该都已经用了一段时间了，功能非常强大，作为开发人员，我用它写文档、写日报、润色 OKR，知识搜索等等，它给我带来了极大的帮助，但我在使用过程中最大的痛点就是网络。

油猴脚本去水印实现原理

maqi1520@163.com (狂奔滴小马) — Thu, 09 Mar 2023 20:42:18 GMT

上周微信公众号推出了一种新的形式，类似小红书这样子，群里有小伙伴调侃，是否是小红书的产品经理跳槽到微信了，那作为一个公众号运营者，我也想利用这一点。那么如何快速设计出好看的小红书封面，便成了我的目标。

【对话ChatGPT】如何提高网站的访问量？

maqi1520@163.com (狂奔滴小马) — Wed, 22 Feb 2023 00:00:00 GMT

上周给博客开通的 Google adsense，收益比微信公众号好一些，收益跟访问量成正比，于是我问了 ChatGPT 这个问题。

如何使用 Tailwind CSS 写官网？

maqi1520@163.com (狂奔滴小马) — Wed, 22 Feb 2023 00:00:00 GMT

上在上一期视频中，我介绍了 Tailwindcss 的优点，很多小伙伴也在评论中谈论了自己的看法。今天这期视频我们就来实战一下，如何使用 Tailwindcss 写官网？那么一起来看看吧

如何使用 ONLY OFFICE 在你的 WEB 中集成 OFFICE 文档编辑功能

maqi1520@163.com (狂奔滴小马) — Thu, 02 Feb 2023 13:32:14 GMT

本文主要介绍了 ONLYOFFICE，以及使用 docker 在 Linux 部署ONLYOFFICE，并且使用 Nodejs 对接的过程。

用 TailwindCSS 打造美好祝福：给大家送上新年祝福的 demo

maqi1520@163.com (狂奔滴小马) — Sun, 22 Jan 2023 19:40:16 GMT

前几天，群里有有伙伴问，在Next.js中，该使用哪个UI框架？我强烈推荐 tailwindcss，因为你不再需要写 CSS 代码了，这 2 天还录制了一个视频，包括录屏、录音、剪辑、动画等，花费蛮多时间，在视频最后，借一个 demo 给大家拜年了，祝您在新的一年中，事业蒸蒸日上，幸福美满，健康长久。

2022 年终总结，知识沉淀这一年

maqi1520@163.com (狂奔滴小马) — Tue, 27 Dec 2022 19:40:16 GMT

Hello ，大家好，我是小马，一名小厂前端工程师，普通的不能再普通的小前端，本来不想写年终总结了，因为一年下来，也没啥变化。

用 React 开发了一款 Chrome 插件【七牛云图床】

maqi1520@163.com (狂奔滴小马) — Wed, 21 Dec 2022 20:45:32 GMT

习惯使用 markdown 写作的朋友，肯定会有自己的图床，七牛云的对象存储对于个人用户每月免费 10GB，可谓是白嫖的上上之选，只需要注册后，绑定一个域名就可以使用了。

ChatGPT 以及相关开源项目体验

maqi1520@163.com (狂奔滴小马) — Mon, 12 Dec 2022 22:55:57 GMT

本月初，ChatGPT 以惊人的速度问世，在技术圈中引起了广泛讨论。在 GitHub 上近期还诞生了多个 ChatGPT 相关的开源项目，数量之多令人瞠目结舌。

创建 React 应用的 7 种方式，你用过几种？

maqi1520@163.com (狂奔滴小马) — Tue, 06 Dec 2022 23:56:54 GMT

本文例举创建 react 应用的常见 7 种方式，首先，我们第一个是想到的是 react 官方团队提供的脚手架工具 Create React App(cra) 项目是零配置。

Next.js 全栈开发微信公众号 Markdown 排版编辑器

maqi1520@163.com (狂奔滴小马) — Wed, 30 Nov 2022 00:42:25 GMT

阅读本文，你将收获：学会使用 Monaco Editor 开发多文件编辑器；学会使用 mdx 在线编译；实现剪切板的劫持；学会使用云函数和云数据写接口；

如何避免 React hooks 闭包陷阱？

maqi1520@163.com (狂奔滴小马) — Mon, 28 Nov 2022 07:57:37 GMT

有时候我们使用了useMemo useCallback 来优化性能，这些函数与外围的 state 形成闭包，导致缓存函数中获取到的 state 不是最新的值，这就是闭包陷阱。

我在工作中使用 git 的几个技巧

maqi1520@163.com (狂奔滴小马) — Wed, 23 Nov 2022 12:32:22 GMT

Git 是每个程序员的必备技能，良好的 Git 提交习惯，不但可以让代码阅读更清晰，还可以提高我们的我们的工作效率，接下来我将分享我在工作中关于 Git 的使用经验，或许对你有帮助。

使用 Next.js 搭建 Monorepo 组件库文档

maqi1520@163.com (狂奔滴小马) — Wed, 23 Nov 2022 00:59:38 GMT

本文，我们从零开始，使用 Next.js 和 pnpm 搭建了一个组件库文档，主要使用 Next.js 动态导入功能解决了开发服务缓慢的问题，使用 Next.js 的 SSG 模式来生成静态文档。

Next.js 应用实现权限管理

maqi1520@163.com (狂奔滴小马) — Mon, 14 Nov 2022 22:48:39 GMT

今天我们就聊一聊权限系统的设计与实现，要在网站中实现复杂的权限管理对应新手来说，这可能会是比较困难的，但权限系统是软件中不可或缺的部分，我们只要掌握一个套路，就会变得非常简单，一起来看看吧！

理解 Next.js 中的 CSR、SSR、SSG、ISR 以及 Streaming

maqi1520@163.com (狂奔滴小马) — Sun, 06 Nov 2022 13:51:14 GMT

Next.js 提供了 CSR、SSR、SSG、ISR、 Streaming 这么多渲染方式，本文就从渲染方式方面来讲解，让我们可以更好地理解 Next.js 以及使用 Next.js。

你好，Next.js 13

maqi1520@163.com (狂奔滴小马) — Sun, 30 Oct 2022 07:48:04 GMT

上周发布了 Next.js 的一个全新的版本 13，它带来了全新的理念（server component），作为一名 Next.js 的爱好者，我们有必要重新学习和认识下它。

使用 Vitest 和 React Testing Library 给 Next.js 应用单元测试

maqi1520@163.com (狂奔滴小马) — Tue, 25 Oct 2022 23:51:35 GMT

在本文中我们给 Next.js 应用配置了 vitest 和 React-testing-library 测试环境，这套配置同样适用于其他 react 项目，只需要依照步骤配置即可。

使用 NextAuth.js 给 Next.js 应用添加鉴权与认证

maqi1520@163.com (狂奔滴小马) — Tue, 18 Oct 2022 00:12:49 GMT

在上一篇文章中，我们使用 prisma 和 Next.js，创建了一个视频网站，本文将继续开发视频网站，实现邮箱登录、 Github 授权登录，以及密码登录。

使用 Next.js、 Prisma 和 PostgreSQL 全栈开发视频网站

maqi1520@163.com (狂奔滴小马) — Tue, 11 Oct 2022 23:57:14 GMT

本文将以实现一个视频网站为例，介绍 Next.js 和 Prisma 开发的全过程，prisma 对于 Next.js 来说，可谓是如虎添翼，有了它们，我们前端工程师轻松步入了全栈开发。

使用 Notion 数据库进行 Next.js 应用全栈开发

maqi1520@163.com (狂奔滴小马) — Tue, 27 Sep 2022 23:49:28 GMT

今天我就得带大家来白嫖一下 Notion 数据库，让我们的个人应用轻松上线，本文记录了利用 Next.js 和 Notion API 编写了一个前端刷题网站的全过程。

使用 Strapi 和 Next.js 开发一个简易微博

maqi1520@163.com (狂奔滴小马) — Tue, 20 Sep 2022 09:35:34 GMT

本文主要介绍了使用 strapi 和 Next.js 实现了一个简易的微博，我们不必写后端，只需要后台配置便可以创建 api 接口，通过本文，我相信你对 strapi 有了一定了解。

使用 Next.js 和掘金 API 打造个性博客

maqi1520@163.com (狂奔滴小马) — Mon, 19 Sep 2022 23:53:53 GMT

在本文中，我将分享我的方法，通过掘金 API 打造个性博客，只要在掘金发表文章，就会自动同步到自己的博客中。

码上掘金不仅可以写 PPT，还可以录视频

maqi1520@163.com (狂奔滴小马) — Fri, 09 Sep 2022 00:05:45 GMT

本文基于我之前写的一篇文章《Markdown 写 PPT 是如何实现的？》，我们要在此之上实现视频录制的功能。

使用油猴脚本净化 CSDN

maqi1520@163.com (狂奔滴小马) — Sat, 03 Sep 2022 14:33:01 GMT

CSDN 的百度搜索权重很高，比如我们搜索一个关键词，输入`react 性能优化`，第一个就是 CSDN 的链接，打开 CSDN 的链接，里面有很多广告，我们可以通过油猴脚本来净化页面。

油猴脚本开发教程

maqi1520@163.com (狂奔滴小马) — Thu, 01 Sep 2022 17:50:24 GMT

本文简单介绍了油猴脚本开发步骤以及实现，结合 webpack 让脚本实现工程化，并且配合 github action，让脚本实现自动化构建和部署。

iPad 编程生产力

maqi1520@163.com (狂奔滴小马) — Sat, 27 Aug 2022 14:39:51 GMT

前言 iPad 有个口号，就是“买前生产力，买后爱奇艺”，使用 iPad，配合 Procreate 来作画体验还可以，如果你想让你的 iPad 可以编程，你却不得不为之花费时间和精力。

用云函数开发掘金钉钉机器人

maqi1520@163.com (狂奔滴小马) — Fri, 12 Aug 2022 14:49:02 GMT

自从我在稀土掘金社区技术更文以来，每天非常关注文章点赞评论消息，而我常使用的是聊天软件是钉钉，所以我在想，是否可以利用云函数对接掘金，实现一个钉钉机器人，把我的掘金消息自动推送给我。

Markdown 写 PPT 是如何实现的？

maqi1520@163.com (狂奔滴小马) — Tue, 09 Aug 2022 00:00:00 GMT

一个非常好用的工具 slidev, 可以使用 markdown 来制作演示文稿，其他类似的工具还有 Nodeppt、 marp 等，那么这类工具是如何实现的？

开发一个在线代码对比工具

maqi1520@163.com (狂奔滴小马) — Mon, 08 Aug 2022 00:00:00 GMT

在开发过程中，我们经常需要用到代码对比，对比下代码是否一致，有哪些改动，方便我们可以查看问题，今天我们就来说实现下，其实很简单。

【实战】Next.js + 云函数开发一个面试刷题网站

maqi1520@163.com (狂奔滴小马) — Mon, 08 Aug 2022 00:00:00 GMT

前段时间开发了一个面试刷题小程序——面试狗，主要使用了 uniapp + unicloud 云开发实现，今天我们来开发一个与之对应的 PC 版面试刷题网站。

用小程序来实现扫码登录

maqi1520@163.com (狂奔滴小马) — Mon, 08 Aug 2022 00:00:00 GMT

在 web 开发中，少不了用户系统，开发者需要开发注册登录这些重复的功能，而对于用户来说，要要注册才可以使用，往往会不愿意，因为我们有太多的账号和密码了，而现在可以使用小程序来实现扫码登录。

Iconfont 还是不能上传，如何维护你的 Icon？

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

大多情况下，我们不必上传自己的图标，只需要在 iconfont.cn 便捷的搜索，就可以将图标加入到自己的项目图标库中，但最近工作中却遇到了比较严重的问题。

【油猴脚本】在 Iconfont 上直接复制 React component 代码

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

所以我写了一个油猴脚本，可以在 iconfont.cn 上直接复制 React component 代码，本文讲述改脚本的实现原理。

30+ 图片压缩工具集合，包含在线压缩和CLI工具

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

许多开发人员花费了大量时间优化网页性能，比如优化 js、css、减少http 请求等等，但减小图片大小产生的优化比其他所有领域加起来影响更大。

2022 在微笑中成长

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

「时光不负，创作不停，本文正在参加2022 年中总结征文大赛」哈喽，大家好，我是小马，2022 年不知不觉已经过半了，看到朋友圈关于年中总结的文章，一时间不知道该如何写起

Vite 也可以模块联邦

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

之前写过一篇文章，《将 React 应用迁移至 Vite》介绍了 Vite 的优势，并且和 webpack 做对比，但 webpack5 有个很重要的功能，就是模块联邦，那么什么是模块联邦？

《成语小秀才》部署教程

maqi1520@163.com (狂奔滴小马) — Fri, 22 Jul 2022 00:00:00 GMT

相信很多朋友都玩过这款小游戏，叫成语秀才，这款小游戏开发起来还是比较困难的，首先要有一份海量的题库。。。文末有源码。

将 React 应用迁移至 Vite

maqi1520@163.com (狂奔滴小马) — Sat, 25 Jun 2022 00:00:00 GMT

Vite 充分利用了浏览器的加载机制和缓存机制等，大大提示了研发效率，vite 虽然快，但不是所有的项目react 项目都可以迁移成功

如何快速在团队内做一次技术分享？

maqi1520@163.com (狂奔滴小马) — Sat, 25 Jun 2022 00:00:00 GMT

本文讲述了我在准备团队内容分享的小技巧，我认为最重要的就是结合公司实际来做分享修改，无论主题也好文章内容也罢，虽然文章是别人写的，但要经过自己的思考和消化，变成自己的知识，这样我们才可以快速成长！

Uniapp 实现全民分销功能

maqi1520@163.com (狂奔滴小马) — Sat, 25 Jun 2022 00:00:00 GMT

前段时间在掘金 app 多了一个推广中心，分享课程链接，若有其他用户从你分享的链接购买，你就可以获得佣金，本篇介绍下全民分销功能实现原理。

打字机效果的实现与应用

maqi1520@163.com (狂奔滴小马) — Sat, 25 Jun 2022 00:00:00 GMT

在 web 应用中，模拟编辑器的输入效果，往往能够吸引人们的眼球，让用户的注意力聚焦在输入的内容上，其实使用的是 web 动画模拟打字机效果，本文将和大家探讨打字机效果的实现方式以及应用。

前端妹子问我 position fixed 失效问题该如何解决？

maqi1520@163.com (狂奔滴小马) — Wed, 25 May 2022 00:00:00 GMT

这两天公司一位妹子问我，“我这边调试的时候本地显示没问题，到手机端就有问题，该怎么办呢？” 测试环境没问题到线上就有问题了？对此我也很纳闷。

微信排版工具新选择

maqi1520@163.com (狂奔滴小马) — Mon, 16 May 2022 00:00:00 GMT

我写了一个微信排版编辑器，使用 MDX，可自定义组件、样式、生成二维码、代码 diff 高亮，可导出 markdown 和 PDF。

实现一个 Code Pen：（六）云函数生成网页缩略图

maqi1520@163.com (狂奔滴小马) — Fri, 13 May 2022 00:00:00 GMT

本文介绍了生成缩略图的方式，包含客户端生成，和服务端生成，并简要分析了阿里云、腾讯云和 vercel 生成浏览器截图的方式。

实现一个 Code Pen：（一）项目初始化