COFFEE — 커피 파이썬 실행기

어떤 도구인가요

COFFEE 커피 파이썬 실행기는 브라우저 탭 하나에서 Python 코드를 쓰고 바로 실행해 결과를 보는 작업 공간입니다. 유튜브 채널을 운영하는 개인 고객이 의뢰하신 프로젝트로, 채널을 찾아온 사람들이 설치 없이 바로 Python을 써 볼 수 있는 실습 공간이 목표였습니다.

풀어야 했던 과제

코딩을 처음 배우는 사람이 가장 많이 막히는 곳은 의외로 코드가 아니라 설치 단계입니다. Python을 내려받고 환경을 설정하다 지쳐 포기하는 경우가 많습니다. 그래서 '주소만 열면 바로 실행'을 첫 번째 조건으로 두고, 서버 비용 부담 없이 오래 운영할 수 있어야 한다는 점을 두 번째 조건으로 잡았습니다.

이렇게 만들었습니다

1. 서버가 아닌 브라우저에서 Python 실행

Python 실행기를 서버에 두면 사용자가 늘수록 비용과 보안 부담이 커집니다. 대신 Python을 웹 브라우저 안에서 돌릴 수 있게 만든 Pyodide를 써서, 코드는 각 사용자의 기기에서 실행되도록 했습니다. 서버는 화면 파일만 전달하면 되므로 Cloudflare Pages의 정적 호스팅으로 운영할 수 있습니다. 상단에는 'Python 엔진 준비 완료' 상태를 보여줘, 처음 불러오는 동안 기다려야 한다는 것을 알 수 있게 했습니다.

2. 처음 쓰는 사람을 위한 장치

• 'Hello COFFEE', '반복문', 'input() 사용' 예제 버튼으로 한 번에 예제 코드를 불러오기
• input()을 쓰는 코드를 위해 입력값(stdin)을 미리 적어 두는 칸
• 실행은 Ctrl/Cmd+Enter, 저장은 Ctrl/Cmd+S 단축키
• 결과 복사·지우기 버튼

3. 저장과 백업은 사용자의 브라우저에

회원가입 없이 쓰는 도구라 코드는 사용자의 브라우저에 저장됩니다. 대신 브라우저 데이터를 지우거나 다른 기기에서 열면 코드가 보이지 않는다는 점을 화면에 분명히 안내하고, .py 파일 내려받기·불러오기와 전체 데이터를 JSON으로 백업·복원하는 기능을 함께 넣었습니다. 편리함과 데이터 보존 사이의 한계를 숨기지 않고 해결 방법까지 주는 것이 중요했습니다.

4. HTML도 함께

Python 탭 옆에 HTML 탭을 두어, HTML을 작성하고 미리보기로 바로 확인할 수 있게 했습니다. 실습 내용이 웹 화면 만들기로 넘어가도 같은 도구 안에서 이어갈 수 있습니다.

만들고 나서

상단에는 운영자님의 유튜브 채널을 안내하는 영역을 두어, 도구를 쓰는 사람이 강의 영상으로 자연스럽게 이어지도록 했습니다. 개인정보처리방침도 함께 갖췄습니다.