搜索

生成式 AI (AIGC、GenAI) 教学

基本介绍

关于生成式 AI 关于 AI 绘图 AI 绘图的提示技巧 AI 绘图软件比较 ( 2023 ) AI 绘图软件推荐 ( 2024 ) 2025 生成式 AI 工具推荐

Vibe Coding 专区

Vibe Coding 教学导读 认识 Vibe Coding Vibe Coding 新手入门 Vibe Coding 规划架构流程 Vibe Coding 网页知识 Vibe Coding Python 知识 Vibe Coding 下载网页程序码 Vibe Coding Google App Script 部署网页 Vibe Coding Github 部署网页 Vibe Coding 使用外部图片 Vibe Coding 使用 SVG 图示 Vibe Coding 使用外部字体 Vibe Coding 固定网页样式 Vibe Coding + Spreadsheet 数据库 Vibe Coding + Firebase 即时数据库 Vibe Coding + Firestore 数据库 Vibe Coding 数据库安全防护 Vibe Coding 串接账号验证机制 Vibe Coding 串接 Google 云端硬盘 Vibe Coding 串接 Gemini API Vibe Coding 打造 LINE Bot Vibe Coding 实战:线上订餐系统 Vibe Coding 实战:文件上传系统 Vibe Coding 实战:线上点名单 Vibe Coding 实战:英文单字卡

AI 实用技巧

AI 语音转 srt 字幕

2025 AI 影音工具

ChatGPT - 图片提示词技巧 ChatGPT - 客制化机器人 ChatGPT - 使用画布功能 Gemini - 开始使用 Gemini - 客制化机器人 Gemini - 串接 Google 服务 Gemini - 使用画布功能 NotebookLM - 开始使用 NotebookLM - 建构知识库 Google AI Studio - 界面功能 Nano Banana - 图像生成与编辑 Gemini Educator 线上认证 图片 - AI 图片快速去背 图片 - AI 黑白照片上色 声音 - AI 影词组音转字幕 影片 - Pika 生成创意影片 影片 - KlingAI 生成影片 影片 - AI 影片趣味特效 影片 - AI 拥抱 ( AI Hug ) 影片 - AI 老照片动起来 图片 - Dreamina 生成图片 音乐 - SUNO 创作音乐 音乐 - 免费 AI 音乐素材

ChatGPT

认识 ChatGPT 开始使用 ChatGPT 优良的提示技巧 基本提示 实用组合提示 角色扮演&对话主题 阅读并模仿风格 对话中显示图片 创作长篇故事与小说 使用 Bing Chat 相关工具或服务

Poe ( Poe AI )

开始使用 Poe 聊天机器人 生成图片机器人 建立自己的机器人 Youtube 影片重点整理 PDF 重点整理 GPT-4o-mini 分析图片 读取网页进行重点整理 让 AI 美化提示词

Ideogram

开始使用 Ideogram 文字产生图片 图片 Retry 与 Remix

dzine

开始使用 dzine 提示词产生图片 图片产生图片 运用图层功能 运用文字和画笔 ( 范例 ) 室内设计透视图实体化 ( 范例 ) 名画转真人照片 ( 范例 ) 真人照片转卡通 ( 范例 ) 真人卡通贴图

Image Creator

开始使用 Image Creator 提示原则与技巧 搭配 Bing Copilot 产生图片 ( 范例 ) 产生分享文章缩图 ( 范例 ) 漫画书风格

Leonardo.Ai

Leonardo.Ai 教学导读 Leonardo.Ai vs Midjourney 认识 Leonardo.Ai 注册与登录 Leonardo.Ai 使用图片产生器 文字提示语法和准则 Elements 风格元素 使用图片产生图片 AI 图片编辑器 ( Canvas Editor ) 即时 AI 画布 ( Realtime Canvas ) 即时图片产生器 ( Realtime Gen ) 图片升级器 ( Universal Upscaler ) 产生图片的后续步骤 Prompt Magic 魔法提示 PhotoReal&Alchemy 特色模型 训练自己的模型 ( 范例 ) 填补缺少的披萨 ( 范例 ) 组合两片披萨 ( 范例 ) 虚拟陈雷 ( 范例 ) 修改人物年龄 ( 范例 ) 换脸特效 ( 范例 ) 隐藏的人脸或文字 ( 范例 ) 全部填满皮卡丘 ( 范例 ) 名画转真人照片

Recraft

开始使用 Recraft 位图 Raster image 向量图 Vector image 图示 Icon 与 Logo 系列图像 Image Set 原型示意图 Mockup 画框 Frame、文字 Text 放大 Upscale、改色 Recolor 图片去背、替换图片背景 添加、修改、移除景物 图片产生图片 位图转向量图 自定义图片风格 合并不同图片 ( 范例 ) 名画转真人照片 ( 范例 ) 照片转卡通插画 ( 范例 ) 自制表情贴图 ( 范例 ) 多格漫画风格 ( 范例 ) 图片中加入文字 ( 范例 ) 延伸图片范围

Midjourney

Midjourney 教学导读 认识 Midjourney 使用 Midjourney 使用 niji.journey 设定指令 功能参数 使用文字提示产生图片 使用图片产生图片 优良的提示技巧 多重提示的权重与顺序 style tuner 样式调校 remix 放大、修改与重绘 blend 混合多张图片 删除图片&传送信息 ( 范例 ) 修改人物年龄 ( 范例 ) 阿尔钦博托风格 ( 范例 ) 照片转卡通人物 ( 范例 ) 变胖、变瘦

Vidnoz AI

开始使用 Vidnoz AI ( 影片 ) 照片讲话 ( 图片 ) 人物换脸 ( 图片 ) 图片去背

Canva AI 魔法功能

AI 魔法媒体工具 ( 文字产生图片和影片 ) AI 魔法工作室 ( 使用 AI 编辑照片 ) AI 魔法变形工具 ( 转换文字或形状 ) AI 魔法文案工具 ( Magic Write )

Clipdrop

开始使用 Clipdrop 修改图片选取区域 延展图片并生成内容 人物换脸 图片去背 移除特定对象 放大与增强图像 图像打光 替换天空

Playground AI

开始使用 Playground AI Board 文字产生图片 Canvas 绘制与修改图片 Remix 与 Edit 图片 延展和放大增强图片 图片去背、移除对象 搭配 Poe AI 产生图片

Replicate 模型

认识 Replicate ( 修图 ) 黑白照片上色 ( 修图 ) 修复老照片 ( 修图 ) 增强与放大照片 ( 修图 ) 更换发型和表情 ( 绘图 ) 似颜绘贴图 ( 绘图 ) 真人照片转公仔 ( 绘图 ) 隐藏的图案或文字 ( 提示 ) 图片转提示词 ( 提示 ) 改善提示词

AI 绘图效果&范例

着色本效果 2D 卡通人物 物品开箱照 像素艺术 百科全书风格 卡通贴纸

AI 绘图风格大全

风格大全 ( 总览 ) 风格大全 ( 摄影、照片 ) 风格大全 ( 画面角度效果 ) 风格大全 ( 媒材、材质 ) 风格大全 ( 卡通、漫画 ) 风格大全 ( 艺术流派风格 ) 风格大全 ( 艺术家、画家 ) 风格大全 ( 插画风格 1 ) 风格大全 ( 插画风格 2 ) 风格大全 ( 特色风格 )

Vibe Coding 打造 LINE Bot

过去要开发 LINE Bot ( LINE 机器人 ),往往需要钻研复杂的 SDK 文件或阅读大量教学,现在透过 Vibe Coding,只需用自然语言描述逻辑,就能驱动 AI 写出完整的 LINE Bot!这篇奇穴将示范如何透过 Vibe Coding 与 Gemini 的智慧,在极短的时间内打造出一个具备良好互动性与无限可能的 LINE 机器人。

快速导览:

Vibe Coding 极速打造 LINE Bot 智能机器人

认识 LINE Bot:通讯软件上的自动化服务

LINE Bot 是一种运行在 LINE 通讯软件上的自动化服务,其运作方式会先以“官方账号”为主,如果串接后端程序,就可以由程序码自动处理消息,如果串接后端,功能就可以涵盖简单的关键字回复,或是复杂的商务系统,例如订餐、预约挂号、或是结合 AI 的个人小帮手。对于台湾开发者而言,这是触及用户最直接、门槛最低的平台之一。

常见的应用场景

  • 自动化客服:即时回复常见问题 ( FAQ ),提供 24 小时不间断的初步咨询服务。
  • 商务与电商:实现线上订餐、商品浏览、订单追踪及支付成功通知。
  • 行政与预约:处理诊所挂号、美容美发预约、场地租借或活动报名流程。
  • 信息即时推播:根据用户需求发送天气预报、股价异动通知、新闻摘要或交通信息。
  • 行销与会员经营:发放电子优惠券、数字集点卡,并进行精准的分众行销消息推送。
  • AI 个人助手:整合大型语言模型进行创意写作、语言翻译、程序码优化或知识百科查询。

为什么选择 LINE Bot 作为开发首选?

在众多通讯平台中,LINE 凭借其高渗透率与完善的开发者生态系,成为验证产品原型与部署自动化服务的理想选择。相较于开发原生 App,LINE Bot 在获客成本与技术门槛上具有显著优势。以下是选择 LINE 作为开发平台的核心理由:

  • 低进入门槛:用户无需下载额外的 App,只要加入好友即可使用。
  • 高触及率:利用 LINE 的高渗透率,能直接在用户常用的通讯工具中建立互动。
  • 开发成本可控:LINE Messaging API 提供免费额度 ( 轻量版方案 ),适合个人开发者或初创项目进行概念验证。
  • 多样化的互动界面:除了纯文字,还支援 Flex Message 与 Rich Menu,媲美原生 App 的视觉体验。

Vibe Coding 极速打造 LINE Bot 智能机器人 - 为什么选择 LINE Bot 作为开发首选?

深入解析 Webhook 运作机制

第一次建立 LINE Bot 都会有一个疑问:“什么是 Webhook?”,Webhook 指的是一个“网址”,透过服务器建立 Webhook 网址后,有串接 Webhook 的位置就能使用 HTTP 的 POST 方法,向服务器传送或接收特定的数据,其运作流程如下:

  • Step 1、用户发送消息

    用户在 LINE 视窗输入文字或传送贴图。

  • Step 2、LINE 平台转发

    LINE 平台接收到消息后,会将其封装成 JSON 格式的 Request,透过设定好的“Webhook URL”把消息传送到自己的服务器。

  • Step 3、服务器处理逻辑

    自己的服务器解析消息 ( 这篇教学中会由 Vibe Coding 产生程序码 ),并决定回复的内容。

  • Step 4、回传消息

    自己的服务器将回复内容,透过“Webhook URL”传回 LINE 平台。

  • Step 5、用户接收回复

    LINE 平台将消息呈现给用户。

Vibe Coding 极速打造 LINE Bot 智能机器人 - 深入解析 Webhook 运作机制

建立 LINE Provider

因为要撰写 LINE Bot 的“程序”,所以必须先从“LINE 开发者平台”建立“提供者 Provider”,使用自己的 LINE 账号登录 LINE 开发者平台。

前往 LINE 开发者平台:https://developers.line.biz/en/

Vibe Coding 建立 LINE Provider - 因为要撰写 LINE Bot 的“程序”,所以必须先从“LINE 开发者平台”建立“提供者 Provider”,使用自己的 LINE 账号登录 LINE 开发者平台

登录后,在 Providers 的位置点选“Create”建立 Provider。

Vibe Coding 建立 LINE Provider - 登录后,在 Providers 的位置点选“Create”建立 Provider

输入 Provider 的名称 ( 接着需要填写一些基本数据,简单填写即可 )。

Vibe Coding 建立 LINE Provider - 输入 Provider 的名称 ( 接着需要填写一些基本数据,简单填写即可 )

完成后就会看到自己的 Provider 出现在画面中。

Vibe Coding 建立 LINE Provider - 完成后就会看到自己的 Provider 出现在画面中

建立 LINE Channel 并启用 Message API

Provider 建立后,接着前往“LINE 官方账号”页面,接下来的步骤要建立一个“自己的 LINE 官方账号”,并把这个官方账号和刚刚建立的 Provider 串联在一起。使用同样的 LINE 账号登录 LINE 官方账号,登录后选择“线上申请一般账号” ( LINE 官方账号通常也就是俗称的 LINE Bot 机器人 )。

前往 LINE 官方账号:https://tw.linebiz.com/

Vibe Coding 建立 LINE Channel 并启用 Message API - 使用同样的 LINE 账号登录 LINE 官方账号

输入官方账号名称、建立者 email 和地区,自行选择这个官方账号相关的业种 ( 性质 ),完成后可能还有一些隐私授权页面,全部勾选同意就可以建立完成。

Vibe Coding 建立 LINE Channel 并启用 Message API - 输入官方账号名称、建立者 email 和地区,自行选择这个官方账号相关的业种 ( 性质 ),完成后可能还有一些隐私授权页面,全部勾选同意就可以建立完成

建立完成后就可以看到类似下方的 LINE 官方账号页面。

Vibe Coding 建立 LINE Channel 并启用 Message API - 建立完成后就可以看到类似下方的 LINE 官方账号页面

点击右上方的“设定”按钮进入设定画面,点击左侧“Message API”,继续点击“启用 Message API”,这是让 LINE 官方账号可以透过 API 接口向后端传递消息的功能。

Vibe Coding 建立 LINE Channel 并启用 Message API - 点击右上方的“设定”按钮进入设定画面,点击左侧“Message API”,继续点击“启用 Message API”,这是让 LINE 官方账号可以透过 API 接口向后端传递消息的功能

启用时需要选择“服务提供者”,选择刚刚在 LINE 开发者平台建立的 Provider。

Vibe Coding 建立 LINE Channel 并启用 Message API - 启用时需要选择“服务提供者”,选择刚刚在 LINE 开发者平台建立的 Provider

建立时需要填写“Webhook 网址”,这时可以先随便填写一组具有“https://”开头的网址,待会会透过 Vibe Coding 搭配 Google Apps Script 产生真正的网址。

Vibe Coding 建立 LINE Channel 并启用 Message API - 建立时需要填写“Webhook 网址”,这时可以先随便填写一组具有“https://”开头的网址,待会会透过 Vibe Coding 搭配 Google Apps Script 产生真正的网址

Message API 设定完成后,点击左侧“回应设定”,关闭“自动回应消息”,打开“Webhook”。

Vibe Coding 建立 LINE Channel 并启用 Message API - Message API 设定完成后,点击左侧“回应设定”,关闭“自动回应消息”,打开“Webhook”

取得 LINE Channel Access Token

从 LINE 官方账号建立 LINE Channel 并绑定 Provider 之后,回到 LINE 开发者平台,进入刚刚建立的 Provider,就可以看见刚刚建立的 LINE Channel ( 如果看不见请重新整理网页 ),点击 LINE Channel 可以进入设定页面。

Vibe Coding 建立 LINE Channel 并启用 Message API - 从 LINE 官方账号建立 LINE Channel 并绑定 Provider 之后,回到 LINE 开发者平台,进入刚刚建立的 Provider,就可以看见刚刚建立的 LINE Channel ( 如果看不见请重新整理网页 ),点击 LINE Channel 可以进入设定页面

在“Messaging API”的页签中,可以看见这个 LINE 官方账号的 ID,扫描 QRCode 就可以将这个官方账号加入好友。

Vibe Coding 建立 LINE Channel 并启用 Message API - 在“Messaging API”的页签中,可以看见这个 LINE 官方账号的 ID,扫描 QRCode 就可以将这个官方账号加入好友

在同样“Messaging API”的页签中往下拉到最下方,可以看见 Channel Access Token 的区域,点击“Issue”就能产生一组串接金钥,点击后方“Reissue”可以重新产生 ( 如果发现有人擅自串接这组金钥 )。

Vibe Coding 建立 LINE Channel 并启用 Message API - 在同样“Messaging API”的页签中往下拉到最下方,可以看见 Channel Access Token 的区域,点击“Issue”就能产生一组串接金钥,点击后方“Reissue”可以重新产生

Vibe Coding 建立并串接 LINE Webhook

上述的准备都做都完成后,接着就可以透过 Vibe Coding 的方式撰写服务器的程序内容,首先前往自己的 Google 云端硬盘,打开一个文件夹放置串接程序 ( 范例建立一个名为 LINE Bot 的文件夹 ),并在文件夹里新增一个“Google Apps Script”。

Vibe Coding 建立 LINE Channel 并启用 Message API - 前往自己的 Google 云端硬盘,打开一个文件夹放置串接程序 ( 范例建立一个名为 LINE Bot 的文件夹 ),并在文件夹里新增一个“Google Apps Script”

点击“建立指令码”建立 Google Apps Script。

Vibe Coding 建立 LINE Channel 并启用 Message API - 点击“建立指令码”建立 Google Apps Script

完成后可以看见如下方的界面,这时可以依自己喜好修改文件名称 ( 范例档名为“Vibe Coding Line Bot”)。

Vibe Coding 建立 LINE Channel 并启用 Message API - 完成后可以看见如下方的界面,这时可以依自己喜好修改文件名称 ( 范例档名为“Vibe Coding Line Bot”)

打开自己自己常用的 AI 工具 ( 推荐 Gemini,因为都是 Google 工具 ),输入下列提示词,让 AI 产生串接 LINE Bot 的程序。

請幫我在 Google Apps Script 裡面,產生一個可以串接 LINE Bot 的簡單網頁應用程式程式碼,收到訊息後可以自動回覆同樣的訊息

送出提示词之后,AI 就会产生要放在 Apps Script 里的程序码。

Vibe Coding 建立 LINE Channel 并启用 Message API - 送出提示词之后,AI 就会产生要放在 Apps Script 里的程序码

复制程序码,贴到刚刚的 Google Apps Script 里,贴上之后,注意程序码的开头,有一段 Channel Access Token 需要更换成自己的 Channel Access Token,把刚刚上方产生的 Channel Access Token 贴到这边。

Vibe Coding 建立 LINE Channel 并启用 Message API - 复制程序码,贴到刚刚的 Google Apps Script 里,贴上之后,注意程序码的开头,有一段 Channel Access Token 需要更换成自己的 Channel Access Token

完成后点击右上方“部署 > 新增部署作业”。

Vibe Coding 建立 LINE Channel 并启用 Message API - 完成后点击右上方“部署 > 新增部署作业”

选择“网页应用程序”,存取权限设定为“所有人”,完成后点击“部署”。

Vibe Coding 建立 LINE Channel 并启用 Message API - 选择“网页应用程序”,存取权限设定为“所有人”

点击“授予存取权”。

Vibe Coding 建立 LINE Channel 并启用 Message API - 点击“授予存取权”

点击“Advanced”展开进阶选项,点击“Go to...”继续部署。

Vibe Coding 建立 LINE Channel 并启用 Message API - 点击“Advanced”展开进阶选项,点击“Go to...”继续部署

点击“Continue”继续。

Vibe Coding 建立 LINE Channel 并启用 Message API - 点击“Continue”继续

完成后就会得到一串应用程序网址,这串网址就是要串接 LINE Bot 的 Webhook 网址,点击复制按钮复制网址。

Vibe Coding 建立 LINE Channel 并启用 Message API - 完成后就会得到一串应用程序网址,这串网址就是要串接 LINE Bot 的 Webhook 网址,点击复制按钮复制网址

回到 LINE 开发者平台,进入这个 LINE Channel 设定页面的“Messaging API”设定页面,找到 Webhook Setting,贴上刚刚的网址,贴上后也可以点击“Verify”验证测试 ( 有时候会回传 302 错误,这表示刚刚 Apps Script 发布没有选择“所有人”,如果有选择“所有人”仍然报错,可以先和 LINE 机器人聊天看看是否会正常回传消息 )。

Vibe Coding 建立 LINE Channel 并启用 Message API - 回到 LINE 开发者平台,进入这个 LINE Channel 设定页面的“Messaging API”设定页面,找到 Webhook Setting,贴上刚刚的网址,贴上后也可以点击“Verify”验证测试

所有步骤都完成后,就可以和 LINE Bot 聊天,如果 LINE Bot 会正常回传消息,表示已经顺利串接成功,剩下来如果要添加功能,就可以运用 Vibe Coding 的方式开发。

Vibe Coding 建立 LINE Channel 并启用 Message API - 所有步骤都完成后,就可以和 LINE Bot 聊天,如果 LINE Bot 会正常回传消息,表示已经顺利串接成功

小结

透过 Vibe Coding,开发 LINE Bot 不再是工程师的专利,开发模式从传统的“刻程序码”转化为“调教 Vibe”,开发者就能将更多心力放在用户体验与撰写 AI 提示词,熟练这套流程后,任何创意想法都能在几分钟内变成 LINE 上的实际服务,这就是 AI 赋予开发者的全新超能力。

延伸阅读

Vibe Coding 的重点都不在于“写程序”,而是为了配合程序的各种“准备工作”,下方列出 Vibe Coding 相关的教学,透过一系列的教学,就更能掌握正确且顺畅的开发流程:

意见反馈

微信二维码 微信扫码关注 抖音二维码 抖音扫码关注