通用概念
- AI（人工智能）： 由机器（尤其是计算机系统）对人类智能过程进行模拟，从而完成学习、推理和解决问题等任务。
- 提示： 一段文本或输入，用于引导 AI 模型生成输出或执行特定任务。 提示是 Lovable 的核心功能之一，你通过提示在应用中创建或修改特定组件或元素。
与 Lovable 相关的特定术语
- Chat Mode： Lovable 不只是用来生成代码；它还是一个交互式助手，会在开发的每个阶段为你提供引导。它帮助创始人进行批判性思考、有效规划、智能调试，并自信地完成发布。
- Edit Mode（编辑模式）：对内容或代码进行更改或修改的操作。
- Edit： 一款工具，通过原生支持 Tailwind 的可视化控件，实现由 AI 驱动的开发，方便你进行精细调整。
- History（历史）：用于随时间跟踪和管理你的应用和代码变更的系统。
- Knowledge： 在一份会随你的应用一起演进的活文档中记录关键项目细节。
- Labs： Lovable 内的实验性功能区域，用于测试和展示新的、创新的或尚在开发中的功能。这些功能可能随时被修改或移除。
- 复刻（Remix）： 你可以复刻一个现有的公开项目，或复刻你自己的项目。复刻允许你将当前项目状态作为起点，并在此基础上继续构建。这是探索新想法、做出调整，或在保留原始版本的前提下尝试不同变更方案的绝佳方式。请注意，当项目连接了 Supabase 时，无法进行复刻。
- 预览（Preview）： 以交互方式，让用户在内容或功能最终定稿或发布之前，查看或体验其实时效果。
- Diff： 用于展示同一文件或代码两个版本之间差异的比较结果。
- /index： 指网站或应用的主页面或默认页面，通常命名为 “index.html” 或 “index.js”。
- Lovable API - Build with URL： Lovable API 的 Build with URL 功能允许你通过 URL 参数传递提示和图片，以编程方式创建应用。这使其可以无缝集成到网站、内部工具或自动化工作流中，让用户只需一键就能生成 Lovable 应用。
产品和开发概念
产品管理与策略
- MVP (Minimum Viable Product) – 具备最少可行功能的产品版本，用于满足早期用户需求，并在全面开发前验证产品想法。
- Roadmap – 概述产品在一段时间内的愿景、方向和计划功能的高层次战略规划。
- Feature Request – 来自用户或相关方的、针对产品新增功能的正式或非正式建议。
- User Story – 从终端用户视角撰写的、对某个功能或需求的简短且简单的描述。
- User Journey: 用户在某个产品或服务中，为达成特定目标而经历的一系列步骤。
- Persona: 基于研究构建的目标用户人物角色，用于指导设计和开发决策。
工程概念
- PRD（产品需求文档，Product Requirements Document）： 一份全面说明产品目标、功能和规格的文档，用于指导开发。
- API （应用程序编程接口，Application Programming Interface）： 不同服务之间进行通信的一种方式。你可以把它理解为一种协议，用来说明系统之间可以获取或发送哪些信息。最常见的类型是许多网站使用的 REST API，以及提供更灵活数据查询方式的 GraphQL API。
- 重构（Refactor）： 在不改变代码外部行为的前提下，对已有代码进行结构调整，以提升可读性、可维护性或性能的过程。
- GitHub： 一个基于 Web 的平台，用于使用 Git 进行版本控制和协作式软件开发。
数据与分析
- A/B Testing – 一种对比两个网页或功能版本的方法，用于根据用户行为确定哪个版本表现更好。
- Conversion Rate – 完成预期操作（例如注册或购买）的用户所占的百分比。
- Churn Rate – 在特定时间段内停止使用某产品的用户所占的百分比。
- Retention Rate – 在一段时间内持续使用某产品的用户所占的百分比。
- Event Tracking – 监控特定用户行为（例如按钮点击、表单提交），以获取关于用户行为和参与度的见解。
UI/UX 和前端开发实践指南
前端开发
- Frontend： 软件应用中用户直接交互的部分，包括用户界面和用户体验相关的元素。
- React： 由 Facebook 开发的 JavaScript 库，用于构建用户界面，特别是单页应用。
- Gradient（渐变）： 设计中在两种或多种颜色或色调之间的渐进过渡。
- Tailwind CSS：开源的、实用类优先的 CSS 框架，提供了一整套预定义的类，使开发者可以在 HTML 中直接通过为元素添加这些工具类来构建自定义设计。
- Design Systems（设计系统）： 一套可复用组件、规范和标准，用于确保产品或品牌在设计上的一致性与连贯性。
UI/UX 设计概念
- Accent Color（强调色）： 一种用于突出设计中关键元素的醒目颜色，通常与品牌主色保持一致或形成互补，以增强视觉吸引力。
- Theme（主题）： 一组连贯一致的设计选择，包括颜色、字体和布局，用于定义应用或网站的整体美感和用户体验。
- Responsive Design（响应式设计）： 一种网页设计方法，确保内容能够在不同设备尺寸和方向上无缝自适应，为用户提供最佳使用体验。
- Above the Fold（首屏内容）： 网页中用户无需滚动就能看到的部分，对迅速抓住注意力并即时传达关键信息至关重要。
- CTA（Call to Action，行动号召）： 一种提示，通常以按钮或链接形式出现，用于鼓励用户执行特定操作，例如「Sign Up」或「Learn More」。
- Headings（标题）： 用于引出并组织内容版块的文本元素，通常通过不同级别（例如 H1、H2）来建立清晰的内容层级结构。
- Footer（页脚）： 网页底部区域，通常包含联系方式、导航链接以及法律声明等补充信息。
- Breadcrumb（面包屑导航）： 一种导航辅助元素，用于显示用户在站点层级结构中的当前位置，通常以水平链接列表的形式呈现。
- Favicon（网站图标） – 显示在浏览器标签页、书签和搜索结果中的小图标，通常用于代表某个品牌或网站。
- Meta Title（标题标签） – 出现在搜索引擎结果和浏览器标签页中的网页标题，会影响 SEO 和用户点击率。
- Meta Description（元描述） – 显示在搜索引擎结果中的网页内容简短摘要，用于提升搜索可见性和用户参与度。
- Canonical URL（规范 URL） – 用于指定网页首选版本的标签，有助于避免搜索引擎索引时出现重复内容问题。
- URL Slug（URL 短路径） – URL 中用来以可读格式标识特定页面的部分（例如
example.com/product-name）。 - Sitemap（站点地图） – 提供网站页面列表的结构化文件（XML 或 HTML），帮助搜索引擎高效索引这些页面。
- Navigation Bar（导航栏 / Nav Bar） – 提供指向网站关键版块链接的水平或垂直菜单，方便用户导航。
- Skip Links（跳过链接） – 隐藏链接，让用户可以跳过重复内容，直接导航到主内容区域，从而提升可访问性。
- Pagination（分页） – 将内容拆分为多个页面的方式，常用于博客、搜索结果和产品列表，以改善用户体验。
- Anchor Link（锚点链接） – 一种超链接，将用户直接跳转到同一页面中的特定区域，而不是加载新页面。
- 404 Page（404 页面） – 当用户尝试访问不存在的 URL 时显示的自定义错误页面，用于引导他们回到相关内容。
通知和反馈元素
- Toast： 一种简短、非侵入式的通知，短暂出现，用于告知用户某个操作的结果或提供简单反馈。
- Snackbar – 类似于 toast，但通常位于屏幕底部，并可以包含可选操作（例如在删除项目后提供“Undo（撤销）”操作）。
- Tooltip – 当鼠标悬停或焦点聚焦在某个元素上时出现的小弹出框，用于提供附加信息。
- Badge – 小型视觉标记，通常显示在图标或按钮上，用于展示通知、数量或状态更新。
- Loading Spinner（Loader） – 表示处理过程正在进行中的视觉指示器，例如加载页面或提交表单时。
- Progress Bar – 表示任务或流程完成百分比的水平进度条。
- Skeleton Loader – 一种骨架屏式占位 UI，在内容加载完成前先按最终内容的布局显示占位界面，从而提升感知性能。
覆盖层与弹出组件
- Popover： 一种临时浮层，用于展示与特定 UI 元素相关的额外信息或选项，通常在用户与其交互时出现。
- Dialog（Modal）： 出现在主内容前方的窗口，用于集中用户注意力，通常在返回主界面之前需要用户先执行某个操作。
- Drawer（侧边栏面板） – 从屏幕侧边滑出的面板，用于展示导航选项或设置，而不会打断对主内容的浏览。
- Lightbox – 以模态窗口形式放大展示图片或媒体，并使背景变暗以便用户聚焦于当前内容。
- Alert Box – 由系统或应用触发的消息框，用于告知用户重要信息，例如错误或警告。
- 按钮（Button）： 一个可点击的元素，用于触发某个操作或事件，例如提交表单或打开对话框。
- 开关（Switch/Toggle）： 一种切换控件，使用户能够在两个状态之间切换，例如开或关，外观通常类似于物理开关。
- 选项卡（Tabs） – 一种组件，用于在同一界面中将内容组织为多个视图，让用户在不离开当前页面的情况下在不同部分之间切换。
- 步进器（Stepper，向导 Wizard） – 一种用于多步骤流程的组件，向用户显示当前所处步骤，并引导其完成整个流程。
- 分页（Pagination） – 一种 UI 模式，将内容分成多个页面，常用于搜索结果或内容量较大的应用中。
- 面包屑导航（Breadcrumb） – 一种导航辅助元素，用于显示用户在站点层级结构中的当前位置，通常以水平链接列表的形式展示。
- 手风琴（Accordion） – 一种可折叠面板，可展开或收起以动态显示或隐藏内容。
- 下拉菜单（Dropdown Menu） – 当用户点击或悬停在按钮或字段上时出现的选项列表，常用于导航或进行选项选择。
表单和输入元素
- Form： 一组结构化的输入字段，允许用户提交数据，例如联系信息或搜索请求。
- Radio Group（单选按钮组）： 一组相关的单选按钮，允许用户在多个选项中只能选择一个。
- Checkbox（复选框）： 一种可交互的方框，用户可以勾选或取消勾选来选择或取消选择某个选项，支持在同一组中进行多选。
- Text Field（Input Field 文本输入框） – 基本的 UI 元素，用户可以在其中输入文本，例如搜索框、登录表单或评论输入框。
- Text Area（多行文本框） – 用于多行文本输入的较大输入区域，常用于消息或反馈表单。
- Select（Dropdown Select Box 下拉选择框） – 一种 UI 元素，允许用户从预设列表中选择一个选项，通常以下拉菜单形式呈现。
- Date Picker（日期选择器） – 一种 UI 元素，让用户通过日历选择日期，而不是手动输入。
- Slider（Range Selector 滑块选择器） – 一种控件，允许用户通过在轨道上拖动滑块来设置某个范围内的数值。
- File Upload Field（文件上传字段） – 一种组件，让用户从其设备中选择并上传文件。
- Autocomplete（Typeahead Search 自动补全搜索） – 一种文本输入框，用户输入时会动态显示匹配结果，从而提升搜索类场景的易用性。
设计风格与趋势
你可以在任何提示中使用这些术语，用来描述你想要实现的特定风格。
- Neobrutalism： 一种网页设计趋势，其特点是粗犷、未打磨的元素，醒目的字体排版和高对比度视觉效果，灵感源自 20 世纪中期的粗野主义建筑。
- Retro： 融合过去年代的风格、图案和元素的设计，营造怀旧感和复古美学。
- Hacker： 一种体现 DIY 和开源文化的美学风格，通常使用等宽字体、深色背景以及仿终端界面。
- Glass（Glassmorphism）： 一种设计风格，运用半透明、磨砂玻璃质感的元素，并搭配细腻的阴影和边框来营造层次感。
- Nudy： 一种极简设计手法，采用裸色或中性色调的配色方案，营造柔和且低调的视觉效果。
设计与素材资源
- 21st.dev： 一个开源社区组件库，提供简约、现代且可复用的 React UI 组件，基于 Tailwind CSS 和 Radix UI 构建，旨在帮助设计工程师更高效地交付精致的用户界面。
- Dribble： 一个领先的在线社区，设计师和创意从业者可以在这里展示作品、获取设计灵感，并与潜在客户或合作伙伴建立联系。
- Noun Project： 一个提供海量免费图标与图库照片的平台，使用户可以为各种项目获取视觉资源。
- SVG Repo： 一个收录超过 500,000 个开放授权 SVG 矢量图和图标的综合素材库，允许用户搜索、浏览、编辑和下载适用于各类项目的图形。
- Google Fonts： 一个免费的网页优化字体库，为设计师和开发者提供丰富的字体选择，以提升项目的排版效果。
- Typewolf： 一个通过展示流行字体并提供精选字体列表，帮助设计师为其项目挑选理想字体搭配的资源网站。
后端开发与数据库
后端基础知识
- Backend： 应用的服务器端基础设施，用于处理和存储数据以及执行业务逻辑。
- Supabase： 一个开源的后端即服务平台，提供 Postgres 数据库、身份验证、即时可用的 API 和实时功能。
- Webhooks —— 事件驱动的 HTTP 回调，在特定操作发生时通知外部应用。
数据库管理与查询
- CRUD（Create, Read, Update, Delete）： 在数据库或应用程序中对数据执行的四种基本操作。
- SQL（Structured Query Language）： 一种领域特定的编程语言，用于管理和操作关系型数据库，可执行查询、更新和组织数据等任务。
- PostgreSQL —— 一种功能强大的开源关系型数据库，以其可伸缩性、可扩展性以及对 ACID 事务特性的遵循而闻名。
Supabase 特定概念
- Edge Function： 在服务器端运行的 TypeScript 函数，全球分布在靠近用户的边缘节点。可用于监听 webhook，或将你的 Supabase 项目与 Stripe、Anthropic、Resend 等第三方服务集成。
- RLS（Row-Level Security）： 一种数据库功能，可基于用户角色或属性控制对表中某些行的访问——本质上允许你设置细粒度的授权规则，从而编写符合你特定业务需求的复杂 SQL 规则。
- Storage： 用于存储和管理数据的服务或系统，例如图像、视频、文档及任何其他文件类型。
- Bucket： 在 Supabase Storage 中，bucket 是一个独立的容器，用于组织文件和文件夹，决定访问模型（公开或私有），并设置上传限制，如最大文件大小和允许的内容类型。
- Endpoint： 在 Supabase 中，endpoint 指一个特定的 URL，客户端可以通过它使用 RESTful API 与数据库交互，执行创建、读取、更新或删除数据等操作。
- Authentication Provider： 用于验证用户凭证的实体或服务，使用户能够安全地访问应用或系统。在 Supabase 中，authentication provider 包括多种方式，例如基于密码的登录、magic link、一次性密码（OTP）、社交登录，以及单点登录（SSO）集成，为用户身份验证提供灵活且安全的方案。
安全与身份认证
- OAuth – 一种广泛使用的身份认证协议，允许用户通过 Google、Facebook 或 GitHub 等第三方服务登录应用程序。
- 双重身份认证 (2FA) – 一种安全措施，要求用户在访问账户前提供两种身份认证方式。
- CORS（跨域资源共享） – 一项安全策略，用于控制哪些网站或应用可以访问服务器上的资源。