Enjoy Programming

이전 포스팅의 문제를 해결해보자 현재 4000번의 포트로 연결하고 있는데 문제는 이포트는 Herokurk 열어준 포트가 아니다. heroku가 준 포트로 연결해야 한다. 에러 문구를 보면 heroku가 준 port 변수가 있다. 포트 변경을 해주자. 환경변수 접근을 통해~ 접근해주는데 env.PORT의 Port는 heroku 가 준 포트이다. 고로~ heroku로 접속하지 않으면 4000번으로 접속하도록 코드를 작성했다. 이게 궁금했는데~~ 왜냐 배포를 하고나면 개발은 무슨 포트로하지;;; 라는 생각에 ㅋ 좋다~ 코드 변경을 했으니 commit과 push를 하자. git commit -m "내용" git push origin master && git push heroku master 커밋 후 로그를 보면..

계정은 이미 있고 로그인하면 project를 만들 수 있다. 만들어 보자~ 프로젝트 명을 적어주고 cluster를 추가해준다. cluster는 database group같은 건데 지금은 하나다. 역시 무료다! 지역을 선택해주고~~ 미국 버지니아 좋다 이것도 무료~!~!~!~! 그리고 생성! 좀 기다려야 한다~~ 만들고 있다~~~ 오래걸린다.. 한 3분 지난거 같은데;.... 1~3분은 믿지말자... 완료!!! 이제 connect버튼을 클릭해주고~ 접속가능한 ip를 적어주는 란이 있는데 .. 음 여기저기 돌아다니면서 공부하기 때문에 필요없다... 그리고 username과 password를 생성해주자~ password는 매우 중요하니 잘 기억하자~! 아주 어렵게 만들고~ 난 따로 저장 해두었다. 그리고 이버..

https://signup.heroku.com/ Heroku | Sign up Free account Create apps, connect databases and add-on services, and collaborate on your apps, for free. Your app platform A platform for apps, with app management & instant scaling, for development and production. Deploy now Go from code to running app in signup.heroku.com heroku 사이트에 가서 계정을 먼저 생성하자. 계정생성후 create app을 통해 app을 하나 만들어준다. 이렇게 만들어졌다. hero..

이제 프론트엔드쪽을 빌드 할텐데. webpack에는 development, production, none모드등이 있다. 프론트엔드 클라이언트를 빌드할텐데 현재 webpack conifg은 mode가 development로 되어있다~ dev와 build 스크립트할때 두가지를 다르게 주고싶은데 webpack config의 mode를 지워주고 script에서 실행시 명령어로 전달해주도록 하자. 요롷게~~~ 명령어를 작성해 전달할 수 있다. 두가지다 실행시 매우 잘 실행된다~~` 차이점은 위는 dev모드 이고 이건 production모드 이다. 압축되어있다~~~ 한가지 수정해야하는데 현재 build에서도 watch가 실행되고 있다~ 역시 webpack config에서 watch:true를 삭제하고 command..

일단 유튜브 클론과정은 거의 끝났다 ~ 내가 직접 몇개의 라우터를 더 만들 예정이고~ 홈페이지 디자인도 손보고~ 몇가지 자바스크립트도 추가할예정이고~ 로직도 손보고 있다. 마지막 챌린지였던 댓글 삭제기능은 구현되었고~ 그런데 포스팅을 못했다.. 포스팅할게 너무 밀려있다.. ㅠㅠ 차분히 하자.. 현재는 개발자 모드로 개발을 하고 있었고 이제 실제 배포를 해볼차례이다. Heroku를 통해 배포를 한다. Heroku란 무엇인가~ Heroku는 java, node.js, python등 여러 언어를 지원하는 웹 어플리케이션 배치 모델로 사용되는 클라우드 paas이다. paas? Platform as a Service- 서비스형 플랫폼 : 클라우드 컴퓨팅 서비스 분류 중 하나. 일반적으로 앱을 개발하거나 구현할 때..

이번에는 썸네일을 만들어서 영상의 첫프레임이나 1초의 스크린샷을 찍어서 jpg파일로 저장해서 쓴다. 역시 인풋에 해당 파일을 넣어주고~ -ss는 영상의 특정시간대로 갈 수 있는 명렁어인데 1초로 지정한다. 그리고 -frames:v는 스크린샷을 찍을 수 있게 해주는데 1로 지정한것은 첫번째 프레임임을 지정한 것이다. 마지막으로 파일시스템의 메모리에서 만들어주는 썸네일.jpg를 생성해준다. 다시 녹화를 하고 진행하면~ 콘솔창에 mjpeg파일이 생성된 것을 확인할 수 있다. 이제 영상을 받을때와 똑같이 해주면 된다~!~! arraybuffer처리와 blob처리~ 그리고 url만들어주고 역시 fake link만들어서 다운로드 할 수 있도록~!~! 짜잔~~!~! 썸네일도 생성되어서 다운로드 된다~! 마지막으로 파..