flex originals

ต้นฉบับ Flex

การสาธิต

สถาปัตยกรรม Microservice ของโครงการ

Flex Originals เป็นโครงการ OpenSource ยินดีต้อนรับการมีส่วนร่วม

คุณสมบัติ

• - ไม่มีเฟรมเวิร์กส่วนประกอบ bootstrap - เขียนใน vue.js สำหรับไคลเอนต์และ react.js สำหรับผู้ดูแลระบบและสไตล์การออกแบบของตัวเอง
• - วิดีโอและเสียงและภาพ - แชร์วิดีโอเสียงและรูปภาพของคุณ
• - เข้าถึงได้ - การสนับสนุนเต็มรูปแบบสำหรับคำอธิบายภาพและตัวอ่านหน้าจอ VTT
• - ธีม - ธีมมืดและแสง
• - ทำความสะอาด HTML - ใช้องค์ประกอบ ที่เหมาะสม <input type="range"> สำหรับระดับเสียงและ <progress> สำหรับความคืบหน้าและดี <button> s สำหรับปุ่ม ไม่มี <span> หรือ <a href="#"> แฮ็คปุ่ม
• ตอบสนอง - ทำงานกับขนาดหน้าจอใด ๆ
• - การสร้างรายได้ - สร้างรายได้จากวิดีโอของคุณ
• - สตรีมมิ่ง - การเล่นสตรีมการเล่น
• - API - การเล่นสลับระดับเสียงการค้นหาและอื่น ๆ ผ่าน API มาตรฐาน
• - Fullscreen - รองรับ Fullscreen ดั้งเดิมที่มีโหมดทางเลือกกลับไปยังโหมด "Full Window"
• ⌨ ทางลัด - รองรับแป้นพิมพ์ลัด
• - Picture-in-picture- รองรับโหมดรูปภาพในภาพ
• PlaySInline - รองรับแอตทริบิวต์ playsinline
• - การควบคุมความเร็ว - ปรับความเร็วได้ทันที
• คำบรรยายหลายข้อ - รองรับแทร็กคำบรรยายหลายแทร็ก
• - ดูตัวอย่างรูปขนาดย่อ - สนับสนุนการแสดงตัวอย่างภาพขนาดย่อตัวอย่าง
• ? ‍♀ 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	รวบรวมและ minify สำหรับการผลิต
prod	เริ่มต้นเซิร์ฟเวอร์การผลิต
lint	เรียกใช้ ESLINT สำหรับโครงการทั้งหมด
test	เรียกใช้การทดสอบทั้งหมด
test:watch	เริ่มการทดสอบในโหมดนาฬิกา

การตั้งค่าโครงการ

โหนด

• การติดตั้งโหนดบน Windows เพียงแค่ไปที่เว็บไซต์อย่างเป็นทางการของ Node.js และดาวน์โหลดตัวติดตั้ง นอกจากนี้อย่าลืมมี git อยู่ในเส้นทางของคุณ npm อาจต้องการมัน (คุณสามารถค้นหา GIT ได้ที่นี่)

• การติดตั้งโหนดบน Ubuntu คุณสามารถติดตั้ง NodeJS และ NPM ได้อย่างง่ายดายด้วยการติดตั้ง APT เพียงเรียกใช้คำสั่งต่อไปนี้ $ 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 อย่างเป็นทางการ

การติดตั้งเข็มทิศ

• คุณสามารถติดตั้งเข็มทิศได้โดยใช้สคริปต์ sosted_compass ที่บรรจุด้วย MongoDB:
  $ ./install_compass สิ่งนี้จะดาวน์โหลดแพ็คเกจ MongoDB Compass ที่เหมาะสมสำหรับแพลตฟอร์มของคุณและติดตั้ง

การตั้งค่าโครงการ FFMPEG

• ดาวน์โหลดบิลด์แบบคงที่
• ใช้ 7-Zip เพื่อแกะมันในโฟลเดอร์ที่คุณเลือก
• เปิดพรอมต์คำสั่งพร้อมสิทธิ์ของผู้ดูแลระบบ หมายเหตุ: ใช้ cmd.exe อย่าใช้ PowerShell! ไวยากรณ์สำหรับการเข้าถึงตัวแปรสภาพแวดล้อมนั้นแตกต่างจากคำสั่งที่แสดงในขั้นตอนที่ 4 - การรันใน PowerShell จะเขียนทับเส้นทางระบบของคุณด้วยค่าที่ไม่ดี
• เรียกใช้คำสั่ง (ดูหมายเหตุด้านล่าง; ใน Win10 คุณอาจต้องการใช้พื้นที่ตัวแปรสภาพแวดล้อมของแผงควบคุม Windows เพื่ออัปเดตเส้นทาง): setx /M PATH "pathtoffmpegbin;%PATH%"
• การติดตั้ง ffmpeg ใน Ubuntu
  
  sudo apt-get update
sudo apt-get install ffmpeg sudo apt-get install frei0r-plugins

การบริจาค

• ปัญหาเปิด?
• เพิ่ม PRS สำหรับปัญหา
• แยก repo และแสดงมัน
  
• โคลน repo: https://github.com/NJACKWinterOfCode/flex-originals.git
  
• Run: npm install
• ในการเริ่มโหมดการพัฒนา Run: npm run dev
• สำหรับการผลิตทำงานใน Docker sudo docker-compose up --build -d ด้วย Nginix Server เพื่อย้อนกลับพร็อกซีไปยังพอร์ตใช้การตั้งค่านี้

ลิขสิทธิ์ (c) 2019, Anurag Kumar Anurag Kumar