1. 비디오를 찍고 webm파일을 만들면 이 webM파일을 가지고 mp4로 변환할 거임.(변환 이유: 모든 기기들이 webm을 이해하지 못하기 떄문. 그래서 모두 이해 가능한 mp4로 변환)
2. 비디오에서 스크린 샷을 찍어 썸네일로 추가할 것임.

Introduction

1. 이 섹션에서 우리는 FFmpeg로 우리 webM비디오를 mp4로 변환시킬 것임.

2. FFmpeg를 이용해 비디오 썸네일을 추출할 것임.

3. 되게 실험적인 부분이 많은 section임.

FFmpeg

-> 세계 최고의 소프트웨어 중 하나. 비디오나 오디오 같은 어떤 종류의 미디어 파일을 다룰 수 있음.
예를 들어 비디오를 압축하거나, 비디오 포맷을 변환해야 하거나 아니면 비디오에서 오디오를 추출하고 싶거나, 비디오에서 스크린샷을 찍고 싶을 때 등 사용. 비디오를 가지고 할 수 있는 것들은 모두 할 수 있음.

-> C언어로 만들어졌고, 거의 모든 언어에서 사용 가능함. 또한 나의 콘솔에(터미널에) 설치 ㄱㄴ. 일반적으로 FFmpeg는 mongo처럼 터미널에서 실행돼야함. 무슨 의미냐면 컴퓨터 즉, 백엔드에서ㅜ 실행해야함. 우리가 webM파일을 다운로드할 때마다 변환하여 압축하려면 자체의 좋은 서버가 필요한데, 이는 돈이 들음.

-> 프로그램을 이용하기 때문에 FS(파일 시스템)을 이용할 수 있고, 여기에 파일을 작성하거나 불러올 수 있음

-> 실제 유튜브에서는 업로드된 비디오를 그들의 비싼 서버에서 변환할 것임.

webAssembly

-> 좋은 서버를 이용하면 돈이 드는 걸 방지위한 대비책. 개방형 표준이고, 기본적으로 웹사이트가 매우 빠른 코드를 실행할 수 있게 해줌. 이 모든 것들은 원래는 백엔드에서 쓰는 것임.
이 웹에섬블리는 프론트엔드에서 매우 빠른 코드를 실행할 수 있게 해줌(webassembly 덕분에 프론트엔드에서 사용 ㄱㄴ). JS를 이용하지 않고, 다른 종류의 프로그램을 사용할 수 있음. 대부분 webAssembly를 직접 작성하지 않고, webAssembly로 컴파일 되는 go 또는 Rust를 작성하게 될 것임. 실행 비용이 큰 프로그램들을 브라우저에서 실행할 수 있는 거임.

우리가 할 것

1. webAssembly와 FFmpeg 두 가지 개념을 결합시키는 것임.
2. 우리가 할 것은 ffmpeg.wasm을 사용하는 것임. ffmpeg.wasm은 비디오를 변환하기 위해 사용자의 컴퓨터를 사용함.
3. 지금 우리가 할 것은 사용자의 브라우저에서 비디오를 변환하는 것임. 우리는 컴퓨터의 처리 능력을 사용할 것임.
4. 우리는 webAssembly를 이용해 FFmpeg를 실행하도록 할 것임.(FFmpef는 C언어 프로그렘이고, webAssembly를 사용하면 브라우저에서 FFmpeg를 사용할 수 있게 해줌.)

ffmpeg.wasm 설치

npm install @ffmpeg/ffmpeg @ffmpeg/core

ffmpeg.wasm