[육아 스케줄 어플] STEP 2. 기획은 아빠가, DB 구축은 AI가! 실시간 스케줄 공유의 마법

안녕하세요! 전(全)자동입니다!

 

지난 STEP 1에서는 AI의 도움을 받아 단 1분 만에 스마트폰 화면에 딱 맞는 '직관적인 스케줄러 UI(화면)'를 만들어 냈습니다. 'Next 일정'이 큼지막하게 뜨고 파스텔톤 컬러로 구분되는 화면을 보니 당장이라도 쓰고 싶어지더군요.

하지만 아직은 반쪽짜리 앱입니다.

 

맞벌이 부부의 픽업 전쟁에서 승리하려면 무엇보다 '실시간 정보 공유'가 생명입니다! 회사에 있는 아내가 갑자기 학원 시간이 바뀌었다고 일정을 수정하면, 운전대를 잡고 있는 제 스마트폰 화면에도 즉각 반영되어야 하니까요. 더 나아가 초등학교에 다니는 우리 아이들도 자기 폰으로 '오늘 다음 학원이 어디지?' 하고 실시간으로 확인할 수 있어야 진정한 의미의 가족 스케줄러가 완성됩니다.

1. 서버 개발자 없이 '무료 DB 서버'를 만드는 마법, 구글 시트와 GAS!

보통 앱을 만들 때 데이터를 저장하고 실시간으로 주고받으려면 '백엔드 서버'와 '데이터베이스(DB)'라는 복잡한 시스템이 필요합니다. 전문가의 영역이고 매달 유지 비용도 들죠. 하지만 저 같은 코딩 비전공자에게는 믿는 구석이 하나 있습니다. 제 블로그의 바이브코딩 시즌 1, 2를 섭렵하신 분들이라면 이미 눈치채셨을 그 이름, 바로 '구글 스프레드시트'와 '구글 앱스 스크립트(GAS)'입니다.

• 구글 스프레드시트: 우리 부부가 엑셀을 쓰듯 편하게 아이의 일정을 입력해 두는 '무료 데이터베이스(DB)' 역할
• 구글 앱스 스크립트(GAS): 시트에 적힌 데이터를 가족들의 스마트폰 앱 화면으로 실시간으로 쏴주는 '백엔드 서버' 역할

우리 부부의 구글 계정만 있으면 완벽한 실시간 동기화 시스템을 구축할 수 있습니다. 물론 이 구축 과정 역시 제가 직접 코딩하는 것이 아니라 전적으로 AI와의 바이브코딩(Vibe Coding)을 통해 진행했습니다.

2. 데이터베이스 구조 짜기: 기획자의 몫

코딩은 AI가 다 해주지만, '어떤 데이터를 어떻게 정리할 것인가' 하는 설계(기획)는 철저히 아빠의 몫입니다. 저는 구글 드라이브에 '육아 스케줄 DB'라는 스프레드시트를 만들고, 아래와 같이 체계적으로 열을 나누어 스케줄 데이터를 정리했습니다.

• academyId: 학원 고유 번호
• date: 날짜 (예: 2026-10-07)
• day: 요일 구분
• start / end: 시작 시간 및 종료 시간
• title: 학원 이름 (예: 피아노, 영어학원 등)
• color / type: 화면에 표시될 파스텔 컬러 태그

이렇게 기틀을 잡아두고 아내와 공유 설정을 마쳤습니다. 이제 이 시트는 우리 가족 어플의 든든한 '심장'이 될 것입니다.

3. AI에게 "구글 시트랑 화면을 연결해 줘!" 명령하기 (프롬프트 엔지니어링)

데이터 세팅이 끝났으니, 이제 챗GPT와 제미나이를 켜고 이 구글 시트를 앱과 연결하는 GAS 코드를 짜달라고 부탁할 차례입니다. 이번에도 저는 복잡한 코딩 용어 대신 아주 구체적이고 명확한 요구사항(프롬프트)을 던졌습니다.

💡 전(全)자동의 바이브코딩 프롬프트

"너는 천재 구글 앱스 스크립트(GAS) 개발자야. 내가 만든 '육아 데일리 스케줄러' 앱에 구글 스프레드시트를 데이터베이스로 연결하려고 해.

[데이터베이스 구조]
내 구글 시트는 academyId, date, day, start, end, title, color, type 열(Column)로 구성되어 있어.

[핵심 요구사항]
1. 이 구글 시트의 데이터를 읽어와서 앱에서 쓸 수 있는 JSON 형태로 반환해 주는 GAS(구글 앱스 스크립트) 코드를 작성해 줘.
2. 오늘 날짜를 스스로 파악해서, 오늘에 해당하는 스케줄 데이터만 쏙 뽑아서 보내주도록 로직을 짜 줘.
3. 코딩을 모르는 기획자도 그대로 따라 할 수 있도록, 이 코드를 구글 시트에 붙여넣고 '웹 앱 URL'로 배포해서 가져오는 과정까지 1, 2, 3단계로 아주 친절하게 설명해 줘."

4. 아빠와 AI의 합작, '온 가족 실시간 스케줄러'의 탄생!

AI는 프롬프트를 입력하자마자 완벽한 GAS 코드를 뱉어냈습니다. 저는 그저 AI가 시키는 대로 코드를 구글 시트의 [Apps Script] 창에 복사해서 붙여넣고 배포 버튼을 눌렀을 뿐입니다. 그리고 거기서 얻은 주소(URL)를 STEP 1에서 만든 HTML 코드에 살짝 끼워 넣었더니... 놀라운 마법이 벌어졌습니다!

 

구글 시트에 빼곡하게 입력했던 데이터가 스마트폰 앱 화면에 찰떡같이 예쁘게 불러와졌습니다.

이제 우리 가족의 스마트폰은 모두 하나로 연결되었습니다.

• 회사에서 아내가 앱을 열어 학원일정을 수정하면 ➔ 제 폰과 아이들 폰의 앱 화면에도 실시간으로 일정이 업데이트됩니다!
• 아이들도 스마트폰 앱을 켜면 ➔ "Next: 영어학원 (14:00)" 하고 다음 목적지를 스스로 확인할 수 있게 된 것이죠.

복잡한 서버 개발이나 값비싼 요금제 없이, 오직 명확한 기획과 AI와의 바이브코딩만으로 '실시간 가족 스케줄 공유 시스템'이 완성되었습니다.

5. 다음 STEP 3 예고: 앱처럼 내 폰에 깔기 (PWA 도입)

STEP 2를 통해 직관적인 디자인(UI)과 온 가족 데이터 공유(DB)까지 모두 완벽하게 해결했습니다.

하지만 매번 스마트폰 인터넷 브라우저(크롬 등)를 열고 즐겨찾기를 눌러 접속하는 건 1분 1초가 급한 운전 상황이나, 아이들이 쓰기에는 조금 번거로울 수 있죠.

 

그래서 다음 STEP 3에서는 우리가 만든 이 웹 사이트를 복잡한 앱스토어 심사 과정 없이도 내 스마트폰 바탕화면에 진짜 앱 아이콘처럼 설치하고, 화면을 꽉 채워 실행할 수 있는 'PWA(Progressive Web App)' 기술을 적용해 보겠습니다.

아빠의 바이브코딩, 이제 화룡점정을 찍을 차례입니다!