https://www.conansjh20.com 

 

J-POP 가사나라

일본 노래 가사 검색 및 독음 한글발음 번역 제공

www.conansjh20.com

 

React - Flask - MySQL 을 이용하여 만든 웹앱입니다.

직접 도메인부터 서버 운영 그리고 여러 API서비스 및 파이썬 라이브러리를 이용한 단순해 보여도 그동안 배워온 코딩 기술들을 갈아넣어 만들었습니다.

 

사람들이 많이 이용만 한다면 게시판 서비스도 추가해서 일본 음악을 좋아하는 사람들의 커뮤니티까지 만들고 싶지만 아직은 요원해 보이네요.ㅎㅎ

 

일단 프론트엔드는 React를 사용하였습니다.

 

react-router-dom 라이브러리를 사용하여 페이지간 이동을 하였는데 이경우 최상위 주소 www.conansjh20.com/ 가 아닌 다른 페이지 www.conansjh20.com/searchsong/  같은 하위 페이지로 직접 주소창에 입력하여 이동하려고 하면 404에러가 발생하였고 한참을 헤맸는데 결국 아주 간단하게 flask_app.py 에서 그냥 경로만 추가해주면 되는 것이었네요...

 

그리고 static 경로 관련해서 pythonanywhere 서버에서 지정하는 경로 react에서 지정하는 경로 flask에서 지정하는 경로가 모두 있어 어떤 지정 경로를 먼저 따르는지 우선시 되는지 헷갈려서 static file들 관리도 좀 헤맸습니다.

 

그리고 웹앱의 각 기능들을 구현하기 위하여 파이썬의 구글 api(번역, 유튜브), 스포티파이 api, mecab(자연어 형태소 분석) 등 여러 파이썬 라이브러리를 사용했습니다.

 

항상 프로젝트를 시작할때는 향후 업데이트가 쉽도록 처음부터 정확히 제대로 깔끔하게 작성하려고 하지만 항상 중반에 들어서면 그냥 되는대로 지금 막히는 것만 해결하는데 급급하여 나중에는 뭐가 뭔지 모를정도로 다 복잡하게 얽혀있어서 기능 하나 추가하는 것에 대해서도 큰 작업이 되고 맙니다. 또한 계속해서 반복되어 있는 기능들, 똑같은 기능에 토시하나 틀리다고 함수를 하나 더만들고, 주석은 안쓴지 오래...

 

하지만 아주 조금씩은 코딩 습관의 개선이 되는 것을 느끼기도 하여 즐겁기도 합니다.

 

아직도 아쉬운 부분도 있지만 당분간은 React 홈페이지는 좀 쉬어야 겠습니다.

+ Recent posts