안녕하세요. 칼퇴하는 예린입니다.
메모 앱을 만든다고 해볼게요. AI가 입력창과 저장 버튼을 만들어줬는데 새로고침하자 방금 쓴 메모가 사라진다면 어떨까요?
이때 AI가 “DB를 연결해야 합니다”라고 말하면 막막해집니다. 화면은 이미 만들어졌는데, 무엇을 더 연결한다는 걸까요? 바이브코딩에서 DB를 이해하는 출발점은 내가 입력한 내용이 어디에 남아야 하는가입니다.
1. 화면에 보인다고 저장된 건 아니에요
메모를 입력하면 앱은 우선 화면에 그 내용을 보여줄 수 있습니다. 이 단계에서 내용이 실행 중인 앱의 임시 기억에만 있다면, 새로고침으로 앱이 다시 시작될 때 사라질 수 있습니다.
그래서 “저장 버튼을 만들어줘”보다 “저장한 메모를 새로고침해도 다시 불러오게 해줘”라는 요청이 더 구체적입니다. AI가 만들어야 하는 결과에 기록하기와 다시 읽어오기가 모두 들어가기 때문입니다.
2. DB는 메모를 다시 찾을 수 있게 정리하는 곳이에요
DB는 데이터베이스의 줄임말입니다. 메모 앱이라면 내용, 작성 날짜, 어떤 사용자의 메모인지 같은 정보를 정리해 두고 필요할 때 찾습니다. 단순히 파일을 쌓는 것보다 데이터를 일정한 구조로 다루기 좋습니다.
DB가 꼭 멀리 있는 서버를 뜻하는 것은 아닙니다. 기기 안에 파일 형태로 둘 수도 있고, 서버에서 관리할 수도 있습니다. 바이브코딩을 시작할 때는 DB 제품 이름을 외우기보다 “내 앱에서는 어디에 저장할 계획인지”를 AI에게 설명받으면 됩니다.
3. 나 혼자 쓰는 메모와 여러 기기에서 보는 메모는 달라요
같은 브라우저에서 혼자 쓰는 작은 메모장이라면 브라우저 저장 기능으로 시작할 수 있습니다. localStorage처럼 브라우저를 껐다 켜도 내용을 남길 수 있는 기능이 있습니다. 다만 다른 기기에 자동으로 전달되지는 않고, 브라우저 데이터를 지우면 내용도 지워질 수 있습니다.
반대로 휴대폰과 노트북에서 같은 메모를 보거나, 여러 사람이 각자의 메모를 저장하려면 공통으로 접근할 저장소와 사용자 구분이 필요합니다. 서버 쪽 DB와 로그인을 함께 고려하는 이유입니다. DB를 붙였다고 기기 간 동기화와 개인정보 구분이 저절로 완성되는 것은 아닙니다.
4. 내가 정할 것은 저장 방식보다 사용 방식이에요
먼저 AI에게 알려줄 것은 세 가지입니다. 어떤 내용을 남길지, 어디에서 다시 볼지, 누가 볼 수 있어야 하는지입니다. “제목과 본문을 저장하고, 내 휴대폰과 노트북에서 보고 싶고, 다른 사람은 볼 수 없어야 해”처럼 말하면 됩니다.
그 조건에 맞는 저장소 선택과 연결 코드는 AI가 도와줄 수 있습니다. 서비스 계정이나 설정이 필요하다면 무엇을 준비해야 하는지 먼저 설명받으세요. 도구 이름만 듣고 가입하기보다, 내 앱에 그 방식이 필요한 이유를 확인하는 편이 이해하기 쉽습니다.
5. 저장이 됐는지는 이렇게 확인해요
메모 하나를 저장한 다음 새로고침해서 다시 보이는지 확인합니다. 창을 닫고 다시 열었을 때도 확인합니다. 여러 기기에서 쓰기로 했다면 다른 기기에서도 같은 계정으로 확인합니다.
로그인이 있는 앱이라면 다른 계정에는 내 메모가 보이지 않는지도 확인해야 합니다. 버튼을 눌렀을 때 “저장 완료”가 뜨는 것보다, 다시 들어왔을 때 원하는 사람에게 원하는 내용이 보이는지가 실제 결과입니다.
설명에 참고한 공식 자료
SQLite: 기기 안에서도 사용할 수 있는 데이터베이스 · MDN: 브라우저의 localStorage
다음 3편에서는 내 컴퓨터에서 보이던 앱을 다른 곳에서도 열려면 왜 서버와 배포 이야기가 나오는지 알아봅니다.