Skip to content

README.md

Latest commit

 

History

History
145 lines (113 loc) · 5.11 KB

README.md

File metadata and controls

145 lines (113 loc) · 5.11 KB
Raw

Reel2gether

Kendi reel havuzundan rastgele içerik çekip arkadaşlarla senkron şekilde izleme odaları kurabileceğin, sohbet (chat) destekli, hafif ve hızlı bir web uygulaması.

Demo: https://reel2gether.vercel.app
Repo: https://github.com/lumiboi/Reel-2-gether

Özellikler

  • Rastgele Reel: Uygulamanın reel havuzundan tek tıkla rastgele içerik başlatma.
  • Senkron Oynatma: Oda içindeki tüm kullanıcılar için play/pause/seek hareketleri eşzamanlıdır.
  • Oda Sistemi: Oda oluşturma, odaya kod/link ile katılma.
  • Sohbet (Chat): Oda içi gerçek zamanlı mesajlaşma.
  • Host Kontrolleri: Oda sahibine özel yönetim (oynat, durdur, atla vb.).
  • Mobil Uyum: Telefon, tablet ve masaüstünde akıcı deneyim.

Not: Özelliklerin bir kısmı geliştirme aşamasında olabilir. Aşağıdaki Yol Haritası bölümüne göz atın.

Teknolojiler

  • Next.js + TypeScript – modern, hızlı, App Router yapısı
  • Tailwind CSS – komponentleri hızlıca stillendirmek için
  • Gerçek Zamanlı – (örnek) Firebase/Firestore veya WebSocket tabanlı senkronizasyon
  • İsteğe Bağlı Yardımcı Scriptler – repo’da yer alan Python betikleri (örn. indirme/işleme iş akışları)

Projede firebase.json, tailwind.config.mjs, eslint.config.mjs, tsconfig.json gibi dosyalar bulunduğundan, geliştirme ortamında bu araçlar hazırdır.

Başlangıç

1) Kurulum

# projeyi klonla
git clone https://github.com/lumiboi/Reel-2-gether.git
cd Reel-2-gether

# bağımlılıkları yükle
npm install
# veya: yarn / pnpm / bun

2) Ortam Değişkenleri

Yerelde çalıştırmadan önce .env.local dosyası oluşturun. Aşağıdaki anahtarlar, örnek bir Firebase kurulumu içindir; kendi anahtarlarınızı ekleyin. Firebase kullanılmıyorsa bu kısmı atlayabilirsiniz.

# Firebase (örnek)
NEXT_PUBLIC_FIREBASE_API_KEY=...
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=...
NEXT_PUBLIC_FIREBASE_PROJECT_ID=...
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=...
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=...
NEXT_PUBLIC_FIREBASE_APP_ID=...

# Senkron/Socket URL (kullanıyorsanız)
NEXT_PUBLIC_SOCKET_URL=http://localhost:3001

3) Geliştirme Sunucusu

npm run dev
# veya: yarn dev / pnpm dev / bun dev

Tarayıcıdan http://localhost:3000 adresine gidin.

Kullanım

  1. "Oda oluştur" ile yeni bir oda açın.
  2. Odadaki davet linkini veya kodu arkadaşlarınızla paylaşın.
  3. "Rastgele reel" butonuyla havuzdan içerik çekin.
  4. Oynatma/durdurma/ilerletme gibi kontroller tüm katılımcılara senkron uygulanır.
  5. Chat panelinden yazışın.

Proje Yapısı (özet)

Reel-2-gether/
├─ public/                # statik dosyalar
├─ src/                   # Next.js uygulama kaynak kodu
│  ├─ app/                # (App Router) sayfalar, layout, route handlers
│  ├─ components/         # UI bileşenleri
│  ├─ lib/                # yardımcı fonksiyonlar (api/client vb.)
│  └─ styles/             # global stiller
├─ main.py                # opsiyonel python yardımcı betik(ler)
├─ firebase.json          # Firebase yapılandırması (kullanılıyorsa)
├─ tailwind.config.mjs    # Tailwind ayarları
├─ eslint.config.mjs      # ESLint ayarları
├─ tsconfig.json          # TypeScript ayarları
└─ next.config.ts         # Next.js ayarları

Dizinler göstermek amaçlıdır; isimler ve yerleşim değişebilir.

Mimarî Notları

  • Senkronizasyon: Tek doğruluk kaynağı (host veya sunucu) üzerinden oynatma durumunu yayınlayın.
  • Oda Durumu: Oda kimliği (roomId), odaya katılan kullanıcılar, oynatma zamanı/durumu, aktif reel kimliği.
  • Dayanıklılık: Oda durumu kalıcı bir store’a (Firestore/Redis) yazılabilir; kullanıcı ayrılıp dönse dahi kaldığı yerden devam.
  • İzinler: Host dışındaki kullanıcıların seek/pause yetkisi opsiyoneldir; ayarlar odada tutulur.
  • Video Sunumu: Reel linkleri HLS/mp4 olabilir; cross-origin ve autoplay politikalarına dikkat edin.

Telif & İçerik

  • Reel havuzuna eklenen videoların paylaşım ve kullanım koşulları içerik sahiplerine aittir.
  • Sadece izinli ve uygun lisanslı içerikleri havuza ekleyin.
  • Kullanıcı gizliliği ve KVKK/GDPR gereklilikleri için açık ve erişilebilir bir gizlilik politikası sağlayın.

Komutlar

# geliştirme
npm run dev

# üretim derlemesi
npm run build
npm start

# lint
npm run lint

Yol Haritası

  • Oda ayarları: sadece host kontrolü / ortak kontrol modu
  • Emoji tepkileri ve izleme sırasına ekleme (queue)
  • Oda geçmişi ve yeniden oynat
  • Daha zengin moderasyon (kick/ban, oda şifresi)
  • Reaksiyon animasyonları ve küçük efektler
  • Basit yetkilendirme (örn. Firebase Auth veya magic link)
  • Testler (unit/e2e) ve CI

Katkı

Issue açabilir, PR gönderebilirsiniz. Kod stili için ESLint kuralları ve TypeScript tiplerini takip edin.

Teşekkürler

Bu projeye ilham veren açık kaynak kütüphaneler ve topluluklara teşekkürler.