첫 번째 프롬프트부터 공유할 수 있는 라이브 버전까지, 첫 번째 Atoms 앱을 빌드하고 게시하세요.

시작하기 전에 모든 에이전트, 모드 또는 기술 용어를 배울 필요는 없습니다. 기본 워크플로는 훨씬 더 간단합니다. Atoms에 원하는 것을 말하고, 무엇이 만들어졌는지 확인하고, 변경하고, 테스트한 다음, 준비되면 게시하면 됩니다.

이 가이드는 간단한 카페 웹사이트를 예시로 사용하지만, 같은 반복 과정은 랜딩 페이지, 대시보드, 내부 도구 또는 여러분의 앱 아이디어에도 동일하게 적용됩니다.

이 단계는 로그인된 데스크톱 웹 프로젝트를 기준으로 설명합니다. 모바일 프로젝트는 별도의 모바일 빌드 및 배포 흐름을 사용합니다.

게시하기 전에 현재 빌드가 완료될 때까지 기다리고, 게시 권한이 있는지 확인하고, 프로젝트가 유휴 상태인지 확인하고, 크레딧이나 스토리지 같은 필수 프로젝트 리소스를 사용할 수 있는지 점검하세요. Publish를 사용할 수 없다면 다시 시도하기 전에 프로젝트 버전, 권한 및 리소스 조건을 확인하세요. 데이터, 시크릿, 이메일, AI, 결제 또는 기타 연결된 서비스를 사용하는 프로젝트는 공유 전에 프로덕션 점검도 필요합니다.

원하는 내용을 설명하세요

프롬프트 상자에서 시작해 일반적인 언어로 원하는 결과를 설명하세요. 기술 사양을 작성하거나 Atoms에 어떻게 코딩해야 하는지 알려줄 필요는 없습니다.

유용한 첫 번째 프롬프트에는 보통 무엇을 만들고 있는지, 주요 섹션이나 기능, 시각적 방향, 그리고 모바일에서 중요한 사항이 포함됩니다.

이미 App 월드에서 원하는 것과 비슷한 것을 찾았다면, 처음부터 시작하는 대신 해당 프로젝트를 리믹스해서 시작할 수도 있습니다.

첫 결과를 확인하세요

Atoms가 프로젝트를 만들고 첫 번째 버전을 빌드합니다. 준비가 되면 App 뷰어를 열고 더 많은 변경을 요청하기 전에 결과를 살펴보세요.

먼저 빠르게 한 번 검토하세요. 아직 모든 작은 문제를 다 찾으려는 것은 아닙니다. Atoms가 핵심 아이디어를 이해했는지 확인하세요.

• 주요 섹션과 기능이 들어가 있나요?
• 전체 레이아웃이 요청한 내용과 일치하나요?
• 중요한 버튼, 링크, 필터 또는 기타 상호작용이 반응하나요?
• 의도한 것과 비교해 명백히 빠졌거나, 깨졌거나, 다른 부분이 있나요?

앱은 PC와 모바일 모드 모두에서 미리 볼 수 있으므로, 다음 단계로 넘어가기 전에 두 가지 이상의 화면 크기에서 경험을 확인하세요.

변경하세요

첫 번째 버전을 출발점으로 생각하세요. 에이전트에게 변경하고 싶은 내용을 쉬운 말로 전달한 다음, 결과를 다시 확인하세요.

모든 것을 한 번에 바꾸는 것보다 작고 구체적인 요청이 보통 검토하기 더 쉽습니다.

시각적 변경의 경우 App 뷰어에서 요소를 직접 편집하거나 에이전트에게 변경 내용을 설명할 수 있습니다. Atoms가 따르길 원하는 스크린샷, 디자인, 파일 또는 기타 참고 자료가 있다면 업로드하고 에이전트에게 그것을 가리키세요.

문제가 발생했을 때: 단순히 선호와 다른 것이 아니라 실제로 무언가가 깨졌다면 Fix Bug를 사용하거나 무엇이 잘못되었는지와 어디에서 발생하는지 에이전트에게 정확히 알려주세요.

그래도 실패한다면: 한 번 집중해서 다시 시도한 뒤에도 같은 요청을 반복하지 마세요. 영향을 받은 단계, 기대한 내용, 실제로 발생한 내용, 이미 시도한 것, 그리고 공유 가능한 프로젝트 링크 또는 스크린샷을 기록하세요. 계정, 결제 또는 Atoms 플랫폼 문제를 겪는 유료 사용자라면 Atoms Help Center를 열고, Explore resources 아래에서 Atoms Support를 선택한 다음, Contact us를 선택하세요. 무료 플랜 사용자이거나 일반적인 제품 안내 및 문제 해결이 필요한 경우에는 Help Center, Ask Assistant 또는 Atoms 커뮤니티부터 시작하세요.

게시 전에 테스트하세요

앱을 누구에게 보내기 전에 몇 분 정도 실제 방문자처럼 사용해 보세요. 지금 빠르게 테스트하는 것이 공유한 뒤 깨진 링크를 설명하는 것보다 훨씬 쉽습니다.

• 중요한 모든 버튼과 링크를 클릭하세요.
• 필터, 양식, 메뉴 또는 내비게이션 같은 상호작용 요소를 사용해 보세요.
• PC와 모바일 보기 모두를 확인하세요.
• 잘리거나, 겹치거나, 빠졌거나, 읽기 어려운 텍스트가 있는지 살펴보세요.
• 주요 사용자 여정이 처음부터 끝까지 작동하는지 확인하세요.

앱이 저장된 데이터나 백엔드 작업에 의존한다면 그것들도 테스트하세요. Atoms는 Atoms 클라우드를 사용하거나 Supabase 연동을 통해 데이터 저장, 시크릿, 이메일, AI 호출 및 결제 같은 기능을 지원할 수 있습니다.

게시하기 전에 방문자가 볼 수 있는 모든 곳에서 시크릿, 비밀번호, 토큰, 개인 정보 및 비공개 테스트 데이터를 제거하세요. 프로젝트를 Public으로 할지 Private으로 할지 확인하고, 의도한 계정으로 라이브 링크를 테스트하세요. 앱이 실제 결제, 이메일, 저장된 데이터 또는 연결된 서비스를 사용한다면 공유 전에 해당 프로덕션 작업도 별도로 검증하세요.

게시

미리보기가 올바르게 보이고 주요 상호작용이 작동하면 에디터 오른쪽 상단의 Publish를 클릭하세요.

게시하면 선택한 공개 범위에 따라 접근 권한이 달라지는 라이브 링크가 생성됩니다. Public은 링크로 열 수 있으며 Discover에 표시될 수 있습니다. Private는 소유자에게만 보이며 플랜에 따라 제한될 수 있습니다. 공유하기 전에 의도한 공개 범위를 선택하고, 의도한 계정으로 링크를 테스트하세요.

게시 시점은 프로젝트가 다른 사람들이 실제로 열 수 있는 무언가가 되는 순간입니다. 프로젝트에서 계속 개발하되, 게시 후에는 항상 라이브 버전을 별도로 확인하세요.

라이브 앱을 검증하세요

공유하기 전에 게시된 링크를 직접 열어 보세요. 선택한 Public 또는 Private 공개 범위가 의도한 대상에게 접근 권한을 주는지 확인하세요. 이를 테스트하려면 시크릿 창이나 의도한 계정을 사용하세요.

• 의도한 대상과 일치하는 계정 또는 접근 맥락을 사용해 새 탭이나 시크릿 창에서 링크를 여세요.
• 페이지가 로드되고 기대한 버전이 표시되는지 확인하세요.
• 가장 중요한 클릭이나 상호작용을 다시 반복해 보세요.
• 앱에서 모바일 방문자가 중요하다면 휴대폰에서도 페이지를 확인하세요.

문제를 발견하면 프로젝트로 돌아가 변경하고, 미리보기를 다시 테스트한 다음, 라이브 버전을 업데이트하세요.

변경 후 업데이트하세요

앱은 한 번 게시했다고 해서 변경이 멈추지 않습니다. 필요할 때마다 프로젝트에서 계속 다듬으세요.

첫 게시 이후에는 Publish 버튼이 Update로 바뀝니다. 새 변경 사항을 라이브 버전에 반영하려면 Update를 클릭하세요.

업데이트 후에는 게시된 링크를 한 번 더 열어 검증하세요. 그러면 다음과 같은 간단하고 반복 가능한 루프가 만들어집니다.

설명 → 확인 → 변경 → 테스트 → 게시 → 검증 → 업데이트

이것이 Atoms의 핵심 워크플로입니다. 더 복잡한 앱에는 데이터, 인증, 연동, 커스텀 도메인 또는 여러 에이전트가 추가될 수 있지만, 빌드 루프는 동일하게 유지됩니다.