Cursor, Python, Streamlit, GitHub 사용해서 TTS를 edgetts로 재생하는 App 배포하기

소개

한글과 영문 텍스트 음성재생하는 기능을 학습하기 좋은 앱 환경에서 하기위해 Streamlit과 GitHub를 사용했습니다.
초기 버전의 Cursor이 작성해준 PRD문서의 제안사항을 반영한 업그레이드 버전을 완성해서 앱에 적용하려고 했습니다.(디자인 개선과 유용한 기능 추가)

Tip: 사용한 프롬프트 전문을 꼭 포함하고, 내용을 짧게 소개해 주세요.

Tip: 활용 이미지나 캡처 화면을 꼭 남겨주세요.

Tip: 코드 전문은 코드블록에 감싸서 작성해주세요. ( / 을 눌러 '코드 블록'을 선택)

업그레이드 버전은 Cursor와 Python 입코딩으로 작성했는데 기존에 잘되던 기능이 안되는 경우가 자주 발생해서 몇번이나 잘되는 복사본을 사용해서 재시도하면서 Cursor에 다음과 같은 Prompt 표현을 사용했습니다. "다른 기능은 수정하지 말고 반드시 요청하는 것만 작성해줘"라고 반복해서 prompt에 사용했습니다.
완성된 업그레이드 버전으로 앱으로 배포하기 위해 GItHub와 Streamlit에 가입했습니다.
- 먼저 GitHub(https://github.com/)에 가입해서 배포할 파일들을 저장할 Repository를 만들었습니다.
- Repository에 작성한 Python 파일과 한글과 영문이 작성된 Excel 파일을 업로드했습니다.
- 다음에 Streamlit(https://streamlit.io/)에 가입했습니다.
- Streamlit에서 오른쪽 위의 create app을 선택하면 Deploy할 툴을 선택하게 되어 있는데 GitHub를 선택했습니다. (화면에서 제시되는 3가지 항목 중에 첫번째 항목 선택)
- 아래와 같은 화면에서 빨강부분은 직접 입력하는것이 아니고 연결된 GItHub의 항목을 선택하게 되어 있습니다. GitHub의 Repository를 연결해서 설정했습니다.
- 마지막의 App Url은 직접 입력하고 Deploy하면 앱 주소줄이 작성됩니다.
- 완성된 앱 주소줄입니다. https://korengstudy.streamlit.app/
- 웹에서 보는 화면이고 아래쪽은 핸드폰에서 앱에서 보는 화면입니다.

배운 점과 나만의 꿀팁을 알려주세요.

과정 중에 어떤 시행착오를 겪었나요?

도움이 필요한 부분이 있나요?

앞으로의 계획이 있다면 들려주세요.

시행착오 : 한번에 배포 주소를 얻을 수 없었습니다. 이유는 edge-tts시스템을 로드하지 못해서 였는데 Cursor에게 물어보니 requirements.txt파일을 만들어서 그안에 다음과 같은 내용을 입력하라고 해서 지시대로 했습니다. 이과정에서 requirements를 requirement라고 s를 빠트리고 작성해서 오류가 발생하는 상황을 몰라서 아래 내용을 다양하게 변경하는 시행착오를 수차례 겪었습니다.

streamlit
pandas
edge-tts==6.1.9
openpyxl
aiohttp
asyncio

Streamlit에서도 https://docs.streamlit.io/을 이용하면 오류에 대한 의견을 주는데 도움이 됩니다.
음성 재생 시스템이 앱에서 Curosr에서 개발한대로 잘 안되어 적당한 선에서 타협을 했습니다. 그래도 핸드폰에서 학습할 수 있어서 만족스럽고 시간이 되면 업그레이드 버전을 작성할 계획입니다.

14기 Cursor입코딩 스터디장님의 https://bit.ly/4aVUJCK 을 참고했습니다.