Day 4 — 내 서비스 배포 · 결과 취합·관리 · 작은 서비스 발산

어제 한 일 한 장

무엇을 하나요

교안을 바탕으로 퀴즈 시스템을 만들고 Vercel CLI로 올린 흐름을 되짚습니다.

왜 하나요

현장에서는 “만들다 보니 배포까지” 간 경우가 많고, 곧이어 결과 취합을 묻습니다. 오늘은 「내 서비스」와 「취합은 하되 온라인에 상시 두지 않기」를 붙잡습니다.

따라 하기

1. 손가락으로 네 단계: 교안 → 퀴즈 UI → vercel → 공개 URL.
2. 자기(또는 팀) 어제 URL이 있으면 메모해 둡니다.
3. 성공 조건 4개를 소리 내어(또는 통역으로) 확인합니다.

닫는 성공 조건: #1

「내 서비스」란?

무엇을 하나요

학생이 링크만 열면 쓸 수 있고, 내 노트북이 꺼져 있어도 동작하는 웹입니다.

왜 하나요

현장에서 퀴즈 앱을 만들면 바로 “배포는 어떻게?” “결과는 어떻게 모아요?”가 이어집니다. 공개 URL은 수업 도구를 나누기 쉽지만, <strong>결과를 그 주소에 계속 쌓아 두면</strong> 개인정보 위험이 됩니다.

따라 하기

1. 티어 1 · 브라우저 파일: HTML을 더블클릭·인쇄 (배포 없음).
2. 티어 2 · 내 PC: 취합한 결과·성적 파일을 보관하는 곳(상시 보관).
3. 티어 3 · Vercel(인스턴트): 수업 중 잠깐 쓰는 공개 URL — 끝난 뒤 결과는 옮기고 온라인에 남기지 않음.

닫는 성공 조건: #1

배포 파이프라인

무엇을 하나요

코드 폴더가 인터넷의 한 주소가 되는 과정을 말로 그립니다.

왜 하나요

도구 이름보다 “무엇이 어디로 가는지”가 남습니다. 이 그림이 있으면 다음 작은 서비스도 같은 길로 올릴 수 있습니다.

따라 하기

1. 순서: 프로젝트 폴더 → 터미널에서 vercel (또는 vercel --prod) → *.vercel.app URL → 학생에게 링크 공유.
2. 로컬에서 먼저 열어 본 뒤 배포하는 습관을 기억합니다.
3. 같은 폴더를 다시 올리면 “재배포”로 내용이 갱신됩니다.

닫는 성공 조건: #1

서비스 관점으로 설명하기

무엇을 하나요

어제 퀴즈를 “내 서비스 한 줄 소개”로 다시 적습니다.

왜 하나요

배포만 하고 설명을 못 하면 동료·학생에게 넘기기 어렵습니다. 누구용·무엇을·어디에 있는지 세 문장이면 충분합니다.

따라 하기

1. 아래 프롬프트로 서비스 설명문(짧은 README 또는 HTML 한 장)을 받습니다.
2. URL · 대상 · 기능 · 「결과 취합 방식」 · 「보관 위치(PC/LMS)」 · 「Vercel=인스턴트」를 반드시 포함합니다.

그대로 붙여 넣을 말

어제 만든 교안 기반 퀴즈 웹을 “내 서비스”로 소개하는 짧은 설명문을 만들어 줘.
구성(각 1–2문장):
1) 서비스 이름
2) 누구를 위한가 (예: 초급 한국어 학습자 / 교사가 링크 공유)
3) 무엇을 하는가
4) 어떻게 접속하는가 (Vercel URL 자리표시자)
5) 결과 취합: 이름·학번 등 식별을 모으는지, 어떻게 모으는지
6) 관리: 결과는 어디에 보관하는지, Vercel URL에 상시 두지 않는다는 점(인스턴트)
한국어 + 베트남어 짧은 병기. 표나 불릿으로.

Hãy viết mô tả ngắn giới thiệu web quiz từ giáo án hôm qua như “dịch vụ của tôi”.
Gồm (mỗi mục 1–2 câu):
1) Tên dịch vụ
2) Cho ai (vd người học tiếng Hàn sơ cấp / GV chia sẻ link)
3) Làm gì
4) Cách truy cập (chỗ trống URL Vercel)
5) Thu kết quả: có thu định danh (tên/mã SV) không, thu thế nào
6) Quản lý: kết quả giữ ở đâu; không để lâu trên URL Vercel (dùng tức thời)
Song ngữ KO + VI ngắn. Dạng bảng hoặc bullet.

성공하면 이렇게 보입니다

URL·대상·기능·취합·보관(인스턴트)이 한눈에 보이는 설명문이 있습니다.

닫는 성공 조건: #1

현장의 두 질문: 배포와 결과 취합

무엇을 하나요

퀴즈 앱을 만들면 바로 “배포는?” “결과는 어떻게 모아요?”가 나옵니다. 식별 없이 점수만 보면 수업 도구 의미가 크게 줄어듭니다.

왜 하나요

문제는 취합 자체가 아니라 <strong>어디에 얼마나 오래 두느냐</strong>입니다. 공개 URL에 성적철을 열어 두는 것과, 수업 중 모은 뒤 Offline/LMS로 옮기는 것은 다릅니다.

따라 하기

1. 취합은 한다: 이름(또는 학번)·응답·점수를 모아 피드백·보충에 씁니다.
2. 상시 온라인 보관은 하지 않는다: 공개 URL·열린 클라우드에 결과가 계속 쌓이게 두지 않습니다.
3. Vercel = 인스턴트: 수업 중 잠깐 쓰는 접속면. 끝난 뒤 결과는 내려받거나 옮겨 둡니다.
4. 보관 위치: 내 PC, 학교 LMS, 비공개 드라이브 — “내가 관리하는 곳”.

닫는 성공 조건: #2

인스턴트 운영 원칙 4가지

무엇을 하나요

수업 전→중→후에 바로 쓸 수 있는 최소 규칙을 외웁니다.

왜 하나요

“취합 금지”로 가르치면 현장이 안 맞습니다. “공개 웹에 성적철을 남기지 않기”가 교실 서비스의 기본 습관입니다. 담당은 도구가 아니라 교수입니다.

따라 하기

1. (1) 취합 가능 — 식별+결과가 있어야 피드백·보충이 된다.
2. (2) 수업 후 이동 — 다운로드·내보내기·LMS로 옮긴다.
3. (3) 공개 URL ≠ 창고 — 링크만 알면 전원 성적이 보이게 두지 않는다.
4. (4) Vercel은 인스턴트 — 필요할 때 띄우고, 끝나면 정리·재배포·데이터 비우기.

닫는 성공 조건: #2

렌즈 점검 · 관리 체크리스트

무엇을 하나요

어제 퀴즈 URL을 세 눈으로 점검하고, 취합·보관·인스턴트 정리 체크리스트를 만듭니다.

왜 하나요

“동작한다”와 “수업 후 결과가 안전하게 옮겨졌다”는 다릅니다. 점검 습관이 사고를 막습니다.

따라 하기

1. 아래 프롬프트로 3렌즈 비평과 수정 요청을 받습니다.
2. 이어서 체크리스트를 만들게 하거나, 아래 미리보기를 기준으로 자기 서비스에 적용합니다.

그대로 붙여 넣을 말

어제 배포한(또는 배포할) 교안 기반 퀴즈 웹을 세 눈으로 점검해 줘. 각 3줄.
1) 수업 도구: 학생 식별을 포함한 결과 취합이 가능한가? 불가능하면 어떻게 보완할까?
2) 개인정보 관리: 결과가 공개 URL에 상시 남는가? 수업 후 Offline/LMS로 옮기는 흐름이 있는가?
3) 운영: Vercel을 인스턴트(수업 중만)로 쓰는가, 아니면 성적 창고처럼 쓰는가?
마지막에 “배포·수업 전에 고칠 것 Top 3”와, 취합은 하되 온라인에 상시 두지 않는 수정 프롬프트 한 덩어리를 줘.

Rà web quiz từ giáo án (đã/ sắp triển khai) bằng ba góc, mỗi góc ≤3 dòng.
1) Công cụ lớp: có thu được kết quả kèm định danh HS không? Nếu không thì bổ sung thế nào?
2) Quản lý quyền riêng tư: kết quả có nằm mãi trên URL công khai? Có luồng chuyển offline/LMS sau tiết?
3) Vận hành: dùng Vercel kiểu tức thời (trong tiết) hay như kho điểm?
Cuối: “Top 3 sửa trước triển khai·tiết” + một khối prompt sửa: vẫn thu nhưng không để online lâu.

성공하면 이렇게 보입니다

자기 서비스에 대해 「취합 방식 + 보관 위치 + Vercel은 인스턴트」를 한 문장으로 말할 수 있습니다.

닫는 성공 조건: #2

아이디어 뱅크 발산

무엇을 하나요

퀴즈 말고도 “링크 하나”로 쓸 수 있는 수업 도구 후보를 표로 받습니다.

왜 하나요

어제 퀴즈는 하나의 도착지일 뿐입니다. 같은 설계로 플래시카드·타이머·취합형 퀴즈 등을 만들 때, 각각 “결과는 어떻게 모으고 어디에 두나”를 같이 정합니다.

따라 하기

1. 아래 프롬프트를 실행합니다.
2. 「취합 필요」·「보관 위치」·「Vercel 인스턴트 적합」열을 꼭 확인합니다.
3. 취합·관리 흐름이 말로 설명 되는 후보 1–2개에 동그라미칩니다.

그대로 붙여 넣을 말

역할: 외국어 수업용 작은 웹 서비스를 설계하는 교육공학 코치.
맥락: Day3 교안 — 초급 “첫 만남·자기소개” 1차시. 도구: 정적 HTML/CSS/JS + Vercel CLI.
요청: 같은 교안에서 파생 가능한 작은 서비스 아이디어 10개를 표로.
열: 이름 | 학생이 하는 일 | 교사 사용 장면 | 결과 취합 필요(예/아니오) | 취합·보관 한 줄(예: 수업 후 CSV→PC/LMS) | Vercel 인스턴트 적합(예/아니오) | 최소 기능 3개.
반드시 포함할 유형 예: 플래시카드 · 말하기 타이머 · 수업 퀴즈(이름+점수 취합, 수업 후 Offline) · O/X 폴 · 어휘 짝맞추기 · 다국어 핸드아웃 뷰어 · 오답만 다시 풀기 · 교사용 진행 큐시트 · “결과가 URL에 영구 저장”(반례·비권장).
원칙: 취합(식별 포함)은 가능·권장될 수 있음. 금지하는 것은 “공개 URL에 성적철 상시 보관”.
마지막에 “오늘 만들기 추천 Top 3”와 한 줄 이유(취합·인스턴트 관점).

Vai trò: coach công nghệ giáo dục thiết kế web nhỏ cho lớp ngoại ngữ.
Bối cảnh: giáo án Day3 — tiết sơ cấp “Gặp gỡ·Giới thiệu”. Công cụ: HTML/CSS/JS tĩnh + Vercel CLI.
Yêu cầu: bảng 10 ý tưởng dịch vụ nhỏ từ cùng giáo án.
Cột: Tên | Việc HS làm | Cảnh GV dùng | Cần thu kết quả (có/không) | Một dòng thu·giữ (vd sau tiết CSV→máy/LMS) | Phù hợp Vercel tức thời (có/không) | 3 chức năng tối thiểu.
Bắt buộc có kiểu: flashcard · đồng hồ nói · quiz lớp (thu tên+điểm, offline sau tiết) · poll Đ/S · ghép từ · xem handout đa ngữ · quiz làm lại câu sai · queue sheet GV · “kết quả lưu vĩnh trên URL” (phản ví dụ, không khuyến nghị).
Nguyên tắc: thu (kể cả định danh) có thể nên làm. Cấm là “để sổ điểm mãi trên URL công khai”.
Cuối: Top 3 nên làm hôm nay + một câu lý do (góc thu·tức thời).

성공하면 이렇게 보입니다

표에 취합·보관·Vercel 열이 채워지고, 동그라미 친 후보 1–2개가 있습니다.

닫는 성공 조건: #3

최소 웹 만들기

무엇을 하나요

고른 서비스를 Cursor로 HTML/CSS/JS 한 폴더로 만듭니다.

왜 하나요

완벽함보다 “링크로 열려 동작”과 “취합·정리 방법이 말로 설명됨”이 목표입니다. 제약을 프롬프트에 박아 공개 URL에 성적철이 남기지 않게 합니다.

따라 하기

1. 프로젝트 폴더를 하나 만듭니다(예: mini-service/).
2. 아래 프롬프트로 파일을 생성합니다.
3. 브라우저로 index.html을 열어 동작·취합 동선을 확인합니다.

그대로 붙여 넣을 말

고른 서비스: {서비스 이름} (교안: 초급 자기소개 차시).
정적 웹(index.html + 필요 시 style/script)으로 최소 동작을 만들어 줘.

필수 제약:
- 수업에서 이름(또는 학번)·점수를 모을 수 있게 해도 됨 (취합형이면 입력/표시 포함)
- 결과를 서버/공개 URL에 영구 저장하지 말 것. 브라우저에서 확인하고, CSV 다운로드 또는 “교사가 화면/파일로 가져감” 안내를 넣을 것
- 페이지에 “Vercel은 수업용 인스턴트 — 수업 후 결과는 PC/LMS로 옮김” 한 줄 안내
- 버튼·글자 크게(모바일·교실 뒤)
- 한국어 본문 + 베트남어 짧은 안내
- 맨 위 주석: 실행=브라우저로 열기, 배포=vercel, 결과=상시 온라인 보관 금지
초보도 이해하게 짧게.

Dịch vụ đã chọn: {tên dịch vụ} (giáo án: tiết giới thiệu sơ cấp).
Tạo web tĩnh tối thiểu (index.html + style/script nếu cần).

Ràng buộc bắt buộc:
- Được phép thu tên (hoặc mã SV)·điểm trên lớp nếu là loại có thu
- Không lưu vĩnh kết quả trên server/URL công khai. Cho xem trên trình duyệt + tải CSV hoặc hướng dẫn “GV mang đi bằng màn/file”
- Một dòng trên trang: “Vercel dùng tức thời trong tiết — sau tiết chuyển kết quả về máy/LMS”
- Nút·chữ to (mobile·cuối lớp)
- Thân KO + hướng dẫn VI ngắn
- Chú thích đầu: chạy=mở trình duyệt, triển khai=vercel, kết quả=không lưu online lâu
Ngắn, dễ hiểu cho người mới.

성공하면 이렇게 보입니다

로컬에서 동작하고, 취합이 필요하면 동선이 있으며, “수업 후 Offline/LMS” 안내가 보입니다.

안 되면

• 파일이 여러 개로 흩어지면: “한 폴더에 index.html만으로 되게 합쳐 줘”.

닫는 성공 조건: #3

Vercel로 배포

무엇을 하나요

같은 폴더에서 Vercel CLI로 공개 URL을 만듭니다.

왜 하나요

로컬 확인 후에만 올립니다. 재배포로 고친 내용도 같은 주소에 반영할 수 있습니다.

따라 하기

1. 터미널에서 프로젝트 폴더로 이동합니다.
2. vercel 또는 vercel --prod를 실행하고 안내에 따릅니다.
3. 나온 URL을 열고, 다른 기기(휴대폰)에서도 열리는지 확인합니다.
4. 설명문에 URL과 「취합 방식 / 보관: PC·LMS / Vercel: 인스턴트」를 적어 둡니다.

성공하면 이렇게 보입니다

https://…vercel.app 링크가 열리고, 팀원과 공유할 수 있습니다.

안 되면

• 로그인/권한 오류: 강사 안내에 따라 <code>vercel login</code> 후 재시도.
• 엉뚱한 폴더가 올라감: 프로젝트 루트(index.html 있는 곳)에서 다시 실행.
• 예전 화면이 보이면: 재배포 후 강력 새로고침(또는 시크릿 창).

닫는 성공 조건: #4

휴식

무엇을 하나요

쉽니다

왜 하나요

갤러리 준비

따라 하기

1. 공유할 URL과 「취합 방식 + 결과는 어디에 두나 + Vercel 인스턴트」한 줄을 메모합니다.

아이디어 갤러리

무엇을 하나요

팀별로 만든 서비스를 2–3분씩 보여 줍니다.

왜 하나요

같은 교안에서 출발해도 서비스 형태가 달라집니다. 서로의 URL이 다음 수업의 재료가 됩니다.

따라 하기

1. 말할 것 세 가지: 무엇을 · 왜 이 서비스 · 취합·보관을 어떻게 하는지(Vercel 인스턴트).
2. URL을 채팅/보드에 붙여 둡니다.
3. 바로 쓰고 싶은 아이디어 1개를 각자 메모합니다.

닫는 성공 조건: #3, #4

4일 회고 · 체크

무엇을 하나요

설계 관점 → 콘텐츠 → 내 서비스(배포·취합 관리)로 이어진 여정을 확인합니다.

왜 하나요

도구 이름보다 “배포하고, 취합하되, 온라인에 상시 두지 않는 습관”이 남습니다.

따라 하기

1. 성공 조건 1–4에 체크합니다.
2. 두 문장: 취합(식별 포함)은 한다 / 결과는 Offline·LMS로 옮기고 Vercel은 인스턴트.

닫는 성공 조건: #1, #2, #3, #4