flex originals

플렉스 원본

데모

프로젝트의 마이크로 서비스 아키텍처

Flex Originals 는 OpenSource 프로젝트입니다. 기부금을 환영합니다

특징

• ? 부트 스트랩 구성 요소 프레임 워크 없음 -Vue.js 로 클라이언트를 위해 작성하고 관리자 및 자체 설계 SCSS 스타일을 위해 react.js 로 작성되었습니다.
• ? 비디오 및 오디오 및 이미지 - 비디오, 오디오 및 이미지를 공유하십시오.
• ? 액세스 가능 - VTT 캡션 및 스크린 리더에 대한 완전한 지원
• ? 테마 - 어둡고 가벼운 테마.
• ? 청정 HTML- 올바른 요소를 사용합니다. <input type="range"> 볼륨의 경우 및 <progress> 진행>의 경우, <button> 버튼> 버튼의 경우 <버튼> s입니다. <span> 또는 <a href="#"> 버튼 해킹이 없습니다
• Responsive- 화면 크기와 함께 작동합니다
• ? 수익 창출 - 비디오에서 돈을 버십시오
• ? 스트리밍 - 스트리밍 재생
• ? API- 표준화 된 API를 통한 재생, 볼륨, 추구 등을 토글
• ? FullScreen- "전체 창"모드로의 폴백이있는 기본 전체 화면을 지원합니다.
• ⌨️ 바로 가기 - 키보드 바로 가기를 지원합니다
• ? Picture-in-Picture- Picture-in-Picture 모드를 지원합니다
• PlaysInline- playsinline 속성을 지원합니다
• ? 속도 컨트롤 - 즉시 속도를 조정하십시오
• 다중 캡션 - 여러 캡션 트랙을 지원합니다
• ? 미리보기 썸네일 - 미리보기 썸네일 표시를 지원합니다
• ? to️ Sass- 빌드 프로세스에 포함시킵니다

로드맵

1. UI 개선
2. 서버 향상
3. CDN을 개선하십시오
4. 플레이어 비디오 및 오디오를 향상시킵니다
5. Redis를 추가하십시오
6. 비디오 및 오디오 처리를 추가하십시오.
7. 분산 서버를 만듭니다.

프로젝트 설정 및 스크립트

1. ffmpeg
2. ngnix 서버
3. Docker & Compose
4. Mongodb

yarn 또는 npm 과 같은 yarn install 로 다음 스크립트를 실행할 수 있습니다.

스크립트	설명
install	프로젝트 설정
dev	핫 릴로드로 개발 서버를 컴파일하고 시작하십시오
build	생산을 위해 컴파일하고 최소화하십시오
prod	생산 서버를 시작하십시오
lint	전체 프로젝트를 위해 Eslint를 실행하십시오
test	모든 테스트를 실행하십시오
test:watch	시계 모드에서 테스트를 시작합니다

프로젝트 설정

마디

• Windows의 노드 설치는 공식 Node.js 웹 사이트에서 이동하여 설치 프로그램을 다운로드합니다. 또한 경로에서 git 사용할 수 있도록해야 npm .

• Ubuntu의 노드 설치 APT 설치로 NodeJS 및 NPM을 쉽게 설치할 수 있습니다. 다음 명령을 실행하십시오. $ sudo apt install nodejs $ sudo apt install npm

• 기타 운영 체제 공식 Node.js 웹 사이트 및 공식 NPM 웹 사이트에서 설치에 대한 자세한 정보를 찾을 수 있습니다. 설치가 성공하면 다음 명령을 실행할 수 있어야합니다 .m
  $ node --version

  $ npm --version npm 업데이트 해야하는 경우 npm 사용하여 만들 수 있습니다! 쿨합니까? 다음 명령을 실행 한 후 명령 줄을 다시 열고 행복하십시오.
  $ npm install npm -g

MongoDB 프로젝트 설정

컴퓨터에 mongodb를 설치하려면 이것을 따르십시오.

공식 MongoDB 웹 사이트

나침반 설치

• mongodb로 패키지 된 install_compass 스크립트를 사용하여 나침반을 설치할 수 있습니다.
  $ ./install_compass 이것은 플랫폼에 적합한 MongoDB Compass 패키지를 다운로드하여 설치합니다.

FFMPEG 프로젝트 설정

• 정적 빌드를 다운로드하십시오.
• 7-zip을 사용하여 선택한 폴더에서 포장을 풀어주십시오.
• 관리자의 권리로 명령 프롬프트를 열십시오. 참고 : cmd.exe를 사용하고 PowerShell을 사용하지 마십시오! 환경 변수에 액세스하기위한 구문은 4 단계에 표시된 명령과 다릅니다. PowerShell에서 실행하면 값이 잘못된 시스템 경로를 덮어 씁니다.
• 명령을 실행하십시오 (아래 참고 참조; Win10에서는 Windows 제어판의 환경 변수 영역 setx /M PATH "pathtoffmpegbin;%PATH%" 사용하여 경로를 업데이트 할 수 있습니다.)
• 우분투에 FFMPEG 설치
  
  sudo apt-get update
sudo apt-get install ffmpeg sudo apt-get install frei0r-plugins

기여

• 열린 문제?
• 문제에 대한 PR을 제작하십시오
• 저장소를 포크하고 별표
  
• repo를 복제하십시오 : https://github.com/NJACKWinterOfCode/flex-originals.git
  
• 실행 : npm install
• 개발 모드 실행을 시작하려면 : npm run dev
• Docker sudo docker-compose up --build -d Nginix 서버를 사용하여 포트에 프록시를 역전 시켜이 설정을 사용합니다.

저작권 (C) 2019, Anurag Kumar Anurag Kumar