brunch

You can make anything
by writing

C.S.Lewis

by 이종복 Jun 09. 2019

video upload & create(2)

이번 글은 이전 글에 이어서 video upload & create에 대해서 다루겠습니다. 


1) 우선, postUpload 컨트롤러에 다음과 같은 코드를 추가해줍니다. 

     이 코드는 파일이 성공적으로 업로드되었을 때, 

     콘솔창에서 확인할 수 있도록 하는 목적이 있습니다.

  


2) localhost:3000/videos/upload 페이지로 이동해서 

      (1)파일 선택을 누르고

      (2)새로운 동영상을 선택하고

      (3)Upload Video를 클릭합니다.  


3) 다음과 같이 upload가 잘되었고,

    비디오 파일과 관련된 정보가 출력됨을 확인할 수 있습니다. 


4) 또한 다음과 같이 videos 폴더가 생성되고, 파일의 path가 기록됨을 확인할 수 있습니다. 


5) 다음은 postUpload 컨트롤러로 이동해서, 코드를 다음과 같이 수정해줍니다. 

     이 코드의 의미는 다음과 같습니다. 

     (1) 앞의 upload를 통해서 파일의 url, 즉, path를 알게 되었기 때문에,  

           const file: {path}를 추가해줍니다. 
     (2) const newVideo를 선언해줍니다. 여기에는 fileUrl, title, description이 포함됩니다.

     (3) console.log(newVideo)를 추가해줌으로써, 실행의 결과를 확인할 수 있게 합니다.

     (4) upload가 완료되면, res.redirect(routes.videoDetail(newVideo.id)로 다시 연결해줍니다.   


6)다시 localhost:3000/videos/upload 로 이동해서 

   비디오 파일을 추가해주면 


7) 다음과 같이 Video Schema에 만들었던 정보들이 출력되는 것과 


8) videoDetail 페이지로 이동하는 것을 확인할 수 있습니다. 

"다음은 노마드코더(https://academy.nomadcoders.co/)의 [초급 풀스택] 유튜브 클론 코딩 강의를 참고하였습니다."

매거진의 이전글 video upload & create(1)
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari