심화 · 오리엔테이션

프로젝트 기획 + 서버 배포

기초 마지막 시간에 예고했던 그 말, 기억나나요? "심화에서는 진짜 서비스를 만든다"던 그 시간이 오늘 시작됩니다. 앞으로 11주 동안 무엇을 만들지 살펴보고, 첫 프로젝트를 기획하고, 실제로 서버에 앱을 올려봅니다.

오늘의 목표

오늘 배우는 것

드디어 심화 과정 첫 수업이에요. 오늘은 앞으로 11주 동안 무엇을 만들지 지도를 그려보고, 좋은 프로젝트를 기획하는 법을 배우고, 노션에 내 포트폴리오 공간을 만듭니다. 마지막엔 작은 앱 하나를 실제로 인터넷에 올려서, 전 세계 누구나 볼 수 있게 만들어봅니다.

🗺️

GOAL 1

심화 11주 동안 무엇을 만들지 안다

📝

GOAL 2

문제→핵심기능→MVP 순서로 기획한다

🚀

GOAL 3

간단한 앱을 만들어 서버에 배포하고 키를 안전하게 관리한다

🗂️

GOAL 4

노션에 포트폴리오 기록 공간을 만든다

새 도구

노션(Notion)이란?

여러분은 지금까지 만든 앱과 배운 것들을 어디에 기록해왔나요? 오늘부터는 한 곳에 모아 쌓아갑니다. 그 공간이 노션이에요.

🗂️

Notion (노션)

글, 표, 이미지, 링크를 자유롭게 배치해 나만의 페이지를 만드는 기록 도구예요. 폴더처럼 페이지 안에 페이지를 계속 넣을 수 있어요.

왜 쓸까: 앞으로 5개 프로젝트를 만들 때마다, 그 결과물·과정·배운 점을 노션 한 곳에 쌓습니다. 11주 뒤엔 이 페이지 자체가 여러분의 포트폴리오가 돼요.

🧱 비유: 노션은 나만의 전시장

미술관에서 작품마다 작품명·설명 카드가 붙어있는 걸 본 적 있나요? 노션은 여러분이 만든 프로젝트마다 그런 카드를 붙여 전시하는 나만의 전시장이에요. 프로젝트가 하나씩 끝날 때마다 전시장에 작품을 하나씩 추가하는 셈이죠.

🧩 비유: 페이지 안의 페이지, 레고 블록처럼

노션 페이지는 레고 블록과 비슷해요. 큰 블록(포트폴리오 홈) 안에 작은 블록(프로젝트 1 기획서)을 계속 끼워 넣을 수 있어요. 오늘은 작은 블록 하나(기획서)부터 만들고, 다음 시간마다 옆에 새 블록을 붙여갑니다.

🔍 왜 구글 문서나 메모장이 아니라 노션일까

구글 문서는 글 위주라 표·이미지·링크를 한 화면에 섞어 담기 번거로워요. 노션은 문단 하나하나를 블록으로 다뤄서, 표를 넣었다가 아래에 이미지를, 그 아래에 코드 조각을 자유롭게 이어붙일 수 있어요. 11주 동안 쌓일 결과물의 형태가 텍스트·표·스크린샷·링크로 다양하기 때문에, 이런 자유로운 배치가 특히 유리해요.

노션 — 오늘 만들 페이지 구조 예시

📄 AI Python Lab 기록
 ┣ 📁 포트폴리오 홈 (보너스 미션)
 ┃    ┗ 프로젝트 5개 표
 ┗ 📁 프로젝트 1: 웹앱 (오늘 작성)
      ┣ 프로젝트 이름
      ┣ 만들게 된 이유
      ┣ 주요 기능
      ┣ 기대 효과
      ┗ 한 줄 소개

🌳 페이지 구조, 처음부터 완벽할 필요 없어요

위 구조는 하나의 예시일 뿐이에요. 오늘은 "프로젝트 1: 웹앱" 페이지 하나만 제대로 채워도 충분하고, 포트폴리오 홈처럼 상위 구조는 시간이 남는 보너스 미션에서 다룹니다. 완벽한 정리보다 일단 기록을 시작하는 것이 더 중요해요.

🔗 노션 페이지, 어떻게 선생님과 공유할까

페이지 오른쪽 위의 Share(공유) 버튼을 눌러, 선생님이 안내한 이메일 또는 링크 방식으로 공유 권한을 설정하세요. 공유가 안 되어 있으면 페이지를 만들었어도 확인이 어렵습니다.

⚠️ 노션 사용 시 자주 하는 실수

페이지를 만들고 공유 설정을 안 함 → 선생님이 확인할 수 없으니, 안내받은 대로 공유·권한을 꼭 설정하세요.
제목 없이 내용부터 씀 → 페이지 최상단에 프로젝트 이름을 먼저 적어야 나중에 찾기 쉬워요.
기록을 미루다가 몰아서 나중에 작성 → 그 순간엔 기억나던 디테일(어떤 에러였는지, 어떻게 고쳤는지)이 다음 주엔 흐려져요.
페이지 구조를 계속 새로 갈아엎음 → 처음 정한 표·칸 구성을 최대한 유지해야 나중에 비교하기 쉬워요.
이미지·스크린샷 없이 글로만 기록 → 배포 화면, 실행 결과 스크린샷을 함께 남기면 나중에 훨씬 이해하기 쉬운 기록이 됩니다.

🗂️ 힌트 — 노션 페이지를 어떻게 시작해야 할지 막막해요

완벽하게 꾸미려 하지 말고, 우선 제목 하나 + 표 하나로 시작하세요. 꾸미기는 나중에 시간이 남을 때 해도 늦지 않습니다.

템플릿을 복제하는 방법을 모르겠다면, 선생님이 공유한 링크에서 오른쪽 위 [복제] 또는 [Duplicate] 버튼을 찾아보세요.

📲 노션 앱, 폰에도 설치해두면 좋아요

노션은 컴퓨터뿐 아니라 폰 앱으로도 쓸 수 있어요. 수업이 끝난 뒤 이동 중에도 오늘 배운 점을 짧게 메모해두면, 나중에 컴퓨터에서 정리할 때 훨씬 수월합니다.

개념 ①

심화 과정 11주, 무엇을 만들까?

기초 11주 동안 여러분은 챗봇, 날씨 알리미, 웹사이트, 게임, 이미지 갤러리처럼 짧은 실습을 여러 개 만들었어요. 심화에서는 다릅니다. 주제 하나를 골라 2주씩 시간을 들여, 실제로 완성해서 배포하는 프로젝트를 5번 반복합니다.

프로젝트 1 — 웹앱 (2·3주차)

Streamlit과 Claude API를 연결해, 입력하면 AI가 처리해서 결과를 보여주는 웹앱을 만듭니다.

프로젝트 2 — 데이터 저장 (4·5주차)

앱을 껐다 켜도 기록이 남도록, 데이터를 저장하고 다시 불러오는 기능을 붙입니다.

프로젝트 3 — 공공데이터 시각화 (6주차)

공공데이터를 pandas로 분석하고 그래프로 표현합니다.

프로젝트 4 — AI 에이전트 (7·8주차)

AI가 스스로 여러 단계를 판단하고 행동하는 흐름을 만듭니다.

프로젝트 5 — API 매시업 (9·10주차)

서로 다른 외부 API 2개 이상을 Claude API와 엮어 하나의 서비스로 완성합니다.

🏁 11주차 — 발표회

마지막 주엔 다섯 프로젝트 중 가장 자신 있는 걸 골라 발표하고 서로 투표합니다.

11주 로드맵 한눈에 보기

1주차     : 오리엔테이션 (오늘)
2~3주차   : 프로젝트 1 — 웹앱
4~5주차   : 프로젝트 2 — 데이터 저장
6주차     : 프로젝트 3 — 데이터 시각화
7~8주차   : 프로젝트 4 — AI 에이전트
9~10주차  : 프로젝트 5 — API 매시업
11주차    : 발표회

프로젝트 하나씩 조금 더 들여다보기

다섯 프로젝트가 실제로 어떤 모습일지 감이 잘 안 온다면, 아래 설명을 참고하세요. 오늘은 이해만 하면 충분하고, 각 프로젝트는 해당 주차에 자세히 다룹니다.

1️⃣ 프로젝트 1 — 웹앱, 왜 가장 먼저일까

입력 하나를 받아 AI가 처리하고 결과를 보여주는, 가장 단순한 형태의 서비스예요. 오늘 미션2에서 만든 인사말 앱이 바로 이 프로젝트의 축소판입니다. 그래서 오늘의 경험이 다음 2주의 출발점이 돼요.

2️⃣ 프로젝트 2 — 데이터 저장이 필요한 이유

프로젝트 1의 앱은 새로고침하면 입력했던 내용이 사라져요. 프로젝트 2에서는 파일이나 데이터베이스에 결과를 저장해서, 앱을 껐다 켜도 기록이 남도록 만듭니다.

3️⃣ 프로젝트 3 — 공공데이터 시각화란

정부·공공기관이 무료로 공개한 데이터(인구, 날씨, 교통 등)를 pandas로 분석하고, 그래프로 그려서 한눈에 보이는 정보로 바꿉니다.

4️⃣ 프로젝트 4 — AI 에이전트란

심부름을 하나만 시키는 게 아니라, "심부름 목록"을 통째로 맡기는 느낌이에요. 지금까지의 앱이 "입력 하나 → 답 하나"였다면, 에이전트는 AI가 여러 단계를 스스로 판단해서 순서대로 행동해요. 예를 들어 뉴스를 찾고, 요약하고, 중요도를 매기는 과정을 AI가 알아서 이어갑니다.

5️⃣ 프로젝트 5 — API 매시업이란

매시업은 "섞는다"는 뜻이에요. 날씨 API와 지도 API처럼 서로 다른 외부 서비스 2개 이상을 Claude API와 엮어서, 어디에도 없던 새로운 서비스를 만듭니다.

📐 비유: 11주는 다섯 개의 짧은 등산

11주 전체를 하나의 거대한 산이라고 생각하면 부담스러워요. 대신 2주짜리 등산을 다섯 번 한다고 생각하세요. 매번 다른 산(주제)이지만, "기획→구현→배포"라는 같은 등산 코스를 반복해서 걷다 보면 코스 자체가 점점 익숙해집니다.

🔁 프로젝트마다 난이도가 쌓이는 이유

프로젝트 1은 입력→AI 처리→출력이라는 가장 단순한 흐름만 다룹니다. 프로젝트 2부터는 그 흐름 위에 저장·시각화·자동판단·외부 API 연동이 한 겹씩 더해져요. 앞 프로젝트에서 만든 습관과 코드 패턴을 다음 프로젝트에서 그대로 재사용하게 되니, 첫 단추인 오늘이 특히 중요합니다.

⚠️ 로드맵을 오해하기 쉬운 부분

"5개 프로젝트 = 5번 새로 배운다"로 오해 → 사실은 같은 흐름(기획→구현→배포)을 반복하며 점점 더 큰 걸 붙이는 구조예요.
2주 중 1주차 성과가 2주차로 이어지지 않는다고 생각 → 1주차에 기획하고 시작한 코드를 2주차에 그대로 이어받아 완성합니다.
발표회를 마지막에만 신경 쓰면 된다고 생각 → 발표에 쓸 프로젝트는 그때 정하는 게 아니라, 11주 내내 노션에 잘 정리해둔 프로젝트 중에서 고르게 됩니다.

🗺️ 힌트 — 5개 프로젝트 이름이 잘 안 외워져요

순서를 외우기보다 흐름으로 기억하세요. "만들고(1) → 저장하고(2) → 보여주고(3) → 스스로 판단하고(4) → 여러 서비스를 엮는다(5)"처럼 이야기로 이어보면 순서가 자연스럽게 기억나요.

개념 ②

운영 규칙 — 필수 미션 vs 자유 주제

각 프로젝트에는 반드시 넣어야 하는 필수 미션(기술 요건)이 있어요. 예를 들어 프로젝트 1은 "입력→처리→출력 흐름을 갖춘 웹앱을 배포한다"가 필수예요. 하지만 주제는 완전히 자유입니다.

✅

필수 미션은 고정

주제가 무엇이든 그 프로젝트가 요구하는 기술 요건은 반드시 구현합니다.

🎨

주제는 내가 정한다

선생님이 보여주는 사례를 참고해도 되고, 완전히 다른 아이디어를 내도 됩니다.

🗂️

노션에 계속 쌓는다

첫 프로젝트부터 결과물·과정·배운 점을 노션에 정리해 포트폴리오로 남깁니다.

🎯 비유: 필수 미션은 요리 대회의 '지정 재료'

요리 대회에서 "이 재료 3가지는 반드시 써야 한다"는 규칙이 있어도, 어떤 요리를 만들지는 참가자 자유죠. 필수 미션(입력→처리→출력 웹앱 배포 같은 기술 요건)은 지정 재료고, 주제(무엇을 만들지)는 여러분이 정하는 메뉴예요.

🙋 그럼 뭘 만들어야 할지 모르겠다면?

완전히 새로운 아이디어가 안 떠올라도 괜찮아요. 선생님이 보여주는 예시 프로젝트를 내 상황에 맞게 살짝 바꾸는 것도 충분히 좋은 시작입니다. 예를 들어 "시험공부 우선순위 추천"을 "운동 루틴 추천"으로 바꾸는 식이죠.

📋 프로젝트마다 필수 미션은 어떻게 다를까

프로젝트마다 다른 기술 요건이 주어져요. 매주 도입부에서 그 주의 필수 미션을 다시 안내합니다.

프로젝트별 필수 미션 예시

프로젝트 1 (웹앱)      : 입력→처리→출력 흐름 배포
프로젝트 2 (데이터 저장): 저장→재불러오기가 되는 기능
프로젝트 3 (시각화)    : pandas 분석 + 그래프 표현
프로젝트 4 (AI 에이전트): 여러 단계 자동 판단·행동
프로젝트 5 (API 매시업): 외부 API 2개 이상 연동

막막할 땐 세 가지 방향 중 하나로 시작해보세요.

내 불편함에서 시작

가장 추천하는 방법이에요. 최근 나를 불편하게 했던 순간을 떠올려보세요.

주변 사람의 불편함 관찰

가족·친구가 자주 겪는 불편함을 떠올려도 좋아요.

관심 분야에 기술 적용

평소 관심 있던 분야(운동·게임·음악 등)에 오늘 배운 기술을 적용해봅니다.

🎯 세 방향의 공통점

어느 방향으로 시작하든 결국 "문제정의" 한 문장으로 귀결됩니다. 방향을 정했다면, 그 상황을 "[누가] + [어떤 상황에서] + [무엇이 불편한가]" 문장으로 옮겨보세요.

▸ 세 방향으로 각각 시작한 예시

① 내 불편함: 아침마다 준비물을 깜빡함
② 주변 관찰: 동생이 숙제를 자꾸 미룸
③ 관심 분야: 좋아하는 축구 경기 일정 확인

⚠️ 자유 주제를 오해하기 쉬운 부분

"자유"라는 말에 필수 미션까지 생략해도 된다고 오해 → 기술 요건은 주제와 상관없이 반드시 구현해야 완성으로 인정됩니다.
완벽한 아이디어가 떠오를 때까지 기획을 미룸 → 오늘 미션1에서는 지금 떠오르는 것 중 가장 나은 것으로 일단 시작하고, 다음 주에 다듬어도 됩니다.
친구와 완전히 똑같은 주제를 그대로 베낌 → 참고는 좋지만, 문제정의 문장 하나만이라도 내 상황에 맞게 바꿔보세요.

🎨 힌트 — 필수 미션과 자유 주제가 계속 헷갈려요

이렇게 구분해보세요. "어떻게(How) 만들지"에 대한 규칙은 필수 미션이고, "무엇을(What) 만들지"는 자유 주제예요. "입력→처리→출력 흐름"은 어떻게 만들지에 대한 규칙(고정), "인사말 앱이냐 공부 도우미냐"는 무엇을 만들지(자유)입니다.

개념 ③

좋은 프로젝트 기획법

기초 8주차 게임 기획 4단계, 11주차 3줄 기획서 기억하나요? 오늘은 그걸 프로젝트 규모에 맞게 좀 더 체계적으로 확장합니다. 순서는 똑같아요 — 문제부터 정의하고, 기능을 추리고, 가장 작은 완성형을 정합니다.

문제 정의

"누가, 어떤 상황에서, 무엇이 불편한가?"를 한 문장으로 씁니다. 문제가 명확해야 기능도 명확해져요.

핵심 기능 3가지

그 문제를 풀기 위해 정말 필요한 기능 3개만 고릅니다. 떠오르는 기능이 10개여도, 3개로 추리는 연습이 기획입니다.

MVP 정의

3개 기능 중에서도 가장 먼저 완성해야 할 최소 버전이 무엇인지 정합니다. 나머지는 시간이 남으면 추가해요.

📌 MVP, 이미 해봤어요

기초 11주차에서 "가장 작은 완성형부터 만든다"는 원칙을 이미 배웠어요. 오늘은 그 원칙에 이름(MVP: Minimum Viable Product, 최소 기능 제품)을 붙이고, 문제정의·핵심기능 단계를 앞에 추가해 체계를 더하는 것뿐입니다.

🌱

MVP (Minimum Viable Product)

"최소 기능 제품"이라는 뜻으로, 핵심기능 중에서도 가장 작게 잘라낸 첫 완성 버전을 가리키는 말이에요. 화려하지 않아도 하나의 흐름(입력→처리→출력)이 끝까지 동작하면 MVP로 인정돼요.

왜 쓸까: 2주라는 짧은 시간에 큰 목표를 세우면 중간에 지치기 쉬워요. MVP를 먼저 정해두면 "일단 이것부터 완성"이라는 작고 확실한 목표가 생겨서, 완성 경험을 빠르게 얻고 그 위에 기능을 하나씩 더할 수 있어요.

🏗️ 비유: 기획은 집을 짓기 전 설계도

설계도 없이 벽돌부터 쌓으면 중간에 방 크기를 바꾸고 싶을 때 다시 허물어야 해요. 문제정의·핵심기능·MVP는 집을 짓기 전 설계도예요. 종이 위에서 방향을 먼저 정해두면, 코드를 짤 때는 설계도대로 벽돌만 쌓으면 됩니다.

✂️ 왜 핵심기능을 3개로 제한할까

기능이 많을수록 좋은 서비스처럼 느껴지지만, 2주 안에 완성해야 하는 우리에게는 선택과 집중이 더 중요해요. 10개 기능을 반쯤 만든 앱보다, 3개 기능이 확실히 작동하는 앱이 더 좋은 결과물입니다. 실제 스타트업들도 처음엔 기능 하나로 시작해서 반응을 보고 늘려갑니다.

💡 기획서를 먼저 쓰는 이유

코드부터 짜면 만들다가 방향이 자꾸 바뀝니다. 문제와 기능을 먼저 글로 정리해두면, 막혔을 때 "원래 뭘 만들려고 했지?"로 돌아올 기준이 생겨요.

문제정의를 좁히는 연습을 해봅니다.

▸ 나쁜 예 — 너무 넓음

사람들은 시간 관리를 잘 못한다.

→ 누가, 언제, 무엇이 문제인지 알 수 없어
  기능을 정하기 어렵습니다.

▸ 좋은 예 — 누가·언제·무엇이 명확함

중간고사 기간의 중3 학생은, 과목이
5개 이상 겹칠 때 어떤 순서로 공부할지
정하지 못해 시간을 허비한다.

→ 누가(중3 학생), 언제(중간고사 기간),
  무엇이(공부 순서) 명확합니다.

🎬 MVP를 정하는 또 다른 기준 — "5분 시연"

MVP가 애매하다면 "이걸로 5분 안에 시연할 수 있는가?"를 기준으로 삼아보세요. 화면 하나, 입력 하나, 결과 하나로 5분 안에 보여줄 수 있다면 그게 딱 맞는 MVP 크기입니다.

▸ 5분 시연 대본 예시

1. "이 앱은 오늘 준비물을 알려줘요." (10초)
2. 시간표를 입력한다. (30초)
3. 버튼을 누른다. (5초)
4. AI가 준비물 목록을 보여준다. (10초)
5. "이렇게 매일 아침이 편해져요!" (15초)

🧮 문제정의·핵심기능·MVP, 크기 비교

세 단계는 점점 작아지는 원처럼 생각하면 쉬워요. 문제정의는 가장 큰 원(상황 전체), 핵심기능은 그 안의 중간 원(3가지로 추린 해결책), MVP는 가장 작은 원(오늘 당장 만들 수 있는 조각)입니다.

📝 힌트 — 핵심기능 3개가 자꾸 겹쳐 보여요

세 기능이 비슷해 보인다면, "입력을 받는 기능 / AI가 처리하는 기능 / 결과를 보여주는 기능"처럼 흐름 순서대로 나눠보세요. 프로젝트 1의 필수 미션인 "입력→처리→출력" 구조와도 자연스럽게 맞아떨어집니다.

⚠️ 기획 단계에서 자주 하는 실수

문제정의를 너무 광범위하게 씀(예: "학생들이 공부를 힘들어한다") → "누가, 어떤 상황에서"까지 구체적으로 좁혀야 기능도 명확해져요.
핵심기능을 "~할 수 있다" 없이 명사로만 나열 → "AI 추천"보다 "입력한 과목을 AI가 우선순위로 정렬해준다"처럼 동작으로 적어야 나중에 코드로 옮기기 쉬워요.
MVP를 정해놓고 핵심기능 3개를 전부 다 넣어버림 → MVP는 3개 중에서도 가장 작은 조각 하나여도 충분해요.

🔁 기획법, 다음 프로젝트에서도 계속 쓰여요

문제정의→핵심기능→MVP 순서는 오늘만 쓰고 끝나는 게 아니에요. 앞으로 5개 프로젝트를 시작할 때마다 똑같은 순서로 기획합니다. 오늘 이 흐름에 익숙해지면 다음 프로젝트 기획은 훨씬 빨라져요.

미션 1

내 프로젝트 1 기획서 쓰기

🎯 목표: 다음 2주 동안 만들 웹앱 프로젝트를, 문제정의→핵심기능→MVP 순서로 노션 기획서 템플릿에 정리한다.

정답이 정해진 미션이 아니에요. 지금부터 여러분이 다음 2주 동안 무엇을 만들지 스스로 정하는 시간입니다.

💡 아이디어가 안 떠오른다면 — 주변 둘러보기

아래 네 가지 영역에서 "요즘 뭐가 불편했지?"를 하나씩 떠올려보세요. 꼭 거창한 문제가 아니어도 됩니다. 학교생활 · 취미(운동·게임·음악) · 가족과의 대화 · 용돈 관리 중 하나만 골라 시작해도 충분해요.

아래 예시들, 미리보기

① 학교생활 — 준비물 챙기기
② 취미 — 게임 전략 추천
③ 용돈 관리 — 소비 습관 점검
④ 가족과의 대화 — 저녁 메뉴 정하기
⑤ 취미 — 오늘 기분에 맞는 음악 추천

🎓 예시 ① 학교생활 — 준비물 챙기기

문제: "매일 아침 오늘 뭘 챙겨야 하는지 헷갈려 빠뜨리고 온다." → 기능: 요일별 시간표를 입력하면 오늘 필요한 준비물을 AI가 알려준다.

🎮 예시 ② 취미 — 게임 전략 추천

문제: "좋아하는 게임에서 다음에 뭘 해야 할지 매번 검색해야 한다." → 기능: 현재 상황(레벨, 보유 아이템)을 입력하면 AI가 다음 행동을 추천한다.

💰 예시 ③ 용돈 관리 — 소비 습관 점검

문제: "이번 달 용돈을 어디에 얼마 썼는지 기억이 안 난다." → 기능: 오늘 쓴 돈을 입력하면 AI가 소비 패턴을 한 문장으로 요약해준다.

👨‍👩‍👧 예시 ④ 가족과의 대화 — 저녁 메뉴 정하기

문제: "가족이 매일 저녁 뭘 먹을지 정하는 데 시간을 허비한다." → 기능: 최근 먹은 메뉴와 냉장고 재료를 입력하면 AI가 오늘 저녁 메뉴를 추천한다.

🎵 예시 ⑤ 취미 — 오늘 기분에 맞는 음악 추천

문제: "기분에 맞는 노래를 고르느라 플레이리스트를 한참 뒤진다." → 기능: 오늘 기분과 상황을 입력하면 AI가 어울리는 곡 분위기를 추천한다.

✨ 예시들의 공통 패턴

다섯 예시 모두 "문제 한 문장 → 기능 한 문장"의 짧은 구조를 따라요. 여러분도 이 패턴 그대로, 내 상황에 맞는 문제와 기능을 하나씩만 떠올려보면 됩니다.

✏️ 먼저 스스로 해보기

내 프로젝트, 3단계로 정리해보기

① 문제정의: 나 또는 주변 누군가가 겪는 불편함을 한 문장으로 써보세요.
② 핵심기능 1개: 그 문제를 풀 수 있는 기능을 하나만 떠올려보세요. (여러 개가 떠올라도 가장 중요한 것 하나만)
③ MVP: 그 기능이 "이 정도만 되면 완성이라 부를 수 있다"는 최소 기준을 한 줄로 적어보세요.
세 가지를 다 적기 전에는 다음 내용을 보지 마세요.

① 노션 기획서 템플릿 채우기

선생님이 만든 노션 기획서 템플릿을 복제해서 시작합니다. 프로젝트 이름·만들게 된 이유·주요 기능·기대 효과·한 줄 소개, 다섯 칸을 채우면 완성이에요.

📝 노션 기획서 템플릿 열기 →

📸 스크린샷 자리

노션 기획서 템플릿 — 다섯 칸을 채우는 화면 · 📝 템플릿 열기 →

🔗 앞서 생각한 것과 연결하기

trybox에서 쓴 문제정의는 '만들게 된 이유' 칸에, 핵심기능은 '주요 기능' 칸에, MVP는 '한 줄 소개'("우리 프로젝트는 ___입니다")로 정리하면 딱 맞아떨어져요.

🎁 기대 효과 칸, 어떻게 채울까

기대 효과는 "이 앱이 있으면 무엇이 좋아지는가"를 적는 칸이에요. "재미있어서"보다는 "매일 아침 준비물을 챙기는 시간이 줄어든다"처럼, 문제정의와 짝을 이루는 구체적인 변화로 적어보세요.

▸ 다섯 칸을 모두 채운 완성 예시

프로젝트 이름: 오늘의 준비물

만들게 된 이유: 매일 아침 오늘 뭘 챙겨야
하는지 헷갈려 준비물을 빠뜨리고 온다.

주요 기능:
1. 요일별 시간표 입력
2. AI가 오늘 필요한 준비물 목록 추천
3. 챙긴 준비물 체크 표시

기대 효과: 아침마다 준비물을 다시
확인하러 뛰어가는 일이 줄어든다.

한 줄 소개: 시간표만 입력하면 오늘
챙길 준비물을 AI가 알려주는 도우미

② AI에게 기획서 다듬기 요청하기

초안을 적었다면, AI 도구에게 더 명확하게 다듬어달라고 요청해보세요.

🤖 AI에게 다듬기를 맡기는 이유

혼자 쓰면 문장이 막연해지기 쉬워요. AI에게 초안을 보여주고 "더 구체적으로 정리해줘"라고 요청하면, 빠진 부분을 스스로 발견하기 어려운 경우에도 놓친 관점을 짚어줍니다. 다만 AI가 준 결과를 그대로 쓰지 말고, 내 상황에 맞게 한 번 더 다듬으세요.

💬 프롬프트 예시

내가 만들고 싶은 웹앱 아이디어야. 문제: [내가 쓴 문제정의] 기능: [내가 떠올린 핵심기능] 이 아이디어를 문제정의 1문장, 핵심기능 3가지, MVP 1문장으로 더 명확하게 정리해줘.

▸ 정리 결과 예시

문제정의: 시험 기간에 어떤 과목부터 공부해야 할지
정하기 어려워 시간을 낭비하는 학생이 많다.

핵심기능:
1. 과목별 남은 시험일과 난이도 입력
2. AI가 우선순위 순서로 추천
3. 오늘 할 일 체크리스트 표시

MVP: 과목명과 시험일만 입력하면
AI가 공부 순서를 추천해주는 화면 1개

🔄 다른 주제라면 어떻게 달라질까

같은 프롬프트에 다른 문제를 넣으면 AI는 전혀 다른 결과를 줘요. 아이디어가 잘 안 떠오른다면, 아래처럼 완전히 다른 분야로도 시도해보고 그중 마음에 드는 방향을 고르세요.

▸ 정리 결과 예시 — 다른 주제(운동 루틴)

문제정의: 헬스장에 처음 다니는 사람은 오늘
어떤 운동을 몇 세트 해야 할지 몰라 시간을 허비한다.

핵심기능:
1. 운동 목표(다이어트/근력) 선택
2. AI가 오늘의 운동 루틴 3가지 추천
3. 완료한 운동 체크 표시

MVP: 목표만 고르면 AI가 운동 루틴
텍스트로 1개 추천해주는 화면 1개

③ 완성된 기획서, 팀원 관점에서 다시 읽기

기획서를 다 채웠다면, 처음 보는 사람이 됐다고 생각하고 다시 읽어보세요. "이 문장만 읽고 무엇을 만들지 이해되는가?"가 기준이에요.

💬 프롬프트 예시 — 한 번 더 다듬기

방금 정리한 기획을 보고, 처음 듣는 사람도 이해할 수 있는지 점검해줘. 너무 막연한 표현이 있으면 더 구체적인 표현으로 바꿔서 다시 제안해줘.

다섯 칸을 다시 한번 짚어봅니다.

프로젝트 이름

한눈에 기억나는 짧은 이름을 적습니다.

만들게 된 이유

문제정의를 조금 더 풀어쓴 배경 설명입니다.

주요 기능

핵심기능 목록을 순서대로 나열합니다.

기대 효과

이 앱이 있으면 무엇이 좋아지는지 적습니다.

한 줄 소개

MVP를 한 문장으로 압축한 소개 문구입니다.

⚠️ 자주 하는 실수

핵심기능을 5개, 6개로 늘림 → 3개로 줄이는 게 기획의 핵심입니다.
MVP를 "완벽한 최종 버전"으로 적음 → MVP는 가장 작은 완성형이어야 해요.
노션 페이지 없이 머릿속으로만 기획 → 반드시 글로 남겨야 다음 주에 참고할 수 있어요.
기대 효과를 "재미있을 것 같다"처럼 막연하게 적음 → "누가 어떤 시간을 아끼는지"처럼 구체적으로 적어보세요.
다섯 칸을 채우고 공유 설정을 확인 안 함 → 선생님이 열람할 수 있는 상태인지 꼭 확인하세요.

💡 힌트 — 문제정의 문장이 잘 안 써져요

"[누가] + [어떤 상황에서] + [무엇이 불편한가]" 세 조각을 순서대로 채워보세요. 예: "[헬스장 초보자]가 [처음 운동하러 갔을 때] [어떤 순서로 해야 할지 몰라 헤맨다]."

그래도 막히면, 오늘 하루 나를 불편하게 했던 사소한 순간 하나를 떠올려보세요. 사소할수록 오히려 명확한 문제정의가 나옵니다.

④ 좋은 기획서와 아쉬운 기획서 비교하기

같은 아이디어라도 어떻게 적느냐에 따라 기획서의 명확도가 크게 달라져요. 아래 두 버전을 비교하면서, 내 기획서가 어느 쪽에 가까운지 점검해보세요.

▸ 아쉬운 버전 — 막연하고 넓음

프로젝트 이름: 공부 도우미
만들게 된 이유: 공부가 힘들어서
주요 기능: 공부를 도와주는 기능
한 줄 소개: 공부를 더 잘하게 해주는 앱

▸ 좋은 버전 — 구체적이고 좁음

프로젝트 이름: 오늘의 공부 순서
만들게 된 이유: 시험 기간에 어떤 과목부터
공부해야 할지 몰라 시간을 낭비하는 학생이 많음
주요 기능: 과목별 시험일·난이도를 입력하면
AI가 오늘 할 일 순서를 추천
한 줄 소개: 과목명과 시험일만 입력하면 AI가
공부 순서를 정해주는 화면 1개

🔎 두 버전의 차이, 무엇이 다를까

아쉬운 버전은 "공부", "힘들어서"처럼 누구나 공감하지만 아무도 구현할 수 없는 말이에요. 좋은 버전은 "과목별 시험일·난이도 입력", "우선순위 추천"처럼 바로 코드로 옮길 수 있는 동작이 보여요. 여러분의 기획서도 "바로 코드로 옮길 수 있는가"를 기준으로 다시 점검해보세요.

⑤ 짝과 서로의 기획서 바꿔 읽기

시간이 된다면 옆 사람과 노션 기획서를 서로 보여주고, 상대방 입장에서 "이해가 되는지" 피드백을 주고받으세요. 내가 쓸 땐 명확해 보여도 남이 읽으면 헷갈리는 부분이 꼭 있어요.

서로 피드백할 때 아래 세 가지를 체크해보세요.

상황이 그려지는가

문제정의만 읽고 어떤 상황인지 그려지는지 확인합니다.

3개를 넘지 않는가

핵심기능이 3개를 넘지 않는지 세어봅니다.

짐작할 수 있는가

한 줄 소개만 보고 무엇을 만들지 짐작할 수 있는지 봅니다.

💬 세 가지 중 하나라도 걸린다면

"아니오"가 하나라도 있다면, 그 부분을 다시 다듬을 좋은 힌트를 얻은 셈이에요. 완벽할 필요 없이, 구체적으로 무엇이 헷갈렸는지만 짚어줘도 충분합니다.

⚠️ 피드백 주고받을 때 자주 하는 실수

"괜찮은 것 같아"처럼 막연한 칭찬만 함 → 위 세 가지 체크리스트 중 구체적으로 무엇이 좋았는지, 무엇이 헷갈렸는지 짚어주세요.
상대방 아이디어를 내 취향대로 바꾸라고 강요 → 주제는 각자의 자유이니, 이해가 안 되는 표현만 짚어주는 게 좋아요.

⏱️ 시간이 부족하다면 어디까지만 해도 될까

모든 단계를 완벽히 마치지 못해도 괜찮아요. ①번(다섯 칸 채우기)까지만 끝내도 미션 1의 최소 완료 기준은 충족됩니다. ②~⑤번은 여유가 있을 때 순서대로 진행하세요.

💡 오늘 기획서, 완벽하지 않아도 괜찮은 이유

다음 주에 실제로 구현을 시작하면서 기획이 조금씩 바뀌는 건 자연스러운 일이에요. 오늘의 기획서는 "정답"이 아니라 출발점입니다. 방향을 잡는 데 의미가 있어요.

📌 미션 1을 마치며 최종 점검

노션 페이지를 닫기 전, 다섯 칸이 모두 채워졌는지와 공유 설정이 되어 있는지 두 가지만 한 번 더 확인하세요. 이 두 가지만 지켜도 미션 1은 성공입니다.

✓노션 기획서 템플릿을 복제해 다섯 칸을 채웠다✓문제정의 1문장, 핵심기능, MVP를 각각 적었다✓AI 도구로 기획서를 한 번 다듬어봤다

미션 2

간단한 앱 만들어 서버에 배포하기

🎯 목표: Streamlit으로 간단한 앱을 만들고, 실제로 인터넷에 배포해 주소를 얻는다. API 키는 Secrets로 관리한다.

6주차에 GitHub 저장소를 만들어 GitHub Pages에 정적 웹사이트를 올려봤죠? 오늘은 다른 종류의 배포를 배웁니다. 그때는 HTML 파일을 그대로 올렸다면, 오늘은 파이썬으로 만든 앱을 올립니다.

🧩 미션 2가 미션 1과 이어지는 지점

미션 1에서 기획한 문제정의·핵심기능은 다음 2주짜리 프로젝트 1에서 본격적으로 구현해요. 오늘 미션 2는 그 흐름의 아주 작은 예고편이에요 — 입력을 받아 AI가 처리하고 결과를 보여주는 최소한의 앱을 직접 만들고 배포까지 경험해봅니다.

🧱 오늘 만들 앱의 구조 미리보기

인사말 앱은 세 조각으로 이루어져요. 입력(이름을 받는 칸), 처리(AI가 인사말을 만드는 부분), 출력(화면에 결과를 보여주는 부분)입니다. 이 세 조각 구조는 프로젝트 1을 포함해 앞으로 만들 모든 웹앱의 기본 뼈대가 돼요.

🎈 Streamlit이 정확히 무엇을 해주는 도구일까

원래 파이썬으로 화면(버튼, 입력창)을 만들려면 HTML·CSS·JS를 따로 다룰 줄 알아야 했어요. Streamlit은 st.title(...), st.button(...)처럼 파이썬 코드 몇 줄만으로 웹 화면을 자동 생성해주는 라이브러리예요. 데이터·AI를 다루는 사람들이 화면 개발에 시간을 뺏기지 않도록 만들어졌어요.

🆚 Streamlit vs 일반 웹사이트, 뭐가 다를까

일반 웹사이트는 버튼을 누르면 자바스크립트가 화면 일부만 바꿔요. Streamlit은 버튼이 눌릴 때마다 파이썬 코드 전체가 위에서 아래로 다시 실행되는 독특한 방식이에요. 처음엔 낯설지만, 이 덕분에 복잡한 화면 로직 없이도 데이터 중심 앱을 빠르게 만들 수 있어요.

🏫 누가 Streamlit을 사용할까

데이터 분석가, AI 연구자, 대학 연구실 등에서 결과를 빠르게 화면으로 보여줘야 할 때 널리 씁니다. 화면 디자인보다 "결과가 잘 전달되는가"가 더 중요한 상황에 잘 맞는 도구예요.

🎯 오늘 미션 2의 최종 목표, 다시 한번

거창한 앱을 만드는 게 아니에요. 이름을 입력하면 AI가 인사말을 만들어주는 아주 작은 앱을 만들고, 그걸 인터넷에 올려서 주소를 얻는 것이 오늘의 전부입니다. 작아 보여도 "배포"라는 큰 산을 하나 넘는 경험이에요.

① Streamlit 설치하기

먼저 도구를 설치합니다. 터미널에 (venv) 표시가 있는지 확인하고 입력하세요.

터미널

# (venv) 표시 확인 후 설치
pip install streamlit openai

▸ 설치 완료 메시지 예시

Successfully installed streamlit-1.x.x openai-1.x.x
...

Collecting streamlit
  Downloading streamlit-1.x.x-py3-none-any.whl
Successfully installed streamlit-1.x.x

⚠️ 설치 단계에서 자주 하는 실수

터미널에 (venv)가 안 보이는데 그냥 설치 → 가상환경 밖에 깔리면 다음 시간에 다시 못 찾을 수 있어요. source venv/bin/activate(맥) 또는 venv\Scripts\activate(윈도우)로 먼저 켜세요.
설치 중 인터넷이 끊겨 일부만 설치 → 같은 명령어를 한 번 더 실행하면 이어서 설치됩니다.
pip 대신 pip3를 써야 하는 환경에서 헷갈림 → 에러 메시지에 "command not found"가 뜨면 pip3 install로 다시 시도하세요.

✅ 설치가 잘 됐는지 확인하는 법

터미널에 streamlit hello를 입력하면, Streamlit이 기본으로 제공하는 샘플 앱이 브라우저에 자동으로 열려요. 이 화면이 뜬다면 설치가 정상적으로 완료된 것입니다. 확인 후 Ctrl+C로 종료하고 다음 단계로 넘어가세요.

터미널

streamlit hello

▸ streamlit hello 실행 결과

  You can now view your Streamlit app
  in your browser.

  Local URL: http://localhost:8501
  Network URL: http://192.168.x.x:8501

🆚 streamlit hello vs streamlit run, 뭐가 다를까

streamlit hello는 Streamlit이 미리 만들어둔 샘플 앱을 보여줘요. 우리가 만든 코드가 아니라 설치 확인용이에요. 다음 단계부터 쓸 streamlit run streamlit_app.py는 우리가 직접 작성한 파일을 실행하는 명령어입니다.

② API 키 준비 — ask_ai 함수 만들기

이 앱은 AI에게 인사말을 부탁할 거예요. 그러려면 API 키가 필요해요. 기초 2주차부터 하던 대로, .env에 키를 넣고 코드에는 직접 적지 않습니다.

🔁 복습 — API 키를 코드에 직접 쓰면 안 되는 이유

코드를 GitHub 같은 공개 저장소에 올리면, 코드 안에 적힌 값은 누구나 볼 수 있어요. API 키가 그대로 코드에 있으면 다른 사람이 그 키로 요청을 보내 비용이 청구될 수 있습니다. 그래서 키는 항상 .env처럼 따로 분리된 파일에 두고, 코드에서는 그 파일을 "불러와서" 씁니다.

▸ 절대 이렇게 쓰지 않기 — 나쁜 예

client = OpenAI(api_key="sk-abc123...")

→ 키가 코드에 그대로 보여요. GitHub에
  올리는 순간 전 세계에 공개됩니다.

.env

OPENAI_API_KEY=여기에_선생님이_알려준_키_붙여넣기

그리고 AI를 부르는 짧은 함수 하나를 만들어 두면, 앞으로 계속 재사용할 수 있어요.

streamlit_app.py — AI 호출 함수

from openai import OpenAI
client = OpenAI()   # 키는 .env에서 자동으로

def ask_ai(prompt):
    res = client.chat.completions.create(
        model="gpt-4o-mini",
        messages=[{"role": "user", "content": prompt}]
    )
    return res.choices[0].message.content

💡 이 함수, 왜 필요할까

ask_ai("질문")이라고 쓰면 AI에게 질문을 보내고 답을 글자로 돌려줘요. 이 함수가 있어야 Secrets에 넣은 키가 실제로 쓰입니다 — 키만 넣고 안 쓰면 의미가 없어요.

client = OpenAI()

"AI와 대화할 통로를 하나 연다"는 뜻이에요. 이 시점에 .env(또는 Secrets)의 키를 자동으로 찾아서 연결합니다.

def ask_ai(prompt):

앞으로 ask_ai("질문")이라고만 쓰면 되도록, 반복될 요청 과정을 함수 하나로 묶어두는 부분이에요.

client.chat.completions.create(...)

그 통로로 실제 질문(prompt)을 보내는 부분입니다. model은 어떤 AI를 쓸지 정해요.

return res.choices[0].message.content

AI가 보내온 응답에서 답변 글자만 꺼내 돌려주는 부분이에요. 이 값이 화면에 표시됩니다.

🧪 함수만 따로 테스트해보기

화면을 만들기 전에, 터미널에서 python을 실행하고 ask_ai("안녕이라고 인사해줘")를 직접 호출해보면 함수가 잘 작동하는지 먼저 확인할 수 있어요. 화면 코드에 문제가 있는지, 함수 자체에 문제가 있는지 구분하는 좋은 방법입니다.

▸ 터미널에서 직접 테스트한 결과

>>> ask_ai("안녕이라고 인사해줘")
'안녕하세요! 오늘도 좋은 하루 보내세요 😊'

▸ .env를 못 찾을 때 뜨는 에러 예시

AuthenticationError: Could not resolve
authentication method. Expected either
api_key or auth_token to be set.

→ 원인: .env 파일이 없거나, 파일 이름이
  ".env"가 아니거나(".env.txt" 등), 코드
  파일과 다른 폴더에 있는 경우입니다.

⚠️ ask_ai 함수 작성 시 자주 하는 실수

.env 파일 없이 바로 실행 → OPENAI_API_KEY를 찾을 수 없다는 에러가 뜹니다. .env 파일이 코드 파일과 같은 폴더에 있는지 확인하세요.
함수 이름을 ask_ai가 아닌 다른 이름으로 바꿔놓고 나중에 헷갈림 → 앞으로 여러 주차에서 이 이름을 계속 재사용하니 통일해두는 게 좋아요.
model 이름을 오타로 잘못 입력 → 존재하지 않는 모델을 요청하면 에러가 뜹니다. 코드에 적힌 이름을 그대로 사용하세요.
파일 이름을 .env.txt로 저장(메모장 등에서 자동으로 확장자 추가) → 반드시 .env로 끝나는지 파일 탐색기에서 확인하세요.

🔑 힌트 — AuthenticationError가 계속 떠요

① .env 파일이 streamlit_app.py와 정확히 같은 폴더에 있는지 확인하세요.

② 파일 안 내용이 OPENAI_API_KEY=키값 형태로, 등호(=) 앞뒤에 공백 없이 적혀 있는지 확인하세요.

③ 그래도 안 되면 터미널을 완전히 껐다가 다시 열고 가상환경을 재활성화한 뒤 실행해보세요.

③ 화면 만들고 실행하기

화면이 있는 파이썬 앱은 아래처럼 짧게 만들 수 있어요. AI에게 "Streamlit으로 이름을 입력받아 AI가 인사말을 만들어주는 앱 만들어줘"라고 요청하면 이런 코드를 받게 됩니다.

streamlit_app.py

import streamlit as st

st.title("👋 나의 첫 배포 앱")
name = st.text_input("이름을 입력하세요")

if st.button("인사받기"):
    prompt = f"{name}이라는 이름의 심화 과정 학생에게 짧고 따뜻하게 환영 인사를 한 문장으로 해줘"
    st.write(ask_ai(prompt))

저장한 파일 이름이 streamlit_app.py라면, 터미널에서 아래처럼 실행합니다.

터미널

streamlit run streamlit_app.py

▸ 브라우저 화면 — AI 응답 예시(매번 조금씩 달라져요)

👋 나의 첫 배포 앱
이름을 입력하세요: [ 지민 ]
[ 인사받기 ]

지민님, 심화 과정에 오신 걸 환영해요! 함께 멋진 프로젝트 만들어봐요 🎉

📸 스크린샷 자리

streamlit run streamlit_app.py 실행 후, AI가 만든 인사말을 받은 화면

▸ 다른 이름을 입력했을 때 — 매번 문장이 달라져요

👋 나의 첫 배포 앱
이름을 입력하세요: [ 서연 ]
[ 인사받기 ]

서연님! 심화 과정 첫걸음을 응원해요.
멋진 프로젝트 5개, 함께 완성해봐요 ✨

st.title(...) · st.text_input(...)

화면 제목을 표시하고, 사용자가 입력한 글자를 name 변수에 담습니다.

if st.button(...):

버튼이 눌렸는지를 확인하고, 눌렸을 때만 아래 블록의 코드가 실행됩니다.

prompt = f"..."

{name} 자리에 실제 입력값을 끼워 넣어, AI에게 보낼 질문 문장을 완성합니다.

st.write(ask_ai(prompt))

완성된 질문을 ask_ai()에 넘겨 AI의 답을 받고, 그 결과를 화면에 표시합니다.

💡 매번 응답이 조금씩 다른 이유

AI는 같은 질문에도 매번 표현을 조금씩 바꿔서 답합니다. 정해진 한 문장을 복사해서 보여주는 게 아니라, 그때그때 새로 문장을 만들어내기 때문이에요. 이 특성 때문에 같은 이름을 넣어도 인사말이 매번 달라져요.

⚠️ 화면 작성·실행 단계에서 자주 하는 실수

파일 이름을 streamlit_app.py가 아닌 다른 이름으로 저장 → 실행 명령어의 파일명과 반드시 일치해야 해요.
이름을 입력하지 않고 버튼만 누름 → f"{name}..."의 name이 빈 문자열이 되어 어색한 인사말이 나올 수 있어요.
터미널을 닫으면 앱도 꺼짐 → 로컬 실행 중엔 터미널 창을 계속 열어둬야 브라우저에서 앱이 보여요.

🔁 여러 이름으로 반복 테스트해보기

한 번 실행 확인했다고 끝내지 말고, 이름을 두세 번 바꿔가며 버튼을 눌러보세요. 매번 자연스러운 인사말이 나오는지 확인하면, 배포 전에 예상치 못한 문제를 미리 발견할 수 있어요.

④ 배포 3단계

내 컴퓨터에서만 돌던 이 앱을, Streamlit Community Cloud라는 무료 서비스에 올리면 전 세계 어디서나 열리는 주소가 생깁니다.

📍 배포 전체 흐름 한눈에 보기

📁

저장소 만들기

New repository, Public 선택

→

⬆️

코드 업로드

Add file → Upload files

→

🔗

share.streamlit.io 접속

GitHub 계정으로 로그인

→

➕

New app 클릭

My Apps에서 시작

→

📝

저장소·파일 입력

Repository·Branch·Main file path

→

🚀

Deploy 클릭

배포 완료, 주소 생성!

GitHub 저장소 만들기

[Repositories] → [New]로 새 저장소를 만듭니다. 이때 반드시 Public으로 설정해야 무료 배포가 가능해요. [Add file] → [Upload files]로 streamlit_app.py와 requirements.txt를 올립니다.

Streamlit Cloud에서 New app

share.streamlit.io에 GitHub 계정으로 로그인 후 [New app]을 누르고, Repository·Branch(main)·Main file path(streamlit_app.py)를 입력하면 앱이 만들어져요. GitHub Pages와 달리, 파이썬 코드가 서버에서 직접 실행됩니다.

키는 Secrets 칸에

배포 화면의 'Secrets' 칸에 선생님이 알려준 형식대로 키를 넣습니다. 코드에는 절대 키를 적지 않아요.

🗺️ 배포 3단계, 왜 이 순서일까

저장소를 먼저 만들지 않으면 Streamlit Cloud가 가져올 코드가 없어요. 코드를 먼저 올리지 않고 New app을 누르면 연결할 대상이 없죠. 그래서 반드시 "저장소 준비 → 앱 생성 → 키 설정" 순서를 지켜야 합니다. 하나라도 순서가 바뀌면 중간에 막히기 쉬워요.

📊 GitHub Pages(예전)와 Streamlit Cloud(오늘), 무엇이 다를까

GitHub Pages는 HTML·CSS·JS 파일을 그대로 보여주기만 했어요. Streamlit Cloud는 다릅니다 — 여러분이 올린 파이썬 코드를 서버가 직접 실행하면서 화면을 만들어내요. 그래서 파이썬 코드가 돌아갈 수 있는 환경(라이브러리 목록, API 키)을 함께 알려줘야 합니다.

🌐 배포하면 정확히 무슨 일이 벌어질까

여러분의 노트북과 똑같은 파이썬 실행 환경을, Streamlit이 인터넷 어딘가의 컴퓨터(서버)에 만들어줍니다. 그 서버는 24시간 켜져 있어서, 여러분이 노트북을 덮어도 앱은 그대로 살아있어요. 그 서버에 접속하는 열쇠가 바로 배포 후 생기는 주소(...streamlit.app)입니다.

💵 정말 완전히 무료일까

Streamlit Community Cloud는 개인 프로젝트·학습 목적의 앱을 무료로 배포할 수 있게 해줘요. 대신 저장소가 Public이어야 하고(누구나 코드를 볼 수 있음), 사용량이 아주 많아지면 제한이 있을 수 있어요. 오늘 우리가 만드는 규모의 앱에는 충분합니다.

💡 GitHub 저장소, 왜 꼭 거쳐야 할까

Streamlit Cloud는 여러분의 컴퓨터에서 직접 파일을 받지 않아요. 대신 GitHub에 올라간 코드를 가져가서 실행합니다. 그래서 배포하려면 항상 "코드를 GitHub에 올리기"가 먼저예요 — 이 순서를 기억해두면 다음 프로젝트에서도 헷갈리지 않아요.

실제 화면으로 따라가기

아래 9장을 순서대로 따라가면 GitHub 저장소 생성부터 Streamlit 배포 완료까지 그대로 진행할 수 있어요.

1단계 — GitHub에 코드 올리기 (①~②)

📸 스크린샷 자리

① GitHub 새 저장소 만들기 — Public 선택

📸 스크린샷 자리

② 저장소에 streamlit_app.py 등 코드 파일이 업로드된 모습

⚠️ GitHub 업로드 단계에서 자주 하는 실수

저장소 이름에 띄어쓰기나 한글을 사용 → 영어·숫자·하이픈만 쓰는 게 안전해요.
streamlit_app.py를 폴더 안에 넣고 업로드 → 나중에 Main file path를 입력할 때 폴더 경로까지 정확히 적어야 해서 헷갈립니다. 저장소 최상위에 바로 올리세요.
requirements.txt를 깜빡하고 코드 파일만 업로드 → 3단계(New app)에서 앱은 만들어지지만 실행 중 에러가 납니다.

2단계 — Streamlit Cloud 로그인 (③~⑤)

📸 스크린샷 자리

③ share.streamlit.io 홈 화면

📸 스크린샷 자리

④ 'Log in with GitHub' 클릭

📸 스크린샷 자리

⑤ GitHub 계정으로 Streamlit 인증(Authorize)

🔐 'Authorize' 버튼, 눌러도 안전할까

Streamlit이 여러분의 GitHub 저장소 목록을 읽을 수 있도록 허락을 구하는 화면이에요. 배포하려면 Streamlit이 저장소의 코드를 가져와야 하니 꼭 필요한 절차입니다. D-LAB 계정이 아닌 본인 GitHub 계정으로 로그인했는지만 확인하세요.

⚠️ 로그인 단계에서 자주 하는 실수

다른 사람의 GitHub 계정으로 로그인 → 나중에 자신의 저장소가 목록에 안 보입니다. 반드시 본인 계정으로 로그인하세요.
로그인 창이 팝업 차단으로 안 뜸 → 브라우저의 팝업 차단 알림을 확인하고 허용해주세요.

3단계 — 앱 생성과 설정 (⑥~⑨)

📸 스크린샷 자리

⑥ My Apps 화면에서 'Create app' 클릭

📸 스크린샷 자리

⑦ 배포 방식 선택 — 'Deploy a public app from GitHub'

📸 스크린샷 자리

⑧ Repository·Branch·Main file path 입력

📸 스크린샷 자리

⑨ 입력을 마치고 Deploy 버튼 누르기 직전

📝 Repository·Branch·Main file path, 각각 무엇을 입력할까

Repository는 방금 만든 GitHub 저장소 이름, Branch는 코드가 저장된 갈래(대부분 main), Main file path는 실행할 파이썬 파일 이름(streamlit_app.py)이에요. 세 정보 모두 방금 GitHub 저장소 화면에서 그대로 확인할 수 있어요.

⚠️ 앱 설정 단계에서 자주 하는 실수

Branch를 main이 아닌 다른 이름으로 착각 → GitHub 저장소 화면에서 실제 브랜치 이름을 먼저 확인하세요.
Main file path에 /streamlit_app.py처럼 맨 앞 슬래시를 넣음 → 슬래시 없이 streamlit_app.py만 입력합니다.
Deploy를 누른 뒤 화면이 바로 안 뜬다고 새로고침을 반복 → 처음 배포는 몇 분 정도 걸릴 수 있어요. 로그 화면에 진행 상황이 표시됩니다.

⑤ API 키는 Secrets로 관리하기

방금 로컬에서는 .env로 키를 관리했죠. 배포한 앱에서도 같은 키가 안전하게 동작하도록 만드는 법을 익혀둡니다.

🔑 이미 하던 습관, 배포 환경에서도 지키기

기초 2주차부터 API 키를 .env 파일에 넣고 코드에 직접 쓰지 않는 습관을 들여왔죠? 배포할 땐 .env 파일 자체를 GitHub에 올리지 않고, 대신 Streamlit Cloud의 Secrets 칸에 같은 값을 넣습니다. 원칙은 똑같아요 — 키는 코드 밖에, 화면에도 노출하지 않는다.

🗺️ Secrets 칸은 어디서 찾을 수 있을까

Streamlit Cloud의 My Apps 목록에서 배포한 앱을 클릭하고, 오른쪽 위 점 3개(⋮) 메뉴 또는 Settings에서 Secrets 탭을 찾을 수 있어요. 처음 배포할 때도, 배포 후 나중에도 언제든 값을 수정할 수 있습니다.

📸 스크린샷 자리

배포 설정의 Secrets 입력 칸에 키를 넣는 화면(키 값은 가림)

Streamlit Cloud — Secrets 입력 형식

OPENAI_API_KEY = "여기에_선생님이_알려준_키_붙여넣기"

🗝️ Secrets 칸 안에는 실제로 어떤 형식이 들어갈까

Secrets 칸은 .env 파일과 거의 같은 형식이에요. 줄마다 키이름 = "값" 형태로 적습니다. 코드 안의 OpenAI()는 로컬에서는 .env를, 배포 환경에서는 이 Secrets 칸을 자동으로 찾아서 읽어요 — 코드를 따로 고칠 필요가 없습니다.

🔎 Secrets를 저장하면 어떻게 될까

Secrets 칸에 값을 입력하고 저장하면, Streamlit Cloud가 앱을 자동으로 재시작해서 새 키 값을 반영해요. 화면이 잠깐 리로딩되는 것처럼 보이면 정상 동작입니다.

⚠️ Secrets 설정 시 자주 하는 실수

키 값을 따옴표 없이 입력 → 형식에 따라 오류가 날 수 있으니 선생님이 안내한 형식을 그대로 따르세요.
Secrets를 저장하지 않고 페이지를 이동 → 저장 버튼을 반드시 눌러야 반영됩니다.
발표·화면 공유 중 Secrets 화면을 그대로 노출 → 키가 보이는 화면은 절대 캡처·공유하지 않습니다.

🎉 Deploy 버튼을 누른 뒤 벌어지는 일

Deploy를 누르면 화면에 로그가 흐르며 서버가 필요한 라이브러리를 하나씩 설치해요. 로그가 멈추고 앱 화면이 뜨면 배포 완료! ...streamlit.app 주소가 브라우저 주소창에 나타납니다.

배포에 꼭 필요한 파일

배포하려면 "이 앱은 어떤 라이브러리가 필요해요"를 알려주는 목록 파일이 있어야 해요. AI에게 "이 앱의 requirements.txt를 만들어줘"라고 요청하면 됩니다.

💬 프롬프트 예시

방금 만든 streamlit_app.py 코드를 보고 이 앱을 배포하는 데 필요한 requirements.txt 파일을 만들어줘.

requirements.txt

streamlit
openai

📦 requirements.txt, 왜 매번 챙겨야 할까

여러분의 노트북에는 이미 pip install로 설치해둔 라이브러리가 있죠. 하지만 배포 서버는 완전히 빈 컴퓨터에서 시작해요. requirements.txt가 있어야 서버가 "아, streamlit이랑 openai를 설치해야 하는구나"를 알고 자동으로 설치합니다.

💡 라이브러리 버전까지 적어야 할까

지금 단계에서는 streamlit처럼 이름만 적어도 충분해요. 나중에 특정 버전이 필요해지면 streamlit==1.32.0처럼 버전 번호를 붙이는 방법도 있다는 것만 알아두세요.

requirements.txt — 버전을 고정하는 경우 예시

streamlit==1.32.0
openai==1.14.0

▸ requirements.txt가 빠졌을 때 배포 로그 예시

ModuleNotFoundError: No module named 'openai'

→ 원인: requirements.txt에 openai가
  빠져있거나, 파일 이름이 정확히
  "requirements.txt"가 아닌 경우입니다.

⚠️ requirements.txt 작성 시 자주 하는 실수

파일 이름을 requirement.txt(s 누락)로 잘못 저장 → 정확히 requirements.txt여야 인식됩니다.
라이브러리 이름 철자를 틀림(예: steamlit) → 설치 단계에서 바로 실패합니다.
로컬에서 쓴 모든 라이브러리를 나열하려다 불필요한 것까지 포함 → 이 앱이 실제로 쓰는 것만 적으면 충분해요.

⑥ 배포 후 확인하기 — 내 폰으로도 열어보기

Deploy가 끝나면 https://내앱이름.streamlit.app 형태의 주소가 생깁니다. 이 주소를 여러분의 폰 브라우저에 직접 입력하거나, 주소를 문자로 보내서 열어보세요.

📱 왜 폰으로 확인하는 게 중요할까

내 컴퓨터에서만 열어보면 "진짜 배포됐다"는 실감이 잘 안 나요. Wi-Fi가 다른 폰에서 주소를 입력해 앱이 뜨면, 이 앱이 더 이상 내 컴퓨터에 의존하지 않고 인터넷 어딘가의 서버에서 돌아가고 있다는 걸 직접 확인할 수 있어요.

👨‍👩‍👧‍👦 가족·친구에게도 보내보기

배포된 주소는 링크 하나로 누구에게나 공유할 수 있어요. 오늘 배포한 앱 주소를 가족 단체 채팅방에 보내보세요. 여러분이 만든 것이 실제로 인터넷에 존재하는 서비스가 되었다는 걸 가장 확실하게 체감하는 방법입니다.

▸ 배포 완료 후 생기는 주소 형태

https://내프로젝트이름-랜덤문자.streamlit.app

예시)
https://my-first-app-ab12cd34.streamlit.app

⚠️ 배포 후 확인 시 자주 하는 실수

배포 직후 바로 접속해 로딩 화면만 보고 안 됐다고 판단 → 처음 접속 시 서버가 "잠에서 깨는" 시간이 걸릴 수 있으니 잠시 기다려보세요.
주소를 메모하지 않고 창을 닫음 → Streamlit Cloud의 'My Apps' 목록에서 언제든 다시 찾을 수 있지만, 노션에도 주소를 기록해두세요.

⑦ 배포 후 유지·관리하기

앱을 한 번 배포했다고 끝이 아니에요. 앞으로 2주마다 새로운 프로젝트를 배포하게 되니, 배포된 앱을 관리하는 기본 방법도 미리 알아둡니다.

😴 오랫동안 안 쓰면 앱이 잠들어요

Streamlit Community Cloud는 일정 기간 방문자가 없으면 앱을 절전 상태로 돌려요. 다시 접속하면 "이 앱을 다시 깨울까요?(Wake up)" 버튼이 뜨는데, 눌러서 잠시 기다리면 다시 정상 작동합니다. 고장이 아니라 정상적인 절전 기능이에요.

🔄 코드를 수정하면 자동으로 재배포돼요

GitHub 저장소의 streamlit_app.py 파일을 수정해서 다시 업로드하면, Streamlit Cloud가 몇 초~몇 분 안에 자동으로 최신 코드로 앱을 다시 실행해줘요. 별도로 "재배포" 버튼을 누를 필요는 없지만, 화면을 새로고침해야 바뀐 내용이 보입니다.

📊 Manage app에서 무엇을 볼 수 있을까

Streamlit Cloud의 'Manage app' 화면에서는 앱의 실행 로그, 사용된 라이브러리, 재시작 버튼 등을 확인할 수 있어요. 에러가 났을 때 가장 먼저 들여다봐야 할 화면입니다.

⚠️ 자주 하는 실수

저장소를 Private로 만들면 무료 배포가 안 돼요 → 반드시 Public으로 생성합니다.
배포한 앱이 에러 → 대부분 requirements.txt가 빠졌거나 Secrets에 키를 안 넣어서예요.
GitHub에 .env 파일(키)을 올리면 절대 안 돼요 → 키는 배포 화면의 Secrets에만 넣습니다.
python streamlit_app.py로 실행하면 화면이 안 떠요. 꼭 streamlit run streamlit_app.py.
로컬에서는 잘 되는데 배포 후에만 에러 → 로컬은 .env, 배포는 Secrets로 키 경로가 다르다는 걸 잊은 경우가 많아요.
코드를 수정했는데 배포된 앱에는 반영이 안 됨 → GitHub 저장소에 수정한 파일을 다시 업로드(커밋)해야 Streamlit Cloud가 자동으로 재배포합니다.

🔄 힌트 — 코드를 고쳤는데 앱에 반영이 안 돼요

GitHub 저장소 화면에서 수정한 파일을 찾아 Edit(연필 아이콘)을 누르거나, 새 버전을 다시 Upload files로 올려서 덮어써야 해요. 로컬 파일만 고치는 것으로는 배포된 앱에 반영되지 않습니다.

업로드 후 Streamlit Cloud의 Manage app 화면에서 "Rerunning" 표시가 뜨면 정상적으로 재배포가 진행 중인 거예요.

🚀 힌트 — Deploy를 눌렀는데 계속 로딩 중이에요

첫 배포는 서버가 라이브러리를 새로 설치하는 과정이라 1~3분 정도 걸릴 수 있어요. 화면 하단의 로그(Manage app → Logs)를 보면 어느 단계에서 멈췄는지 확인할 수 있습니다.

5분이 넘도록 진행이 없다면 requirements.txt의 라이브러리 이름 철자를 다시 확인해보세요. 오타 하나로 설치가 멈추는 경우가 흔해요.

📝 미션 2를 마치며 노션에 남길 것

배포된 앱의 주소와, 배포 과정에서 가장 헷갈렸던 부분 한 가지를 노션 기획서 페이지 아래에 짧게 적어두세요. 다음 프로젝트에서 같은 배포 과정을 반복할 때, 이 메모가 빠른 참고 자료가 됩니다.

🏆 미션 2, 여기까지 왔다면 축하해요

GitHub 저장소 생성부터 배포, Secrets 설정까지 여러 단계를 거쳤어요. 처음엔 낯설었을 이 과정이, 앞으로 4번 더 반복하면서 손에 익게 됩니다. 오늘 겪은 어려움 하나하나가 다음번엔 더 쉬워질 거예요.

✓GitHub에 앱 코드가 올라갔다✓streamlit.app 주소가 생겼다✓API 키를 Secrets 칸에 넣는 방법을 설명할 수 있다

🔒 힌트 — 배포한 앱에서 에러가 떠요

가장 흔한 원인 두 가지예요.

① requirements.txt 누락 — AI에게 "이 앱의 requirements.txt를 만들어줘"라고 요청해 저장소에 추가.

② Secrets 미설정 — 배포 설정의 Secrets 칸에 키를 넣었는지 확인. 형식은 선생님 안내를 따르세요.

보너스 미션

더 해보고 싶다면

미션 2까지 끝내고 시간이 남는다면 도전해보세요. 끝내지 못해도 괜찮습니다.

보너스 ① 노션 포트폴리오 홈 꾸미기

기획서 페이지 상위에 "포트폴리오 홈" 페이지를 만들어, 앞으로 5개 프로젝트가 들어갈 자리를 미리 표로 만들어둡니다.

노션 — 포트폴리오 홈 표 구성 예시

| 프로젝트 | 상태 | 배포 주소 | 배운 점 |
|---------|------|----------|--------|
| 1. 웹앱 | 기획중 | - | - |
| 2. 데이터 저장 | 예정 | - | - |
| 3. 데이터 시각화 | 예정 | - | - |
| 4. AI 에이전트 | 예정 | - | - |
| 5. API 매시업 | 예정 | - | - |

📸 스크린샷 자리

노션에 만든 포트폴리오 홈 페이지(프로젝트 목록 표)

표의 각 칸에는 이런 값을 채웁니다.

상태

기획중·구현중·배포완료 중 하나를 적습니다.

배포 주소

완성 후 실제 접속 링크를 적습니다.

배운 점

그 프로젝트에서 새로 익힌 기술이나 겪은 어려움을 한 줄로 적습니다.

🌱 처음엔 대부분 "예정"이어도 괜찮아요

이 표가 11주 동안 채워지는 과정 자체가 성장 기록이에요. 오늘은 프로젝트 1의 상태만 "기획중"으로 바꿔두고, 나머지는 그대로 "예정"으로 남겨두세요.

보너스 ② 배포한 앱 링크 공유하고 후기 받기

완성된 주소를 친구나 가족 1명에게 보내고, 써본 느낌을 물어보세요. "뭐가 재밌었어? 뭘 더하면 좋을까?"를 물어 다음 주 프로젝트 기획에 참고합니다.

후기를 받을 때 아래 세 가지를 순서대로 물어보세요.

바로 이해가 됐어?

사용성을 확인하는 질문이에요. 설명 없이도 앱 사용법을 알 수 있었는지 물어봅니다.

어떤 기능이 있으면 더 쓰고 싶어?

확장 아이디어를 얻는 질문이에요. 다음 2주 프로젝트 기획에 참고할 수 있어요.

실제로 또 쓸 것 같아?

실용성을 확인하는 질문이에요. 재미로 한 번 써본 것과 계속 쓰고 싶은 것은 다릅니다.

⚠️ 보너스 미션에서 자주 하는 실수

미션 2를 끝내기 전에 보너스부터 시작 → 필수 미션을 먼저 완료한 뒤에 도전하세요.
후기를 받고 노션에 기록하지 않음 → 구두로 들은 피드백도 짧게라도 노션에 남겨야 다음 주에 참고할 수 있어요.
포트폴리오 홈 표를 만들고 이후 계속 방치 → 앞으로 매주 배포할 때마다 이 표를 업데이트하는 습관을 지금부터 들여보세요.

🎯 성공 기준

포트폴리오 홈 표에 프로젝트 5개 자리가 만들어지고, 배포한 앱에 대해 1명 이상에게서 후기를 받으면 성공이에요.

▸ 받은 후기를 노션에 기록한 예시

후기 (동생): "이름 넣고 버튼 누르니까
바로 인사말이 떴어요! 신기해요."

개선 아이디어: 이모지도 같이 나오면
더 재밌을 것 같다고 함 → 다음에 시도

💌 힌트 — 누구에게 후기를 부탁해야 할지 모르겠어요

꼭 개발을 아는 사람이 아니어도 괜찮아요. 오히려 기술을 모르는 가족에게 보여주면 "화면이 이해가 안 된다"처럼 여러분이 놓친 부분을 더 잘 짚어줄 수 있어요.

옆에서 함께 수업 듣는 친구에게 서로의 앱을 바꿔가며 사용해보는 것도 좋은 방법입니다.

정리

오늘의 핵심 정리

오늘 하루 만에 심화 과정의 전체 그림을 보고, 기획서를 쓰고, 실제로 앱 하나를 인터넷에 올렸습니다. 네 가지로 정리해봅니다.

1️⃣

로드맵

앞으로 11주간 5개 프로젝트를 기획→구현→배포한다는 흐름을 이해했다

2️⃣

기획

문제정의→핵심기능→MVP 순서로 내 프로젝트 기획서를 썼다

3️⃣

배포

앱을 서버에 배포하고 API 키를 Secrets로 관리하는 법을 익혔다

4️⃣

기록

노션에 포트폴리오 공간을 만들어 첫 기록을 남겼다

🔮 다음 주 예고 — 프로젝트 1: 웹앱

다음 시간부터 2주 동안, 오늘 기획한 아이디어를 바탕으로 Streamlit + Claude API를 연결한 진짜 웹앱을 만듭니다. 오늘 배운 "입력→처리→출력" 구조와 배포 방법이 그대로 프로젝트 1의 기술 요건이 됩니다. 오늘 쓴 기획서를 다시 열어보고 오세요.

오늘 챙겨가야 할 세 가지를 정리합니다.

노션 기획서

다음 주 그대로 이어받아 구현하는 기준 문서예요.

오늘 배포한 앱 주소

포트폴리오 홈 표에 기록해두면 나중에 찾기 쉬워요.

배포 과정에서 겪은 에러와 해결법

다음에도 같은 실수를 반복하지 않도록 짧게 메모해둡니다.

⚠️ 오늘 배운 내용을 잊어버리기 쉬운 부분

기획서를 쓰고 나서 다시 안 열어봄 → 다음 주 시작 전에 오늘 쓴 문제정의·핵심기능·MVP를 한 번 더 읽고 오세요.
배포 방법을 "한 번 해봤으니 안다"고 생각 → 다음 프로젝트에서도 같은 절차(GitHub 업로드→Streamlit Cloud 연결→Secrets 설정)를 반복하니, 헷갈리면 오늘 교안을 다시 펼쳐보세요.

🌱 오늘 하루로 무엇이 달라졌을까

오늘 아침까지는 "심화 과정이 뭘까" 궁금했다면, 지금은 직접 앱을 만들어 인터넷에 올려본 사람이 되었어요. 작게 시작했지만, 이 경험이 앞으로 11주의 기초가 됩니다.

🔧 막혔을 때 — 자가 디버깅 4단계

에러가 떠도 당황하지 마세요. 선생님께 묻기 전에 이 순서대로 스스로 해결해봅니다.

에러 메시지 읽기

빨간 글자에서 '몇 번째 줄'과 '무슨 에러'인지 찾아본다.

AI에게 보여주기

에러 메시지를 복사해서 "이 에러를 수정해줘"라고 AI에게 요청한다.

고쳐서 다시 실행

AI가 준 수정 코드를 적용하고 다시 실행해본다.

선생님께 질문

그래도 안 되면 '에러 메시지 + 내가 시도한 것'을 함께 설명한다.