halo-dev/upage

🔥 一款基于大模型的可视化网页构建平台，Lovable 开源替代。

UPage – AI 기반 시각적 웹페이지 빌더

무엇인가요 – UPage는 자연어로 원하는 것을 설명하기만 하면 완전 기능을 갖춘 반응형 웹페이지를 생성할 수 있는 오픈소스 플랫폼입니다. 백엔드에서 대규모 언어 모델(LLM)과 통신하여 HTML, CSS, JavaScript를 생성한 후, 실시간 드래그 앤 드롭 에디터에서 결과를 보여줍니다.

주요 기능

자연어 디자인 – "커피숍을 위한 랜딩 페이지로 헤로 이미지, 메뉴 섹션, 연락처 폼이 포함된" 과 같은 프롬프트를 작성하면 LLM이 페이지 레이아웃과 코드를 생성합니다.
시각적 WYSIWYG 에디터 – 생성된 페이지가 즉시 미리보기 패널에 표시되며, 마우스 클릭으로 레이아웃, 스타일링, 컴포넌트 배치를 조정할 수 있습니다.
다중 페이지 생성 – 하나의 프롬프트로 홈, 소개, 제품 페이지 등 전체 사이트 구조를 생성하고, 플랫폼이 페이지 간 자동으로 연결합니다.
표준 코드 내보내기 – 깔끔하고 표준 준수된 HTML, CSS, JavaScript를 내보내어 기존 프로젝트에 복사하거나 그대로 호스팅할 수 있습니다.
반응형 디자인 – 페이지는 자동으로 모바일 친화적으로 조정되어 데스크톱, 태블릿, 스마트폰 화면에 적합합니다.
플러그인 가능한 LLM 백엔드 – OpenAI, Ollama, LMStudio 등 API 호환 가능한 모든 LLM과 작동 가능합니다. 이미지 기반 프롬프트용 별도의 비전 모델도 연결할 수 있습니다.

시작 방법

Docker를 설치한 Linux 호스트를 준비합니다.
README에 표시된 단일 명령어 Docker 명령을 실행하고, LLM 제공업체, API 키, 사용할 모델 이름을 지정하는 환경 변수를 제공합니다.
컨테이너는 포트 3000에서 리슨합니다. 브라우저에서 http://localhost:3000을 열어 에디터에 접근합니다.
(선택 사항) ./data, ./logs, ./storage를 마운트하여 사용자 업로드 및 로그를 지속적으로 유지합니다.
GUI 설치 프로그램을 원하신다면, UPage는 1Panel 앱 스토어에서도 이용 가능합니다.

주요 사용 사례

코드를 작성하지 않고 마케팅 사이트, 제품 랜딩 페이지, 내부 대시보드를 빠르게 프로토타이핑할 때.
비기술 팀원이 변경 사항을 단순히 설명함으로써 웹 콘텐츠를 반복적으로 개선할 수 있도록 지원할 때.
개발자가 이후에 출력물을 더 맞춤화하기 위해 기본 코드를 생성할 때.
구조를 단일 프롬프트로 설명할 수 있는 다중 페이지 문서나 포트폴리오 사이트를 구축할 때.

문서 및 데모

실시간 데모: https://upage.ai/
빠른 시작 가이드: https://docs.upage.ai/quick-start
전체 문서: https://halo-dev.github.io/upage/

위 정보는 리포지토리의 README에서 직접 가져온 것으로, 외부 가정은 전혀 추가되지 않았습니다.

halo-dev/upage

UPage – AI 기반 시각적 웹페이지 빌더

관련