Lovable한국어 문서

Lovable 고유 용어 및 기능과, 문서 전반에서 자주 쓰이는 일반 웹 개발 개념을 두 부분으로 나누어 정의합니다.

용어집

문서에서 만나게 될 Lovable 고유의 용어와 기능, 그리고 일반적인 웹 개발 개념에 대한 정의입니다.

이 용어집은 두 부분으로 나뉩니다.

  • Lovable 용어는 Lovable 플랫폼, 그 기능, 그리고 작동 방식과 관련된 고유 용어를 다룹니다.
  • 일반 개발 개념은 Lovable에 국한되지 않지만 문서에 자주 등장하는 웹, 디자인, 백엔드 용어를 다룹니다.

Lovable 용어

모드와 Lovable의 작동 방식

  • Build mode: 프로젝트에 변경 사항을 직접 적용하는 Lovable의 실행 모드입니다. 에이전트가 코드를 작성하고, 도구를 실행하고, 여러 파일에 걸쳐 변경을 적용한 뒤 결과를 검증합니다. 변경 사항을 실제로 반영할 준비가 되었을 때 Build mode를 사용합니다. (이전 명칭은 Agent mode입니다.)
  • Plan mode: Lovable의 추론 및 브레인스토밍 모드입니다. 아이디어를 탐색하고, 접근 방식을 비교하고, 문제를 조사하고, 코드를 변경하기 전에 계획을 검토하거나 편집하는 데 사용합니다. Plan mode는 프로젝트를 절대 수정하지 않습니다.
  • Subagents: Lovable이 작업의 특정 부분을 병렬로 조사, 검사 또는 검토하기 위해 띄우는 임시 읽기 전용 에이전트입니다. 서브에이전트는 결과를 메인 에이전트에 보고하지만 프로젝트를 변경할 수는 없습니다.
  • Prompt: 앱에서 무언가를 생성, 수정, 디버깅 또는 설명하기 위해 Lovable에 보내는 자연어 지시입니다.
  • Follow-up (후속 메시지): Lovable이 이미 작업 중일 때 방향을 조정하려고 보내는 메시지입니다. Lovable은 다음 자연스러운 중단 지점에서 이 메시지를 받아 진행 중인 작업에 반영합니다. message queue를 대체합니다. Lovable이 작업하는 동안 후속 메시지 보내기를 참고하세요.
  • Message queue (메시지 큐, 지원 중단): Lovable이 작업하는 동안 대기했다가 하나씩 실행되는 메시지 대기열입니다. 최근에 실제로 사용한 계정에만 표시되며, 해당 계정은 계정 설정에서 이를 비활성화할 수 있습니다. Message queue(지원 중단)를 참고하세요.
  • Diff: Lovable이 한 턴에서 적용한 파일 변경 사항을 나란히 비교해 보여줍니다.
  • History: 프로젝트 변경 사항의 시간순 기록입니다. 이전 버전으로 되돌리거나 중요한 체크포인트를 북마크할 수 있습니다.
  • Visible tasks (가시적 작업): Build mode 실행 중 Lovable이 무엇을 하고 있는지, 어떤 파일을 다루고 있는지를 단계별로 보여주는 진행 상황 뷰입니다.

워크스페이스, 프로젝트, 사람

  • Workspace: 여러 사람이 함께 빌드하는 공유 공간입니다. 프로젝트, 멤버, 결제, 설정을 담으며, 초대한 모든 사람이 워크스페이스의 공유 플랜과 크레딧으로 각자 원하는 만큼의 자기 프로젝트에서 빌드합니다. 모든 프로젝트는 워크스페이스 안에 존재합니다.
  • Workspace admin settings: 워크스페이스 소유자와 관리자가 신원, 접근 권한, 템플릿, 결제, 도메인, 보안, 개발자 설정을 구성하는 중앙 공간입니다.
  • Project: 자체 코드, 채팅 기록, 통합, 설정을 갖춘 하나의 Lovable 앱입니다. 프로젝트는 항상 워크스페이스에 속합니다.
  • External collaborator (외부 협업자): 특정 프로젝트에 접근 권한을 부여받은 워크스페이스 외부의 사람입니다. 외부 협업자는 워크스페이스 자체에는 좌석을 갖지 않습니다.
  • Project access (프로젝트 가시성): Lovable 에디터에서 누가 프로젝트를 열고 편집할 수 있는지를 제어합니다. Workspace 또는 Restricted (Business 및 Enterprise) 옵션이 있습니다.
  • Restricted project (제한된 프로젝트): 워크스페이스 내에서도 명시적으로 추가된 사람에게만 보이는 프로젝트입니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.
  • Share dialog: 사람이나 그룹을 프로젝트에 초대하고, 역할을 관리하고, 초대 링크를 복사하고, 공유 프리뷰 링크를 만드는 대화 상자입니다.
  • Groups: 프로젝트, 폴더, 게시된 앱에 대한 접근 권한을 일괄적으로 부여하기 위해 사용되는, 이름이 지정된 워크스페이스 멤버 모음입니다. 그룹은 SCIM을 통해 신원 공급자(IdP)에서 동기화할 수도 있습니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.
  • SSO (Single sign-on): OIDC 또는 SAML을 사용하여 신원 공급자(Okta, Microsoft Entra ID, Auth0, Google Workspace)를 통해 이루어지는 워크스페이스 수준의 인증입니다.
  • Domain lock: 검증된 도메인, Enforce SSO, 도메인 전체의 Require SSO 및 Block workspace creation 설정을 결합해 회사 이메일 도메인의 모든 사용자가 SSO로 로그인하고 회사 워크스페이스에서만 일하도록 하는 구성입니다. 제품의 단일 설정이 아니며, 도메인 이전을 막는 등록기관의 domain lock과는 다릅니다. Enterprise 플랜에서 사용할 수 있습니다.
  • SCIM provisioning: 신원 공급자에서 워크스페이스 사용자를 자동으로 생성, 업데이트, 제거하고 그룹을 동기화합니다.
  • Audit logs: 누가, 언제, 어떤 리소스에 무엇을 했는지 보여주는 검색 가능한 워크스페이스 활동 기록입니다. Enterprise 플랜에서 사용할 수 있습니다.
  • Insights: admin과 owner에게 방문 수, 활성 앱, 활성 빌더, 추가된 연결, 방문 수 기준 상위 앱, 편집 수 기준 빌더 등 도입 현황을 보여 주는 워크스페이스 대시보드입니다. Security insights와는 다르며 Business 및 Enterprise 플랜에서 사용할 수 있습니다.

빌드와 편집

  • Preview: Lovable 안에서 보는 앱의 라이브 인터랙티브 뷰입니다. Lovable이 빌드하는 동안 프리뷰가 업데이트되며, 최종 사용자와 동일한 방식으로 상호 작용할 수 있습니다.
  • Preview toolbar: 프리뷰 상단에 있는 툴바로, 프리뷰를 벗어나지 않고 요소를 선택하고, 텍스트를 인라인으로 편집하고, 주석을 그리고, 댓글을 남길 수 있게 해줍니다. 이전의 Visual edits 패널을 대체합니다.
  • Code editor: 프로젝트의 소스 코드를 탐색하고 수동으로 편집하는 Lovable 내부 뷰입니다. 편집은 유료 플랜에서 사용할 수 있습니다. 코드 에디터를 참고하세요. (때때로 Code mode라고도 불립니다.)
  • Knowledge: Lovable이 대화 전반에 걸쳐 기억하는 영속적인 지침입니다. workspace knowledge(워크스페이스의 모든 프로젝트에 적용되는 규칙과 표준)와 project knowledge(프로젝트별 맥락, 페르소나, 관례, 디자인 노트)로 나뉩니다.
  • Skills: 워크스페이스 수준에서 정의되는 재사용 가능한, 이름이 지정된 플레이북입니다. 각 스킬은 마크다운 지침을 패키징하며, / 명령으로 호출하거나 자동으로 트리거되어 일치하는 작업이 발생할 때마다 Lovable이 적용합니다.
  • Cross-project referencing: @ 멘션을 사용하여 워크스페이스의 다른 프로젝트에서 코드, 에셋, 파일 또는 채팅 기록을 가져옵니다. 구현을 다시 만들지 않고 재사용할 수 있습니다.
  • File generation: 프로젝트의 소스 코드를 수정하지 않고도, 채팅에서 직접 데이터를 분석하거나 다운로드 가능한 파일(CSV, PDF, Excel, 차트)을 생성하도록 Lovable에 요청합니다.
  • Browser testing: Lovable이 실제 브라우저에서 앱과 상호 작용하여 클릭하고, 폼을 채우고, 스크린샷을 캡처하며 사용자 흐름을 처음부터 끝까지 검증합니다.
  • Testing tools: 브라우저 테스트, frontend tests(Vitest + React Testing Library), edge tests(엣지 함수용 Deno 테스트 러너)를 아우르는 포괄 기능입니다.
  • Drafts: 프로젝트를 따로 빌드할 수 있는 복사본으로, 각각 자체 채팅, 프리뷰, 편집 내용을 가집니다. 초안을 수락하면 그 편집 내용이 프로젝트에 추가되고, 삭제하면 버려집니다. 모든 초안은 프로젝트의 데이터베이스를 사용하므로 초안이 추가하거나 변경한 데이터는 프로젝트에도 추가되거나 변경됩니다. 모든 플랜에서 사용할 수 있습니다.
  • Remix: 프로젝트의 현재 상태를 새 프로젝트의 시작점으로 재사용합니다. 리믹스는 원본을 보존하면서 독립적으로 편집할 수 있는 복사본을 만듭니다. 자신의 프로젝트, 접근 권한이 있는 모든 프로젝트, 또는 public remixing이 활성화된 다른 사용자의 프로젝트를 리믹스할 수 있습니다.

디자인

  • Design guidance: 빌드 전 단계로, Lovable이 비교할 수 있는 세 가지 가벼운 design directions를 보여주거나, 타이포그래피·색상·레이아웃에 대한 design questions를 묻거나, 시각적 의도가 이미 명확할 때 곧바로 빌드합니다.
  • Design directions (디자인 방향): 빌드 전에 Lovable이 생성할 수 있는 세 가지 나란히 비교되는 HTML 및 Tailwind 프리뷰로, 확정하기 전에 시각적 방향을 고를 수 있습니다.
  • Design systems: 재사용 가능한 React 컴포넌트 라이브러리, 스타일링 가이드라인, 설정 지침을 전용 Lovable 프로젝트에서 정의하는 기능입니다. 워크스페이스의 다른 프로젝트는 해당 디자인 시스템에 연결하여 업데이트를 받을 수 있습니다. 모든 유료 플랜에서 사용할 수 있습니다. 기존 npm 패키지를 디자인 시스템으로 감싸는 기능은 Enterprise 플랜에서만 사용할 수 있습니다.
  • Design templates: 재사용 가능으로 표시된 승인된 Lovable 프로젝트입니다. 템플릿에서 새 프로젝트를 시작하면 구조, 컴포넌트, 구성, 스타일링을 포함한 전체 코드베이스가 복사됩니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.

게시, 호스팅, 도메인

  • Hosting: 서버를 따로 설정할 필요 없이 Lovable이 공개 URL, 자동 HTTPS, 전 세계 여러 위치에서의 전송을 통해 게시된 앱을 제공하는 기능입니다.
  • Publish: 프로젝트를 공개 URL에 배포합니다. 게시는 스냅샷을 만들며, 이후의 편집을 반영하려면 다시 게시해야 합니다.
  • Website access (웹사이트 접근): 게시된 앱을 누가 방문할 수 있는지를 제어하는 설정입니다. 누구나(공개), 워크스페이스만, 또는 그룹·멤버·이메일로 초대한 워크스페이스 외부 사람으로 구성된 맞춤 대상(Business 이상) 중에서 선택할 수 있습니다.
  • Custom domain: 게시된 Lovable 프로젝트에 연결한, 본인이 소유한 도메인(예: yoursite.com)입니다. 다른 등록 기관의 도메인을 연결하거나 Lovable을 통해 구매할 수 있습니다.
  • Transfer a domain: 이미 소유한 도메인을 다른 등록 기관에서 Lovable로 옮겨 Lovable이 등록 기관이 되도록 합니다.
  • Branded app URLs: 워크스페이스의 모든 앱에 대해 기본 your-app.lovable.app을 {app-name}.{workspace-subdomain}.lovable.app으로 대체하는 워크스페이스 수준의 서브도메인입니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.
  • Analytics: 게시된 프로젝트를 위한 기본 제공 트래픽 및 참여 지표입니다.
  • SEO and AI search (AEO): 검색 엔진 최적화(SEO)와 답변 엔진 최적화(AEO)를 결합한 탭입니다. 온디맨드 SEO 검토, sitemap 및 robots.txt 점검, Lighthouse 성능, Semrush 키워드 리서치, Google Search Console 설정을 포함합니다.

호스팅 및 기본 제공 백엔드(Cloud)

  • Lovable Cloud: Lovable이 앱을 호스팅하고 데이터베이스, 스토리지, 인증, realtime 및 함수를 포함한 기본 제공 백엔드를 외부 설정 없이 제공합니다.
  • Database: 사용자, 주문, 메시지 같은 레코드가 테이블에 저장되는 앱의 체계적인 데이터 저장소입니다. Database 뷰에서 테이블 탐색, 레코드 편집, SQL 실행 및 일일 백업 복원을 할 수 있습니다.
  • Storage: 사진과 문서처럼 앱에 업로드된 파일을 담는 버킷입니다. 기본적으로 비공개이며 signed URL로 공유할 수 있습니다.
  • Jobs: 일일 요약 이메일처럼 앱 백엔드에서 예약 실행되며 실행 이력을 제공하는 백그라운드 작업입니다. Lovable에 프롬프트를 보내 생성합니다.
  • Logs: 함수, 데이터베이스, 인증, 스토리지 전반에서 앱 백엔드가 수행한 작업의 검색 가능한 기록이며 디버깅의 시작점입니다.
  • Project usage: 프로젝트의 호스팅 및 백엔드 사용 비용을 카테고리별 크레딧으로 보여주는 화면입니다.
  • Advanced settings (Cloud): 인스턴스 크기, 디스크 공간, 데이터 내보내기, 일시 중지 및 제거 등 프로젝트 백엔드 기반 설정입니다.
  • Edge functions: 결제 처리, 외부 서비스 호출, 웹훅 처리처럼 앱의 백그라운드 로직을 Lovable 서버에서 실행하는 작은 프로그램입니다.
  • Secrets: 브라우저에 노출되지 않도록 백엔드 코드에 제공되는 안전하게 저장된 API 키, 토큰 및 자격 증명입니다.
  • Build secrets: 비공개 패키지 설치용 npm 토큰처럼 프로젝트가 빌드되는 동안 Lovable이 주입하는 워크스페이스 수준의 환경 변수입니다. Enterprise 플랜에서 사용할 수 있습니다.
  • Email auth: 구성 가능한 확인 및 비밀번호 규칙과 함께 이메일 주소·비밀번호 또는 일회용 코드로 로그인하는 Cloud 앱의 기본 인증 방식입니다.
  • Phone auth: 자체 SMS 제공업체를 사용해 전화번호와 SMS 일회용 코드로 로그인하는 방식입니다.
  • Google auth: Lovable이 관리하는 OAuth 또는 본인의 Google Cloud 자격 증명을 사용해 앱 사용자에게 Google 로그인을 제공합니다.
  • Apple auth: Lovable 관리 OAuth 또는 자체 Apple Developer 자격 증명을 사용해 앱 사용자에게 Apple 로그인을 제공합니다.
  • SAML SSO (apps): 앱의 최종 사용자가 자사 신원 공급자(Okta, Entra ID, Google Workspace, OneLogin, JumpCloud 또는 모든 SAML 2.0 IdP)로 로그인할 수 있게 하는 앱 수준 single sign-on입니다. 프로젝트별로 구성되며, 워크스페이스 SSO와는 다릅니다.
  • Lovable workspace identity reuse (apps): 별도 로그인 흐름 없이 앱이 로그인한 워크스페이스 멤버를 자동으로 인식하게 합니다. Business 및 Enterprise 플랜에서 제공되며 워크스페이스 SSO 및 Cloud 앱용 SAML SSO와 다릅니다.
  • Custom emails: 전달률 향상을 위한 자동 SPF, DKIM, DMARC 설정과 함께, 본인 도메인에서 인증 및 앱 이메일을 발송합니다.
  • Payments: Paddle 또는 Stripe로 구동되는 기본 제공 구독 및 일회성 결제입니다.

보안

  • Security overview: Lovable의 기본 제공 보안을 아우르는 항목입니다. Basic 및 Deep 스캔, API 키 보호, RLS 점검, 종속성 감사, 선택적 보안 커넥터를 포함합니다.
  • Basic scan: Lovable 내부에서 로컬로 실행되는 빠른 구성 및 종속성 점검입니다. 무료이며 크레딧을 소모하지 않습니다.
  • Deep scan: 탐지하기 어려운 취약점을 찾기 위한 더 상세한 에이전트형 코드 검토입니다. 무료이며 크레딧을 소모하지 않습니다.
  • Security view: 스캔 결과, 종속성 발견 사항, 보안 권장 사항을 보여주는 프로젝트별 탭입니다.
  • Security center: 모든 프로젝트에 걸쳐 보안 발견 사항, 스캔 커버리지, 예약된 스캔, 시크릿, 종속성 위험을 집계하는 워크스페이스 수준 대시보드입니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.
  • Security insights: 보안 발견 사항, PII, 소유권, 라이프사이클, 게시 상태, 활동을 프로젝트별 단일 검토 우선순위로 결합하는 Security center의 포트폴리오 뷰입니다. Business 및 Enterprise 플랜에서 사용할 수 있습니다.
  • Privacy & security settings: 기본 프로젝트 접근 권한, 게시 권한, MCP 접근, 민감 데이터 스캔, 데이터 보호에 대한 워크스페이스 전체 제어입니다.

통합

  • App + chat connectors: 하나의 공유 계정으로 빌드 중 채팅과 사용자가 이용하는 게시 앱 모두에서 작동하는 연결 유형입니다. 워크스페이스별로 한 번 만들고 필요한 프로젝트에 연결합니다.
  • App user connectors: 게시 앱의 각 최종 사용자가 자신의 계정(예: Gmail 또는 Salesforce)을 연결하여 본인의 권한과 데이터로 앱을 사용하게 하는 연결 유형입니다.
  • Chat connectors (MCP servers): Notion, Linear, Jira, Confluence, Miro 같은 도구의 본인 계정에 대한 개인 연결로, Model Context Protocol을 기반으로 합니다. 빌드하는 동안 해당 도구의 실제 맥락을 채팅에서 Lovable에 제공하며, 게시된 앱의 일부가 되는 일은 없습니다.
  • Custom connector: 워크스페이스 관리자가 사내 서비스 같은 모든 REST API를 대상으로 만드는 앱 + 채팅 커넥터입니다. 해당 워크스페이스의 커넥터 카탈로그에 나타나며, 멤버는 다른 커넥터와 똑같이 연결합니다. Lovable에게 API 호출 방법을 알려주는 커넥터 지식 파일은 워크스페이스 및 프로젝트 지식과 별개입니다.
  • Lovable MCP server: 외부 AI 에이전트와 개발자 도구(ChatGPT, Claude Desktop, Cursor)가 프로그래밍 방식으로 Lovable 앱을 빌드, 반복, 배포할 수 있게 하는 MCP 서버입니다.
  • Lovable AI: 게시한 앱 내부에서 챗봇, 요약, 감정 분석, 이미지 생성, 시맨틱 검색 등에 사용할 수 있는 기본 제공 AI 모델입니다. API 키가 필요 없습니다.
  • Build with URL: 프롬프트와 이미지를 파라미터로 전달하여 URL에서 Lovable 앱을 만드는 방법입니다. 링크를 열면 프롬프트가 미리 채워져 바로 보낼 수 있는 상태가 되므로 "Build with Lovable" 버튼을 임베드하거나 미리 정의한 프롬프트를 공유하는 데 유용합니다.
  • Lovable desktop app: 멀티 탭 프로젝트 관리, 로컬 MCP 지원(Figma, Paper), 키보드 단축키를 갖춘 macOS·Windows 네이티브 앱입니다.
  • Lovable mobile app: 이동 중에 Lovable 프로젝트를 빌드하고 검토하기 위한 모바일 동반 앱입니다.
  • Supabase: 오픈 소스 backend-as-a-service입니다. 기본 제공 백엔드(Cloud)의 대안으로 Lovable 프로젝트에 연결할 수 있습니다.
  • Git sync: 버전 관리, 코드 검토 및 개발자 협업을 위한 Lovable 프로젝트와 Git 저장소 간 양방향 동기화입니다. GitHub와 GitLab에서 작동합니다.
  • GitHub integration: GitHub 저장소를 사용하는 Git sync입니다.
  • GitLab integration: GitLab 프로젝트를 사용하는 Git sync입니다.

플랜, 크레딧, 결제

  • Credits (크레딧): Lovable이 워크스페이스 전반의 크레딧 기반 사용량을 측정하고 지불하는 데 쓰는 단위입니다. 앱을 빌드하고, 앱을 호스팅하고 기본 제공 백엔드(Cloud)를 실행하고, 배포된 앱의 AI 기능을 구동하는 데 사용할 수 있습니다.
  • Credit top-up (크레딧 충전): 월 구독과 별개로 Pro 및 Business 플랜에서 사용할 수 있는 추가 크레딧 구매입니다. 일회성 충전으로 수동 구매하거나 자동 충전으로 자동 구매할 수 있습니다.
  • Daily build credits (일일 빌드 크레딧): Build 사용에만 쓰도록 Free, Pro, Business 플랜에 매일 부여되는 크레딧입니다. Free, Pro, Business 플랜은 매일 00:00 UTC에 초기화되고 이월되지 않는 5개의 일일 빌드 크레딧을 포함합니다. Free 일일 빌드 크레딧은 달력 기준 월당 30개로 제한됩니다. Pro 및 Business 일일 빌드 크레딧에는 월간 상한이 없습니다.
  • Usage-specific grants (용도별 지급 크레딧): 일일 빌드 크레딧, 월간 Cloud 지급분, 월간 AI 지급분처럼 한 가지 용도에만 적용되는 포함 크레딧입니다. 용도별 지급 크레딧은 일반 크레딧보다 먼저 사용되며 이월되지 않습니다. 일일 빌드 크레딧은 매일 00:00 UTC에 초기화됩니다. Free 플랜에서는 월간 Cloud·AI 지급분이 매월 1일 00:00 UTC에 초기화됩니다. Pro 및 Business 플랜에서는 월간 Cloud·AI 지급분이 구독 결제 주기에 맞춰 갱신됩니다.
  • General credits (일반 크레딧): 용도별 지급 크레딧이 소진된 뒤 앱을 빌드하고, 앱을 호스팅하고 기본 제공 백엔드(Cloud)를 실행하고, 배포된 앱의 AI 기능을 구동하는 데 사용할 수 있는 크레딧입니다. 일반 크레딧에는 월간 플랜 크레딧, 충전 크레딧, 보너스 크레딧이 포함됩니다.
  • Rollover credits (이월 크레딧): 이전 결제 기간에서 이월된 사용하지 않은 월간 플랜 크레딧으로, Credit balance 내역에 별도의 크레딧 유형으로 표시됩니다. 이월 크레딧은 원래 만료일을 유지합니다. 월간 플랜은 발급 후 2개월, 연간 플랜은 연간 결제 기간이 끝난 뒤 1개월입니다.

자세한 내용은 Credits and usage를 참고하세요.

일반 개발 개념

이 용어들은 Lovable에 국한되지 않습니다. 웹, 디자인, 백엔드 개발 전반에 걸쳐 등장하며, 문서에서 이러한 용어를 볼 때 참고할 수 있도록 여기에 포함했습니다.

프론트엔드와 UI

  • Frontend: 사용자가 브라우저에서 보고 상호 작용하는 앱의 부분입니다.
  • React: Lovable이 사용자 인터페이스를 구축하는 데 사용하는 JavaScript 라이브러리입니다.
  • Tailwind CSS: Lovable 프로젝트를 스타일링하는 데 사용되는 유틸리티 우선 CSS 프레임워크입니다.
  • Component (컴포넌트): 페이지를 구성하기 위해 조합되는 재사용 가능한 UI 조각(버튼, 카드, 폼, 내비게이션 바)입니다.
  • Responsive design (반응형 디자인): 모바일, 태블릿, 데스크톱 등 다양한 화면 크기에 맞춰 적응하는 레이아웃입니다.
  • Hero section (히어로 섹션): 랜딩 페이지 상단의 눈에 띄는 영역으로, 일반적으로 헤드라인, 부제목, 콜투액션을 담습니다.
  • CTA (Call to action): "Sign up", "Get started", "Buy now"와 같이 사용자가 어떤 행동을 하도록 유도하는 버튼이나 링크입니다.
  • Modal / Dialog: 주의나 입력을 끌기 위해 메인 흐름을 중단시키는 오버레이 창입니다.
  • Toast: 일시적으로 나타나는 짧고 방해가 되지 않는 알림입니다.
  • Tooltip: 마우스를 올리거나 포커스할 때 추가 정보를 제공하기 위해 나타나는 작은 팝업입니다.
  • Skeleton loader: 실제 콘텐츠가 로딩되는 동안 최종 레이아웃을 모방하는 플레이스홀더 UI입니다.
  • Above the fold: 스크롤 없이 보이는 페이지의 부분입니다.
  • Breadcrumb: 사이트 계층 내에서 사용자의 위치를 보여주는 내비게이션 요소입니다.
  • Favicon: 브라우저 탭과 북마크에 표시되는 작은 아이콘입니다.

디자인 언어와 스타일

특정 미학으로 Lovable을 유도하려면 프롬프트에서 이러한 용어를 사용하세요.

  • Glassmorphism: 블러와 미묘한 테두리가 있는 반투명한 서리 유리 같은 요소입니다.
  • Neobrutalism: 다듬어지지 않은 가장자리와 두툼한 타이포그래피를 가진, 대담하고 가공되지 않은 고대비 디자인입니다.
  • Minimal: 깔끔한 레이아웃, 풍부한 여백, 절제된 색상과 타이포그래피입니다.
  • Premium: 세련되고 정교하며 디테일에 신경 쓴 미학입니다.
  • Retro: 네온, 픽셀, 빈티지처럼 과거 수십 년에서 차용한 시각 스타일입니다.

백엔드, 데이터베이스, API

  • Backend: 데이터가 저장되고 규칙이 적용되며 사용자가 로그인하는 앱의 보이지 않는 부분입니다. 프론트엔드는 사용자가 보는 부분이고 백엔드는 앱을 작동하게 합니다.
  • Database: 사용자, 제품 또는 메시지 같은 레코드를 앱이 읽고 업데이트할 수 있도록 구조화해 저장하는 공간입니다. Lovable 앱은 관계형(테이블 기반) 데이터베이스를 사용합니다.
  • API (Application Programming Interface): 두 소프트웨어 시스템이 데이터를 교환하게 하는 규약입니다. API는 한 시스템이 다른 시스템에 어떤 요청을 할 수 있고 어떤 응답을 기대할 수 있는지를 정의합니다.
  • REST API: 가장 일반적인 API 스타일입니다. 예측 가능한 URL에 표준 웹 요청(읽기는 GET, 생성은 POST, 업데이트는 PUT, 삭제는 DELETE)을 사용합니다.
  • Endpoint: 앱이 한 종류의 데이터를 보내거나 받는 API 상의 특정 URL입니다. 예를 들어 고객 레코드는 /customers를 사용합니다.
  • Webhook: Stripe가 결제 성공을 앱에 알리는 경우처럼, 외부 서비스에서 어떤 일이 일어났을 때 그 서비스가 앱에 보내는 알림입니다.
  • CRUD (Create, Read, Update, Delete): 앱이 데이터로 하는 네 가지 기본 작업입니다. 연락처 관리 앱이 바로 CRUD의 사례로, 연락처를 추가하고, 보고, 편집하고, 삭제합니다.
  • SQL (Structured Query Language): 관계형 데이터베이스를 다루는 언어입니다. Lovable이 SQL을 작성하며 SQL editor에서 직접 쿼리를 실행할 수도 있습니다.
  • PostgreSQL: 기본 제공 백엔드(Cloud)와 Supabase를 구동하며 앱 데이터가 저장되는 오픈 소스 데이터베이스입니다.
  • RLS (Row-level security): 예를 들어 "사용자는 자신의 주문만 읽을 수 있다"처럼 각 사용자가 볼 수 있거나 변경할 수 있는 행을 결정하는 규칙입니다. 다중 사용자 앱에 필수입니다. RLS policies view에서 검토하세요.
  • Bucket: storage에서 파일(이미지, 동영상, 문서)을 담는 폴더 형태의 컨테이너입니다.

인증과 보안

  • OAuth: 사용자가 비밀번호를 공유하지 않고 타사 계정(Google, GitHub 등)으로 앱에 로그인할 수 있게 하는 프로토콜입니다.
  • SAML 2.0: 신원 공급자와 서비스 공급자 간의 엔터프라이즈 싱글 사인온을 위한 XML 기반 표준입니다.
  • OIDC (OpenID Connect): OAuth 2.0 위에 얹는 현대적 인증 계층으로, SSO에 흔히 사용됩니다.
  • IdP (Identity provider): Okta, Microsoft Entra ID, Google Workspace, Auth0, JumpCloud, OneLogin과 같이 사용자를 인증하는 서비스입니다.
  • 2FA (Two-factor authentication): 비밀번호에 더해 두 번째 확인 단계를 거치는 인증입니다.
  • CORS (Cross-Origin Resource Sharing): 어떤 출처가 API를 호출할 수 있는지 제어하는 브라우저 보안 정책입니다.

SEO와 검색 노출

  • SEO (Search Engine Optimization): Google이나 Bing 같은 전통적 검색 엔진에서 사이트가 상위에 노출되도록 최적화하는 것입니다.
  • AEO (Answer Engine Optimization): ChatGPT, Perplexity, Claude, Gemini 같은 AI 검색 엔진이 사이트를 답변으로 노출하도록 최적화하는 것입니다.
  • Meta title / Meta description: 검색 결과에 표시되는 페이지 제목과 짧은 요약입니다.
  • Canonical URL: 중복 콘텐츠 문제를 피하기 위해 사용되는, 페이지의 선호 URL입니다.
  • Sitemap: 검색 엔진이 사이트의 페이지를 크롤링하도록 돕기 위해 페이지 목록을 나열한 XML 파일입니다.
  • robots.txt: 크롤러에게 어떤 경로에 접근할 수 있고 없는지 알려주는 파일입니다.
  • llms.txt: AI 시스템을 위해 사이트 콘텐츠를 요약하는 선택적이고 실험적인 관례입니다. Lovable은 이 파일을 요구하지 않으며 SEO & AI search 리뷰의 발견 사항에도 포함하지 않습니다.
  • Open Graph: 페이지가 소셜 플랫폼에서 공유될 때 미리보기 방식을 제어하는 메타 태그입니다.
  • Lighthouse: 성능, 접근성, SEO, 모범 사례를 위한 Google의 오픈 소스 감사 도구입니다.

디자인 및 에셋 리소스

Lovable과 함께 흔히 사용되는 외부 도구 및 라이브러리입니다.

  • 21st.dev: Tailwind CSS와 Radix UI로 구동되는 오픈 소스 React UI 컴포넌트입니다.
  • Google Fonts: 무료 웹 최적화 폰트 라이브러리입니다.
  • SVG Repo: 오픈 라이선스 SVG 아이콘과 그래픽입니다.
  • Dribbble: 시각적 영감을 위한 디자이너 커뮤니티입니다.
  • Noun Project: 무료 아이콘과 스톡 이미지 라이브러리입니다.
  • Typewolf: 큐레이션된 폰트 조합과 타이포그래피 영감입니다.

관련 주제

On this page