코딩 기술 없이도 단 30분 만에 아름다운 모바일 앱을 만드는 방법

https://youtu.be/XwHIAau4BPc?si=8T3VytK2LpHvSAhm

The EASIEST Way to Build a Mobile App With ZERO Coding Skills

이 과정에서 사용되는 핵심 플랫폼은 **Ror**입니다 [1]. Ror는 **기본 모바일 앱 구축에 특화된 AI 코딩 플랫폼**으로, Apple 또는 Android 스토어에서 찾고 다운로드하는 앱들을 의미합니다 [1]. 기존에는 이러한 종류의 앱을 구축하는 것이 코딩 지식이 없는 최종 사용자들에게는 매우 어려웠지만, AI 코딩을 사용하면 단순히 프롬프트를 입력하여 앱을 구축할 수 있습니다 [1].

앱을 구축하는 동안 앱을 시각화하려면 **Expo Go**라는 두 번째 앱을 다운로드해야 합니다 [1]. Ror에 로그인하면 QR 코드를 제공하며, 이를 스캔하여 Expo Go 앱에서 실시간으로 앱을 볼 수 있습니다 [1, 2]. 또한, Ror는 **iOS 앱을 출시**하여 사용자들이 iOS 앱 내에서 음성 명령을 사용하여 앱을 구축할 수 있도록 합니다. 예를 들어, "음성을 사용하여 이벤트를 추가할 수 있는 캘린더 앱을 만들어 줘"라고 말하는 식입니다 [1].

발표자는 이번에는 새로운 아이디어를 내는 대신, **Duolingo의 클론 앱**을 만들기로 결정했습니다 [1]. 이 클론 앱의 이름은 **Quadrilingo**이며, 영어, 프랑스어, 스페인어, 브라질 포르투갈어만을 가르치도록 설계되었습니다 [1, 2]. 발표자는 자신이 4개 국어(영어, 프랑스어, 스페인어, 포르투갈어)에 능통하기 때문에, 이 앱을 통해 AI와 대결할 계획이라고 언급합니다 [1].

앱 구축 과정의 첫 단계는 **ChatGPT와 같은 LLM(대규모 언어 모델)을 사용하여 초기 프롬프트를 생성**하는 것입니다 [2]. 클론 앱을 만들 때는 세부 사항에 대해 아주 구체적일 필요가 없으므로, 일반적으로 사용되는 제품 요구 사항 문서(PRD) 대신, 간단한 프롬프트인 "Duolingo의 간소화된 클론인 Quadrilingo를 만들어 줘. 영어, 프랑스어, 스페인, 브라질 포르투갈어만 가르쳐야 해"를 입력합니다 [2].

Ror의 장점 중 하나는 앱이 구축되는 동안 **모바일 폰 화면 중앙에 앱의 첫 버전이 실시간으로 표시**된다는 점입니다 [2]. 앱 구축이 몇 초 만에 완료되면 QR 코드를 스캔하여 iOS 또는 Android 스토어에 출시하기 전에 실제 라이브 버전을 휴대폰에서 확인할 수 있습니다 [2].

Ror 인터페이스에서는 **작성된 코드를 확인**할 수 있으며, 모든 앱 폴더가 생성되고 구축되는 과정을 볼 수 있습니다 [2]. 또한, **통합(integrations)** 기능이 제공되는데, 첫 번째는 온라인 코드 저장 폴더인 **GitHub에 연결**하는 것이고, 두 번째는 앱 내의 데이터와 정보를 저장하고 API를 연결하여 더 복잡한 기능을 생성하며 인증 및 저장소를 제공하는 **백엔드에 연결**하는 것입니다 [2]. 인터페이스 상단에서는 새 채팅으로 복제하거나 코드를 바로 다운로드할 수 있는 기능도 있으며, **게시(publish) 버튼**도 있습니다 [2].

초기 버전의 Quadrilingo 앱을 미리 본 결과, 앱은 메인 페이지에서 다양한 언어 선택, 레슨, 리더보드, 그리고 프로필 기능을 제공했습니다 [2, 3]. 그러나 첫 번째 퀴즈를 테스트하는 과정에서 AI의 번역이 정확하지 않거나, "봉주르(bonjour)"의 의미를 잘못 해석하는 등의 문제가 발견되었습니다 [3]. 또한, 레슨을 완료할 때 **포인트가 올바르게 계산되지 않는 문제**도 있었습니다 [3]. 발표자는 이러한 문제를 라이브 앱을 통해 테스트하면서 Ror 빌더에 피드백을 주어 수정하도록 했습니다. 예를 들어, 퀴즈 완료 시 진행 상황을 계산하고 다음 단계로 넘어가도록 요청했고, 포인트 계산 오류를 수정하도록 요청했습니다. 그 결과, 포인트가 80점으로 정확하게 적립되는 것을 확인했습니다 [3].

다음 단계는 **백엔드 설정**이었습니다 [3]. 발표자는 "데이터베이스와 인증에 대해 해야 할 일들을 알고 싶다. 정확히 무엇을 해야 할지 알려줘"라고 질문했고, Ror는 백엔드 설정에 대한 전체 계획을 제시했습니다 [3]. **프론트엔드**는 앱의 모습과 느낌, 클릭하는 모든 버튼, 디자인 등 사용자가 직접 상호작용하는 부분을 의미하며, **백엔드**는 데이터베이스, 로그인/로그아웃, API와 같은 더 깊은 기능을 처리합니다 [4]. 백엔드가 없으면 프론트엔드는 단순히 클릭 가능한 프로토타타입에 불과하며, 프론트엔드가 없으면 백엔드는 사용자가 사용할 수 없는 기능들의 집합일 뿐입니다 [4]. Ror에서는 통합 메뉴에서 백엔드 활성화 버튼을 클릭하면 Ror가 자동으로 필요한 작업을 수행합니다 [3, 4].

백엔드를 연결한 후에는 **인증(authentication)**을 추가해야 합니다 [4]. 발표자는 "이 앱에 인증을 추가해 줄 수 있니?"라고 메시지를 보냈고, Ror는 즉시 인증 기능을 추가했습니다. Expo Go 앱을 통해 실시간 앱에서 로그인/가입 화면이 생성된 것을 확인할 수 있었습니다 [4]. 다음으로 **데이터베이스에 연결하여 백엔드에 데이터를 추가하고 동기화**하는 과정을 거쳤습니다 [4].

이 모든 과정이 완료되면 앱을 **게시(publish)**할 준비가 됩니다 [4]. Ror 인터페이스의 오른쪽 상단에서 "게시" 버튼을 클릭하면, 웹 링크로 게시될 뿐만 아니라 iOS 및 Android 스토어에도 게시되기 시작합니다 [4]. 앱 스토어에 게시하기 위한 추가 단계가 있는데, 여기에는 앱 스토어의 승인 절차를 거쳐야 하며, 개발자 계정을 유지하기 위해 연간 약 99달러의 비용이 든다는 점이 포함됩니다 [4]. 발표자는 공식 스토어에 제출하기 전에 **웹 링크를 통해 앱을 공개적으로 게시하고 초기 테스터들이 앱을 테스트하며 실제 사용자 피드백을 받아 앱을 개선**하는 것을 강력히 추천합니다 [5].

마지막으로, 발표자는 **인간과 AI 간의 궁극적인 결투**를 벌였습니다 [5]. Quadrilingo 앱을 사용하여 스페인어, 프랑스어, 포르투갈어 퀴즈를 풀었으며, 각 라운드에서 80점을 획득하여 **인간이 승리**했습니다 [5]. 발표자는 테스트 문제가 너무 쉽다고 언급하며, 더 복잡한 난이도의 질문에 대한 아쉬움을 표현하기도 했습니다 [5].

영상은 시청자들에게 고객을 확보하는 방법에 대한 다른 비디오를 확인하고, 채널을 구독하며 새 비디오 출시 알림을 켜달라는 요청으로 마무리됩니다 [5].