Skip to main content

术语表

了解您需要导航和有效使用 Lovable 的关键开发术语。

一般概念​

  • AI（人工智能）：机器，尤其是计算机系统，对人类智能过程的模拟，从而实现诸如学习、推理和问题解决等任务。

  • 提示：一段文本或输入，用于指导 AI 模型生成输出或执行特定任务。这是 Lovable 的核心功能，通过提示，您可以创建、修改应用程序中的特定组件或元素。

Lovable 特定术语​

  • 聊天模式：Lovable 不仅仅是生成代码；它成为一个互动助手，引导您完成开发的每个阶段。它帮助创始人进行批判性思考、有效规划、智能调试，并自信地发布产品。

  • 编辑模式：对内容或代码进行更改或修改的操作。

  • 编辑：一个工具，使用基于 Tailwind 的原生视觉控件，实现 AI 驱动的开发，便于轻松精炼。

  • 历史记录：用于跟踪和管理您的应用程序和代码随时间变化的系统。

  • 知识：在随应用程序演变的动态文档中捕获项目的基本细节。

  • 实验室：Lovable 中的实验性功能，专用于测试和展示新颖、创新或正在开发的特性。这些功能可能随时被修改或移除。

  • 重混：您可以重混现有的公共项目或您自己的项目。重混允许您以项目的当前状态作为起点进行构建，从而在保留原版的同时探索新想法、进行调整或迭代不同的更改。请注意，当连接 Supabase 时，无法进行重混。

  • 预览：允许用户在内容或功能最终确定或发布前，以互动方式查看或体验实时内容或功能。

  • 差异（Diff）：对文件或代码的两个版本进行比较，以显示其差异。

  • /index：指网站或应用程序的主页或默认页，通常命名为“index.html”或“index.js”。

  • Builder.io：集成功能，允许用户将 Figma 设计直接导出到 Lovable 中，从而无需编码即可构建全栈应用程序。

产品与开发概念​

产品管理和策略​

  • MVP（最小可行产品） – 一个产品版本，仅包含足够的特性来满足早期采用者并在全面开发前验证想法。

  • 路线图 – 一个高层战略计划，概述产品的愿景、方向和计划特性，随着时间推移。

  • 功能请求 – 来自用户或利益相关者的正式或非正式建议，针对产品的新功能。

  • 用户故事 – 从最终用户视角撰写的简短、简单的功能或需求描述。

  • 用户旅程：用户在产品或服务中为实现特定目标而采取的一系列步骤。

  • 用户角色：基于研究创建的虚构目标用户表示，用于指导设计和开发决策。

工程概念​

  • PRD（产品需求文档）：一个全面文档，概述产品的目标、特性和规范，以指导开发。

  • API（应用程序编程接口）：不同服务之间进行通信的方式。可以将其视为一种协议，告诉您可以在系统之间获取或发送何种信息。最常见的类型是 REST API（许多网站使用）和 GraphQL API（提供更灵活的数据查询方式）。

  • 重构：在不改变代码外部行为的情况下，重新结构化现有代码，以提高可读性、可维护性和性能。

  • GitHub：一个基于 Git 的网络平台，用于版本控制和协作软件开发。

数据与分析​

  • A/B 测试 – 通过比较网页或功能的两个版本，来确定基于用户行为的哪一个表现更好。

  • 转化率 – 完成预期操作（如注册或购买）的用户百分比。

  • 流失率 – 在给定时期内停止使用产品的用户百分比。

  • 留存率 – 持续使用产品的用户百分比。

  • 事件跟踪 – 监控特定用户操作（如按钮点击或表单提交），以获取行为和参与度的洞见。

UI/UX 和前端开发手册​

前端开发​

  • 前端：软件应用程序的用户直接交互部分，包括用户界面和用户体验元素。

  • React：Facebook 开发的 JavaScript 库，用于构建用户界面，特别是单页应用程序。

  • 渐变：在设计中，从一种或多种颜色或阴影逐渐过渡到另一种。

  • Tailwind CSS：一个开源的实用优先 CSS 框架，提供一组全面的预定义类，允许开发人员通过在 HTML 元素上应用这些实用类来直接构建自定义设计。

  • 设计系统：一组可重用组件、指南和标准，确保产品或品牌中的设计一致性和连贯性。

UI/UX 设计概念​

  • 强调色：用于突出设计中关键元素的独特色调，通常与品牌的主体颜色协调或互补，以增强视觉吸引力。

  • 主题：一组连贯的设计选择，包括颜色、字体和布局，定义应用程序或网站的整体美学和用户体验。

  • 响应式设计：一种网页设计方法，确保内容在各种设备尺寸和方向上无缝适应，提供最佳用户体验。

  • 折叠线以上：网页中用户无需滚动即可看到的部分，至关重要，用于立即捕捉注意力并传达基本信息。

  • CTA（行动号召）：一个提示，通常以按钮或链接形式，鼓励用户执行特定操作，如“注册”或“了解更多”。

页面结构与导航​

  • 标题（标题）：用于引入和组织内容部分的文本元素，通常使用不同级别（如 H1、H2）格式化，以建立清晰的内容层次。

  • 页脚：网页底部部分，通常包含补充信息，如联系方式、导航链接和法律免责声明。

  • 面包屑：一个导航辅助工具，显示用户在网站层次结构中的当前位置，通常以水平链接列表形式呈现。

  • 网站图标（Favicon） – 显示在浏览器标签、书签和搜索结果中的小图标，通常代表品牌或网站。

  • 元标题（标题标签） – 网页标题，出现在搜索引擎结果和浏览器标签中，影响 SEO 和用户点击率。

  • 元描述 – 网页内容的简短摘要，显示在搜索引擎结果中，旨在提高发现性和用户参与度。

  • 规范 URL – 用于指定网页首选版本的标签，有助于避免搜索引擎索引中的重复内容问题。

  • URL 别名 – URL 中标识特定页面的可读部分（如 example.com/product-name）。

  • 站点地图 – 一个结构化文件（XML 或 HTML），提供网站页面的列表，帮助搜索引擎高效索引。

  • 导航栏 – 提供链接到网站关键部分的水平或垂直菜单，便于导航。

  • 跳过链接 – 隐藏链接，允许用户跳过重复内容，直接导航到主要内容，提高可访问性。

  • 分页 – 将内容分为多个页面的方法，通常用于博客、搜索结果和产品列表，以改善用户体验。

  • 锚链接 – 一个超链接，将用户定向到同一页面中的特定部分，而不是加载新页面。

  • 404 页面 – 当用户尝试访问不存在的 URL 时显示的自定义错误页面，引导他们返回相关内容。

通知与反馈元素​

  • 吐司通知：一个短暂、非 intrusive 的通知，临时出现以告知用户操作结果或提供简单反馈。

  • 消息条 – 类似于吐司通知，但通常位于屏幕底部，并可包含可选操作（如“撤销”删除项）。

  • 工具提示 – 当用户悬停或聚焦于元素时，弹出的小框，提供额外信息。

  • 徽章 – 一个小型视觉指示器，通常用于图标或按钮上，以显示通知、计数或状态更新。

  • 加载微调器（加载器） – 一个视觉指示器，表示进程正在进行中，如加载页面或提交表单。

  • 进度条 – 一个水平条，表示任务或进程的完成百分比。

  • 骨架加载器 – 一个占位 UI，模仿最终内容的布局，同时等待其加载，从而改善感知性能。

覆盖层与弹出窗口​

  • 弹出信息：一个临时覆盖层，提供与特定 UI 元素相关的额外信息或选项，通常在用户交互时出现。

  • 对话框（模态窗口）：一个窗口，出现在主要内容前面以吸引用户注意力，通常需要用户执行操作后才能返回主界面。

  • 抽屉（侧边面板）：一个从屏幕侧边滑入的面板，用于显示导航选项或设置，而不干扰主要内容。

  • 灯箱：一个模态窗口，用于以放大视图显示图像或媒体，并使背景变暗以聚焦。

  • 警报框：系统生成或应用程序触发的消息框，告知用户重要信息，如错误或警告。

导航与选择元素​

  • 按钮：一个可点击元素，用于启动操作或事件，如提交表单或打开对话框。

  • 开关（切换）：一个切换控件，允许用户在两种状态之间切换，如开或关，通常类似于物理开关。

  • 标签 – 一个组件，将内容组织成单个界面中的多个视图，允许用户在部分之间切换而不离开页面。

  • 步进器（向导） – 用于多步骤过程的组件，向用户显示当前步骤并引导他们完成。

  • 分页 – 一个 UI 模式，将内容分为页面，通常用于搜索结果或内容密集型应用程序。

  • 面包屑 – 一个导航辅助工具，显示用户在网站层次结构中的当前位置，通常以水平链接列表形式呈现。

  • 手风琴 – 一个可折叠部分，可动态展开或收缩以显示或隐藏内容。

  • 下拉菜单 – 当用户点击或悬停在按钮或字段上时出现的选项列表，通常用于导航或选择。

表单与输入元素​

  • 表单：一个结构化的输入字段集合，允许用户提交数据，如联系信息或搜索查询。

  • 单选组：一组相关的单选按钮，允许用户从多个选项中仅选择一个。

  • 复选框：一个可交互的框，用户可以选中或取消选中以选择或取消选项，允许在集合中进行多个选择。

  • 文本字段（输入字段） – 一个基本 UI 元素，用户可以在其中输入文本，如搜索栏、登录表单或评论。

  • 文本区域 – 一个较大的输入字段，设计用于多行文本输入，通常用于消息或反馈表单。

  • 选择框（下拉选择框） – 一个 UI 元素，允许用户从预定义列表中选择一个选项，通常以下拉形式呈现。

  • 日期选择器 – 一个 UI 元素，允许用户从日历中选择日期，而不是手动输入。

  • 滑块（范围选择器） – 一个控件，允许用户通过沿轨道滑动手柄来设置范围内的值。

  • 文件上传字段 – 一个组件，允许用户从设备中选择并上传文件。

  • 自动完成（类型ahead 搜索） – 一个文本输入，随着用户输入动态建议匹配结果，提高可用性。

设计风格与趋势​

信息：您可以在任何提示中使用这些术语来描述您试图实现的具体风格。

  • 新野性主义：一种网页设计趋势，以原始、非抛光元素、粗体字体和高对比度为特征，灵感来源于 20 世纪中叶的野性主义建筑。

  • 复古：设计中融入过去几十年风格、图案和元素的风格，唤起怀旧和复古美学。

  • 黑客：一种美学，反映 DIY 和开源文化，通常使用等宽字体、深色背景和终端风格界面。

  • 玻璃效果（Glassmorphism）：一种设计风格，使用半透明、磨砂玻璃般的元素、微妙阴影和边框来创建深度。

  • 裸色：一种极简主义设计方法，使用裸色或中性色调来创建柔和、低调的美学。

设计与资产资源​

  • 21st.dev：一个开源社区注册表，提供最小化、现代化和可重用 React UI 组件，由 Tailwind CSS 和 Radix UI 提供支持，旨在帮助设计工程师更高效地发布精致的用户界面。

  • Dribble：一个领先的在线社区，设计师和创意专业人士在此展示作品、发现设计灵感，并与潜在客户或合作者建立联系。

  • Noun Project：一个平台，提供大量免费图标和库存照片，供用户访问各种项目的视觉资源。

  • SVG Repo:：一个包含超过 500,000 个开源许可 SVG 矢量和图标的全面库，允许用户搜索、探索、编辑和下载适合各种项目的图形。

  • Google Fonts:：一个免费的网络优化字体库，为设计师和开发者提供广泛的字体选项，以增强他们的项目。

  • Typewolf:：一个资源，通过展示流行字体并提供精选字体列表，帮助设计师为项目选择完美的字体组合。

后端开发与数据库​

后端基础​

  • 后端：应用程序的服务器端基础设施，处理数据处理、存储和业务逻辑。

  • Supabase：一个开源的后端即服务平台，提供 Postgres 数据库、认证、即时 API 和实时功能。

  • Webhooks – 事件驱动的 HTTP 回调，当特定操作发生时通知外部应用程序。

数据库管理和查询​

  • CRUD（创建、读取、更新、删除）：在数据库或应用程序中对数据执行的四种基本操作。

  • SQL（结构化查询语言）：一种特定领域的编程语言，设计用于管理和操作关系数据库，支持查询、更新和组织数据等任务。

  • PostgreSQL – 一个功能强大的开源关系数据库，以其可伸缩性、可扩展性和 ACID 合规性而闻名。

Supabase 特定概念​

  • 边缘函数：全球分布的服务器端 TypeScript 函数，位于边缘（靠近用户）。它们可用于监听 Webhooks 或将 Supabase 项目与第三方（如 Stripe、Anthropic 或 Resend）集成。

  • RLS（行级安全）：数据库中的一个功能，允许基于用户角色或属性控制对特定表中行的访问，从而设置粒度授权规则，以编写符合独特业务需求的复杂 SQL 规则。

  • 存储：用于存储和管理数据的服务或系统，如图像、视频、文档和其他文件类型。

  • 存储桶：在 Supabase 存储中，一个独立的容器，用于组织文件和文件夹，确定访问模型（公共或私有）并设置上传限制，如最大文件大小和允许的内容类型。

  • 端点：在 Supabase 的上下文中，指特定 URL，允许客户端通过 RESTful API 调用与之交互，从而执行创建、读取、更新或删除数据等操作。

  • 认证提供者：一个实体或服务，用于验证用户凭据，从而启用对应用程序或系统的安全访问。在 Supabase 的上下文中，认证提供者包括各种方法，如基于密码的登录、魔术链接、一次性密码（OTP）、社交登录和单点登录（SSO）集成，从而实现灵活且安全的用户认证。

安全与认证​

  • OAuth – 一个广泛使用的认证协议，允许用户使用第三方服务（如 Google、Facebook 或 GitHub）登录应用程序。

  • 双因素认证（2FA） – 一个安全措施，要求用户在访问账户前提供两种形式的身份验证。

  • CORS（跨源资源共享） – 一个安全策略，控制哪些网站或应用程序可以访问服务器上的资源。