kedutan multi-aliran
Proyek reaksi/redux untuk melihat beberapa aliran kedutan secara bersamaan!
Ringkasan
Sasaran: Membuat aplikasi satu halaman dengan react + redux + immutableJS yang memungkinkan pengguna mengonfigurasi jumlah jendela berapa pun di browser.
Contoh untuk dilihat sebagai inspirasi
- http://kadgar.net/live/
- http://multitwitch.tv/
- https://multistre.am/
Daftar Perbaikan/Fitur
- Pilih X jumlah aliran berdasarkan nama saluran untuk dimasukkan ke dalam tampilan kisi yang dapat dikonfigurasi
- Tampilan responsif dengan jendela hapus streaming
- Dapatkan daftar saluran untuk pelengkapan otomatis
- Dimensi jendela yang dapat dikonfigurasi
-
react-grid-layout
, atau coba masonry
sebagai contoh cara mengintegrasikan lib non-reaksi pihak ketiga ke dalam reaksi
- Saluran tetap di seluruh penyegaran halaman penuh (status penyimpanan lokal)
- Pengikatan tombol untuk membisukan/membunyikan -> membuka layar penuh lebih cepat
- Obrolan terpadu untuk menyiarkan pesan yang sama ke seluruh subkumpulan aliran yang terlihat
Kodez
Siapkan instance aws untuk taman bermain publik
Tambahkan babel-eslint
Tambahkan Tema (pilih kerangka gaya css/inline)
Tambahkan tema dasar- Lihatlah kerangka css lain untuk gaya inline
Tata letak dasar dan alur kerja dengan react-router v4
Tambahkan Redux
Tambahkan konfigurasi toko Tambahkan perancah toko immutableJS Tambahkan pengkodean transit-js untuk data immutableJS
Bertahan di penyimpanan lokal Muat dari penyimpanan lokal
Tambahkan klien Ambil
Tambahkan pembungkus klien di atas pengambilan Tambahkan redux-saga dengan middleware saga Tambahkan integrasi TWITCH API untuk kueri saluran Tambahkan integrasi YOUTUBE API untuk kueri saluran Tambahkan GOOGLE URL Shortener untuk berbagi konfigurasi tata letak
Dialog bantuan
Tambahkan modal dialog bantuan- Isi konten bantuan dan petunjuk penggunaan
Bagikan dialog dan integrasi penyingkat tautan Google
Tambahkan dialog berbagi dengan kolom input yang menampilkan tautan url google singkat dari data tata letak dari toko Tambahkan API pemendek url Google dengan saga
Muat konfigurasi bersama dari tautan
Tambahkan halaman arahan untuk hal-hal yang dapat dibagikan Tambahkan kontainer muatan yang mengambil konfigurasi dari url dan memasukkannya ke dalam status tata letak saat ini untuk pengguna.
Fitur Tata Letak Aliran
Integrasikan react-grid-layout
untuk tata letak grid yang dapat dikonfigurasi Integrasikan Twitch Player dan Youtube Player untuk melihat video atau streaming langsung- Tambahkan widget aliran kosong
Tambahkan tombol dari Navbar Seret dan lepas tautan atau aliran video ke dalam wadah- Bidang masukan untuk menyalin dan menempelkan referensi tautan
Hapus semua widget di tata letak Hapus widget individual dari tata letak- Ubah Kualitas Video di semua streaming
- Bisukan / Suarakan di semua aliran
- Tampilan Acak untuk tata letak
- Tambahkan tombol sakelar ke tampilan acak