뭐부터 할지 알면,
오늘 시작할 수 있어요

먼저 이것부터 정한다

처음 만드는 사람은 코딩이 어려워서 멈추지 않는다. 뭘 먼저 정할지 몰라서 멈춘다. 그 첫 번째가 내가 만들 게 웹이냐 앱이냐다. 이것만 정하면 도구도, 저장도, 배포도 따라서 정해진다.

30초 결정법. 사람들이 링크를 눌러서 쓰면 웹, 앱스토어에서 깔아서 쓰면 앱이다. 카메라·알림·오프라인이 꼭 필요하면 앱이고, 그게 아니면 대개 웹으로 시작하는 게 빠르다. 깔 필요도 없고 심사도 없으니까.

망설여지면 웹으로 간다. 웹은 오늘 만들어 오늘 링크를 보낼 수 있고, 나중에 앱으로 옮겨도 늦지 않다.

웹으로 간다면, 골라야 하는 것들

웹은 정할 게 다섯 개다. 하나씩 보면 어렵지 않다. 표에서 주황색이 처음에 고를 것이다.

왜 HTML 한 파일부터냐. 오늘의 할 일 목록, 간단한 소개 페이지, 계산기 같은 건 저장이 필요 없다(또는 브라우저 안에만 저장하면 된다). 이럴 땐 파일 하나면 끝이고, 서버나 DB 이야기를 아예 안 꺼내도 된다. 처음 성공을 제일 빨리 보는 길이다.

저장이 필요해지면. 방명록처럼 남이 남긴 글이 남아야 하면 그때 서버가 등장한다. 처음엔 무겁게 갈 필요 없다. Node 내장 기능만으로 서버를 띄우고 SQLite(파일 DB)를 쓰면 설치할 것도 거의 없다. 커져서 여럿이 동시에 쓰기 시작하면 그때 PostgreSQL로 옮기면 된다.

앱으로 간다면, 골라야 하는 것들

앱은 "무엇으로 만드나"가 가장 크다. 대부분 한 곳에서 시작한다.

왜 Expo부터냐. 자바스크립트 하나로 iPhone과 안드로이드 앱을 동시에 만들고, 복잡한 빌드를 클라우드가 대신 해준다. 메모·기록·간단한 도구 같은 첫 앱은 여기서 충분하다. 카메라를 실시간으로 다루거나, 아주 매끄러운 성능이 제품의 핵심일 때만 네이티브(Swift)를 꺼내면 된다.

웹과 크게 다른 점. 앱은 만든 걸 스토어 심사에 통과해야 남에게 닿는다. 개발자 계정(애플은 연 $99), 앱 아이콘, 권한 설명 문구, 심사 지침처럼 웹엔 없던 관문이 붙는다. 그래서 만들기보다 내보내기가 더 걸린다(그 함정은 5장에서).

진짜로 해본다

말로만 하면 안 와닿는다. 실제로 프롬프트를 치면 뭐가 나오는지 돌려서 보여준다. 아래 화면은 전부 진짜 결과물이다. 먼저 웹부터 본다. 간단한 방명록을 만든다.

웹 · 1단계 · 일단 만든다

나: 간단한 방명록 웹페이지 만들어줘. 이름이랑 한마디 남기는 칸이 있고, 아래에 남긴 글이 목록으로 보이게.

↓ 이렇게 나온다

1단계 결과. 꾸밈은 없지만 된다. 처음엔 이걸로 충분하다. 되는 걸 먼저 확인한다.

웹 · 2단계 · 예쁘게 다듬는다

나: 색을 따뜻하게 하고, 글은 카드처럼 보이게, 모바일에서도 잘 보이게 해줘.

↓ 같은 페이지가 이렇게 바뀐다

2단계 결과. 한 번에 다 시키지 않고 되게 → 예쁘게 순서로 나눈 게 요령이다.

앱 · 같은 걸 앱으로 시작하면

나: Expo로 간단한 메모 앱 만들어줘. 메모 목록이 보이고, + 버튼으로 새 메모를 추가.

↓ 첫 화면은 이런 모습

앱 첫 화면(결과 예시). 웹과 흐름은 같다. 되게 → 예쁘게 → 저장. 다만 앱은 시뮬레이터로 확인하고, 뒤에 빌드와 심사가 붙는다.

여기서 많이들 멈춘다

처음엔 누구나 같은 자리에서 막힌다. 미리 알면 안 무섭다.

기티의 한마디. 처음 판 굴이 제일 무섭습니다. 그래도 파고 나면 다음 굴은 훨씬 쉬워요.