Proje — 002

Gamerflix - Streaming Service Rehberi
Nasıl Yaptım?

Rol Full-Stack Geliştirici & Tasarımcı
Süre 2 Hafta
Kullanılan Teknolojiler
HTML CSS PHP

Fikrin Doğuşu

Bu projeye başlamadan önce elimde sadece bir fikir vardı: Netflix yada diğer Streaming hizmetleri gibi bir site yapmak istiyordum ama oyunlar için. Oyun dünyasında, özellikle de hikaye odaklı oyunlarda, oyuncular genellikle oyunun atmosferini, karakterlerini ve dünyasını daha derinlemesine keşfetmek isterler. Ancak, bu tür içerikler genellikle dağınık ve erişilmesi zor olabilir. Ben de bu boşluğu doldurmak için kolları sıvadım. ve böylece Gamerflix adında Projeye giriş yapmış oldum.

Projeyi sıfırdan planlarken kendime şu soruyu sordum: "Oyunculara sadece bilgi vermekle kalmayıp, aynı zamanda oyunun dünyasına dalmalarını sağlayacak bir deneyim nasıl yaratabilirim?" ve Netflix Tarzı Bir Oyun Platform İlginç Olurdu.

"Tüm Oyunlar, Tek Platform. Oyunları Keşfetmenin Yeni Yolu. Gamerflix ile Oyun Dünyasına Dalın."


Yaptığım sitenin videosuna Buradan Ulaşabilirsiniz

Tasarım Süreci

Tasarımı netflix gibi değil, oyunlar tarzında yapmaya karar verdim, çünkü hedef kitlem oyun severlerdi ve onların ilgisini çekecek bir estetik yaratmak istedim. Netflix'in minimalist ve temiz tasarımından ilham alsam da, Gamerflix için daha karanlık, atmosferik ve görsel olarak zengin bir yaklaşım benimsedim. Renk tonlarını özenle seçtim ve görsel hiyerarşi oluşturmak için kontrastı kullandım. Ana sayfada büyük, çarpıcı görsellerle oyunları öne çıkardım, detay sayfalarında ise daha fazla metin ve bilgi sunarak oyuncuların merakını gidermeye çalıştım.

CSS ve PHP ile Bileşen Mimarisi

Arayüzü PHP ve CSS ile geliştirdim. Giriş yapma ve kayıt olma gibi temel işlevler için ayrı PHP dosyaları oluşturdum. ve Localhostta çalıştırdım. Böylece, kullanıcıların siteye kaydolup giriş yapabileceği basit bir sistem kurmuş oldum. Bu, projenin interaktif yönünü güçlendirdi ve kullanıcıların kendilerini daha fazla dahil hissetmelerini sağladı.

PHP ve Sunucu Tarafı

Sunucu tarafında PHP'yi iki farklı amaçla kullandım: Giriş yapma ve kayıt olma işlemlerini yönetmek, ve oyun detay sayfalarında dinamik içerik sunmak. Kullanıcıların girdiği bilgileri işlemek ve doğrulamak için PHP'nin form işleme yeteneklerini kullandım. Basit bir kullanıcı doğrulama sistemi kurarak, kullanıcıların güvenli bir şekilde giriş yapmalarını sağladım. XAMPP kullanarak MySQL veritabanında kullanıcı bilgilerini sakladım. Bu süreç, sunucu tarafı programlamanın temellerini anlamamda büyük bir adım oldu. Ayrıca, PHP ile dinamik içerik sunarak, her oyun detay sayfasının benzersiz ve zengin bilgilerle dolu olmasını sağladım. ve Tablodaki email ve şifre uyuşuyorsa Giriş yapılacak şekilde kod yazdım. Deneme olarak bir oyun videosunu indirdim ve videoları saklamak için Google Cloud Console kullandım, ve PHP ile videoları sayfaya gömdüm, böylece kullanıcılar oyun videolarını doğrudan site üzerinden izleyebiliyorlar.

Güvenlik tarafında kullanıcıdan gelen tüm girdiler htmlspecialchars() ile sanitize edildi. Doğrudan veritabanı sorgusu olmasa da bu alışkanlığı edinmek, ileride daha büyük projelere geçişte sağlam bir temel oluşturuyor.

"Her detayını düşünerek işi yapmak daha fazla öğrenme sağlar."

Responsive Tasarım

Responsive yaklaşımı "mobil önce" prensibiyle uyguladım. Önce küçük ekran için temel düzeni kurdum, ardından media query'lerle genişleyerek masaüstü görünümüne ulaştım. Bu yöntem, mobil deneyimi ikincil bir düşünce değil, tasarımın çekirdeği haline getirdi.

Karşılaştığım Zorluklar

En büyük zorluk, Giriş yapma ve Kayıt olma olayıydı, email ve şifre yazdıktan sonra kayıt yapıldıktan sonra emaile, gelen sistemi kurmaktı, ve XAMPP de MySQL kullanarak basit bir kullanıcı tablosu oluşturdum. PHP ile form verilerini işleyip doğrulamak, ve kullanıcıların güvenli bir şekilde kayıt olmalarını sağlamak için kod yazmak zaman aldı. Ancak, bu süreç bana sunucu tarafı programlamanın temellerini anlamamda büyük katkı sağladı.

CSS tarafında ise renk tonunu ayarlamak uzun sürdü, oyunun atmosferini yansıtacak ama göz yormayacak bir palet bulmak için birçok deneme yaptım. Sonunda, koyu gri ve kırmızının dengesi istediğim etkiyi verdi.

PHP ise daha uzun metinler ve görselliği aynı anda yönettim, hem hikaye bazlı, hem de görsel olarak zengin bir deneyim yaratmak için kodu düzenlemek zor oldu, ama sonunda istediğim sonucu aldım.

Öğrendiklerim

Bu proje bana localhost ortamında PHP ile çalışmanın temellerini öğretti. Form verilerini işlemek, kullanıcı doğrulaması yapmak ve dinamik içerik sunmak gibi temel becerileri kazandım. Ayrıca, frontend ve backend arasındaki etkileşimi daha iyi anladım, bu da bana full-stack geliştirme konusunda daha geniş bir perspektif kazandırdı. Giriş yapma ve kayıt olma işlevlerini uygulamak, kullanıcı yönetimi konusunda temel bir anlayış geliştirmemi sağladı. Bu deneyim, gelecekte daha karmaşık projelerde kullanıcı kimlik doğrulaması ve veri yönetimi konularında bana yardımcı olacak.

PHP ile sunucu tarafı mantığını anlamak, frontend'i daha bilinçli yazmamı sağladı. Verinin nereden geldiğini, nasıl işlendiğini ve HTML'e nasıl dönüştüğünü görmek; full-stack düşünmeyi somutlaştırdı. Artık bir arayüz tasarlarken aynı anda sunucuda ne olduğunu da zihnimde canlandırabiliyorum.

Son olarak: tamamlamak, mükemmelleştirmekten daha değerlidir. Bu proje, mükemmel bir ürün ortaya koymaktan çok, öğrenme sürecine odaklanmamı sağladı. Eksiklikler olabilir, ama önemli olan başladığım noktadan ne kadar ilerlediğim ve öğrendiğim. Netflix tarzında her detayı düşünürek kodlama olaylarını yaptım, local olarak çalıştırdım, ve bu süreç bana çok şey kattı. Umarım ileride daha büyük projelerde bu temelleri kullanarak daha da gelişirim.