나만의 무기 : HIGHLIGHTING/개발 일지 35

Day ~38 : 마무리 작업, 최종발표

최종 발표 토요일까지 남은 기간은 마무리 작업을 하며 보냈다. 프론트의 마무리 작업을 앱에 merge하고, 포스터 세션에 보여줄 포스터를 만들고, 발표에 못오시는 분들을 위한 홍보 영상도 만들고, 최종 리허설에서 지적받은 디테일들을 고치고. 딱 하나 대공사가 있었다면, 발표 PPT의 포커싱 팀원들 모두 한게 많다보니 모든걸 다 담고싶어서 이걸했다 저걸했다 잔뜩 담았는데, 그 결과 '아 뭔가 열심히 했구나 근데 그게 뭔진 모르겠어' 같은 감상을 받으셨다고 한다. 운영진도 멘토님도 비슷한 느낌이라 그부분을 많이 뜯어고쳤다. 이게 시연 이후의 발표 후반부를 거의 다 갈아엎는 수준의 대공사였다보니, 발표 퀄리티에도 좀 타격이 있었다. 안그래도 발표를 못하는 몸이라 거의 발표 흐름을 외우는 수준으로 머리에 때려넣..

Day 35 : 트위치로 서비스 확장(실패)

내가 코딩을 할 부분은 전날의 컷 내보내기 구현으로 다 끝났고, 프로젝트도 거의 끝난 마무리 단계 프론트의 마무리 작업이 끝나면 결과물을 데스크탑 앱에 merge하는 일만 남은 상태에서, 이를 기다리며 발표 시연 준비를 하고 있었다. 그런데 생각할수록 뭔가 좀 걸림 인터넷 방송을 타겟팅으로 하는데 트위치는 안되고 유튜브만 된다는게 대체... 초기단계에서 트위치의 영상 전송이 느려도 너무 느려서 유튜브 기준으로 가자고 진행했는데, (우리 문제가 아니라 트위치가 원래 서비스 품질이 나쁘다...) 그래도 이제 할거 다 했으니 트위치도 구실은 갖춰야 하는게 아닐까 하는 미련 그래서 남는 시간에 슬쩍 코드를 뜯어고쳤다. 클라이언트의 홈페이지에서 유튜브 다시보기 링크의 유효성을 검증하고 id 포함 링크를 가져가는 ..

Day 34 : 로컬 영상파일 cut 기능 구현

서버-클라이언트 구조의 웹서비스였을 때의 컷 내보내기 기능 : 버튼을 누르면 컷 구간 정보대로 영상을 잘라주는 exe가 다운로드됨 이걸 실행하면 로컬의 영상파일이 잘린다 아카이브 영상으로부터 다운로드를 제공하자니 정책 위반이고, 웹서비스에서 로컬 파일에 FFmpeg을 돌리자니 여러모로 곤란해서 이런식으로 좀 사용성이 떨어지는 방식의 구현을 택했는데, 마무리 발표에서 사용성이 떨어진다는 지적을 받았다. 하지만 일렉트론 기반 데스크탑 앱이 되었으니, 로컬 파일을 쓱싹 자르는 것도 손쉬운 일 그래서 영상을 고르면 직접 잘라서 파일을 주는 기능을 구현하기로 했다. 백그라운드 스크립트는 어려울게 없다 그냥 늘 해왔던 것처럼 FFmpeg으로 input file을 구간대로 잘라주는 코드를 작성 사실 어려운건 없었어도..

Day 33 (2) : electron IPC를 이용한 파이썬 스크립트 실행 백그라운드 구현

19일 현재 프로젝트는 성공적으로 끝났고, 이력서와 자기소개서 작성, 이력서에 링크만 걸어두고 미완성이던 노션 페이지들 완성, 면접 등등 이것저것 하다보니 딱 일주일이 지났다 이제 쓰다만 일지를 마저 정리해서 유종의 미를 거둬보자. https://uneducatedjungler.tistory.com/186 Day 33 (1) : electron IPC 구조 설계 다시 일렉트론으로 돌아와서 전날 이해한 Backgound, Electron main, App 삼자간의 IPC 정보교환 구조를 우리 서비스에 구현해보자 지금은 axios로 서버와 통신하는 부분이 그대로 남아있어, 브라우저는 el uneducatedjungler.tistory.com 다시 33일차로 돌아와서, 저녁에 일어나서 다시 돌아와 백그라운드를..

Day 33 (1) : electron IPC 구조 설계

다시 일렉트론으로 돌아와서 전날 이해한 Backgound, Electron main, App 삼자간의 IPC 정보교환 구조를 우리 서비스에 구현해보자 지금은 axios로 서버와 통신하는 부분이 그대로 남아있어, 브라우저는 electrondml window로 바뀌었지만 클라이언트가 하는 일은 똑같다 이걸 서버가 하는 일까지 클라이언트 선에서 끝내는 서버리스 데탑앱으로 만든다면 웹서비스였을 때 클라이언트가 서버에 요청을 보내던 부분은 전부 IPC로 구현할 필요가 있다. 그런데 여기서 서버리스 데탑앱일때 있을 의미가 그닥 없는 로그인 등의 기능은 빠지고 남는 요청들이 뭐가 있나 하니 처음 링크를 입력했을 때의 분석 요청 키워드 검색 요청 다운로드 요청 이 세개가 남는다 그래서 구현해야 할 것은 4개 App이 ..

Day 32 (3) : 스프라이트 이미지 서버 배포

https://uneducatedjungler.tistory.com/181 Day 30 (2) : 컷 썸네일용 스프라이트 이미지 생성 로직 일렉트론으로 한참 삽질을 반복하던 중 뭔가 만들어달라는 요청이 왔다 지난 발표 시연에서는 구현하지 못해 그냥 유튜브 로고가 있는 이미지로 대체했던 부분인데, 북마크한 컷 각각에 어떤 uneducatedjungler.tistory.com 며칠전 이런걸 만들었는데, 이 로직으로 만든 이미지파일 하나를 샘플로 써서 프론트에서 스프라이트 이미지의 픽셀을 잘 포인팅해서 필요한 부분만 갖다쓰는 로직을 완성했다 실제 클라이언트에서는 서버에서 정적 파일 형태로 오픈해두면 읽어다가 쓴다고 한다 그래서 이제 분석 요청이 올때마다 서버의 static 경로에 이미지파일을 올려주는걸 구현할..

Day 32 (2) : portable python을 패키징한 electron build

어제 낮 11시에 마지막 글을 썼는데 글을 쓰고나니 문제가 생겨서 13시가 넘어서까지 버티다가 자러갔다 심지어 완전히 해결도 못하고 감... 안그래도 망해버린 수면패턴을 여기서 더 망쳐버린 그 문제가 뭔고 하니 여기의 이 pythonPath 다른건 다 알겠는데 이게 뭔가 싶어서 검색해보니 pythonShell에서 실행할 파이썬의 경로 세팅이었다 이게 python3로 되어있다는 것 > electron build된 exe를 가지고 데탑앱을 실행하는 유저는 파이썬이 없기 때문에 에러가 날 것이다 아... ffmpeg-python이 python으로 실행할 수 있게 해줄뿐 ffmpeg을 대신해주진 않는 것처럼 python-shell도 python을 실행할 수 있게 해줄뿐 설치는 사용자의 몫이었다 그말은 즉 ele..

Day 32 (1) : electron IPC, pythonShell 사용 연습

분명 잠을 안잤는데 Day가 바뀜... 주말안에 다 해야 발표자료랑 세션에도 넣고... AWS에 배포할것도 줄이고... 이것저것 하는데 갈길이 너무 멀다 https://medium.com/heuristics/electron-react-python-part-1-introduction-b228ccf8e889 Electron + React + Python (Part 1) — Introduction From Development to Production medium.com 참고한 내용 원리 : 일단 눈에 보이는 쪽(CRA)은 electron이 뷰어로 보여준다 근데 여기에 hide된 프로세스를 하나 더 생성해서, 거기에는 pythonShell로 필요한 모든 .py 로직을 실행하는 스크립트를 담는다 (scripts..

Day 31 : Client를 일렉트론으로

전날의 무수한 삽질이 그래도 성과가 있어서, 어떻게 잘 개발하면 가능은 하다는 검증은 됐다. 그걸 내가 할수 있을지는 다른 문제지만... 개발은 일단 크게 두단계로 나눠야 할 것 같다 1. CRA 클라이언트를 전부 electron으로 옮기기 2. electron에 서버단의 파이썬 로직까지 이식하기 먼저 1. 이렇게 빈 CRA를 빌드하는게 성공했으니, 여기다가 우리 개발해둔 컴포넌트를 다 갖다붙이면 되지 않을까 라는 생각 많은 일이 있었지만 결국 잘 된다 에러메세지 하나하나 구글링하면서 에러가 안나올때까지 해결하면 언젠가 된다 인디언식 기우제 최고 그럼 이걸 빌드해서 나온 exe도 잘 될까? 안된다ㅋㅋ 에러라도 나오면 좋을텐데... 빌드한 뒤에는 개발환경도 뭐도 아니고 그냥 exe라서 그저 흰화면 또다시 ..

Day 30 (2) : 썸네일 스프라이트 이미지 생성 로직

일렉트론으로 한참 삽질을 반복하던 중 뭔가 만들어달라는 요청이 왔다 지난 발표 시연에서는 구현하지 못해 그냥 유튜브 로고가 있는 이미지로 대체했던 부분인데, 북마크한 컷 각각에 어떤 장면인지 썸네일이 보이면 좋을거라는 의견이 있었다 구현방법으로 떠오른건 두 방향이 있었는데 1. 분석에 쓴 영상파일 삭제하지 않고 갖고있다가 컷 북마크될때마다 클라가 요청을 보내고 이미지 만들어서 보내주기 2. 분석할때 스프라이트 이미지도 만들어서 같이 보내주기 1은 서버에 남은 영상을 언제 지울지, DB에서 불러온다면 영상이 없을텐데 굳이 새로 받을지 등등의 문제도 있고, ffmpeg이 돌아가는동안 클라이언트가 굳어있을수도 없는 노릇이라 비동기 처리로 구현해야했는데 이게 좀 애매했다 분석 결과를 비동기처리로 실시간 받아보자..